/*------------------------------------------ // 1.RESET // Remove margin and padding from elements and other resets //------------------------------------------*/ html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } :focus { outline: 0; } table { border-collapse: collapse; border-spacing: 0; } acronym { cursor: help; } /*------------------------------------------ // 2.GENERIC CLASSES // Define styles for simple things like floating to the sides, text aligning, image-replacements, clearfix etc //------------------------------------------*/ html { font-size: 100.01%; } body { font-size: 62.5%; line-height:1em; } /*---- Input fields ----*/ input, select, textarea { font-size: 100%; } textarea { padding: 2px 3px; font-family: Verdana, sans-serif; } /*---- Floats ----*/ .flR { float: right; } .flL { float: left; } /*---- Horizontal Alignment ----*/ .alR { text-align: right; } .alC { text-align: center; } /*---- Vertical Alignment ----*/ .vlT {vertical-align:top;} .vlB {vertical-align:bottom;} /*---- Hide ----*/ .hide { display: none; } /*---- Float Clearing fixes ----*/ .clear { clear: both; height:1px; line-height:1px; } .clearFix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } /*---- Image Replacement Technique ----*/ .ir { position: relative; overflow: hidden; } .ir span { position: absolute; top: 0; text-indent: -1000em;} /*---- Links ----*/ a:link, a:visited { text-decoration: none; cursor/**/: /**/pointer; } a:link:hover, a:visited:hover { text-decoration: underline; } /*------------------------------------------ // 3.BASIC ELEMENTS //------------------------------------------*/ body { color:#000; background:#3a3833; font-family: Arial, Helvetica, sans-serif; } h1, h2, h3, h4, p, li { line-height:1.0em; } h2{font-size:200%; margin-bottom:10px; color:#FFF; font-weight:normal;} h3{color:#4598aa; font-size:140%;} h3 a{color:#4598aa;} ul li, ol li{font-size:120%; color:#656258;} ul.list{margin-bottom:23px;} ul.list li{background:transparent url(../images/content/arrow1.gif) no-repeat 0px 0px; padding-left:20px; font-size:140%; margin-bottom:12px; font-weight:bold; line-height:15px;} ul.list1 li{width:164px; background:transparent url(../images/content/bullets.gif) no-repeat 0px 2px; padding-left:13px; float:left; margin-bottom:5px; font-weight:bold;} ul.list2 li{background:transparent url(../images/content/double_arrow.gif) no-repeat 5px 3px;} ul.list3 li{background:transparent url(../images/content/arrow2.gif) no-repeat 0px 4px; margin-left:6px; line-height:17px;} p.border span{ background:transparent url(../images/content/left_line.gif) no-repeat 0px 100%; padding:20px 20px 0px 20px; display:block; } p.border { background:transparent url(../images/content/right_line.gif) no-repeat 100% 100%; margin:0px -30px; position:relative; } div#content div.box1 h2{margin-bottom:5px; padding-left:5px;} div#content div.wrapper div.project div.right h4{font-size:210%;} div.autocomplete4 { position:absolute; width:500px; background-color:#EADDB1; margin:0px; padding:0px; font-size:0.9em; text-align:left; max-height:200px; overflow:auto; color:#007DA7; } div.autocomplete4 ul { list-style-type:none; margin:0px; padding:0px; } div.autocomplete4 ul li.selected { background-color: #FFF; color:black; } div.autocomplete4 ul li { list-style-type:none; display:block; margin:0; padding:2px; cursor:pointer; color:#656258; font-size:190%; } .combo4 { margin: 0px 5px 10px 0px; font-family:Verdana, Geneva, Arial, Helvetica, sans-serif; font-size:150%; width:265px; display:block; background: url('../images/content/select_bg.jpg') #fff top right no-repeat; height:27px;padding: 3px 5px 0px; cursor: pointer; border:0px; color:#000; float:right;} /*------------------------------------------ // 4.LAYOUT // Define the basic template: header, footer, etc. Elements that help to define the basic layout of the site //------------------------------------------*/ /*---- Wrapper ----*/ div.wrapper { width:994px; margin:0px auto; } /*---- Container ----*/ div#container {background:transparent url(../images/container/container_bg.jpg) no-repeat center 0px; min-width:1000px; } /*---- Header ----*/ div#header { background:transparent url(../images/header/header_bg1.jpg) no-repeat center 0px; height:94px;} /*---- Navigation ----*/ div#navigation { padding:43px 6px 0px 0px; } /*---- Banner ----*/ div#banner { background:transparent url(../images/banner/banner_bg.png) no-repeat center 100%; clear:both; position:relative; } div#banner div.wrapper { position:relative; padding:0px 0px 0px; height:413px; } /*---- Content ----*/ div#content { background:#f3ebd5 url(../images/content/bottom_border.gif) repeat-x 0px 100%; clear:both; } div#content div.wrapper{padding:23px 0px 59px 0px;} div#content div.divider_bottom{background:transparent url(../images/content/line_bottom.gif) no-repeat 587px 100%;} div#content div.divider_top{background:transparent url(../images/content/line_top.gif) no-repeat 587px 0px; padding:10px 0px; width:100%;} /*---- Content - Left ----*/ div#content div.left{ width:562px; float:left; padding-left:22px;} /*---- Content - Right ----*/ div#content div.right{ width:315px; float:right; padding:10px 15px 0px 0px;} /*---- Communicate ----*/ div#communicate { padding:36px 0px 30px 0px; background:#514E47 url(../images/content/shadow.gif) repeat-x 0px 0px; clear:both; } /*---- Footer ----*/ div#footer { clear:both; background:transparent url(../images/footer/footer_bg.gif) repeat-x 0px 0px; padding:22px 0px 20px 0px; } /*------------------------------------------ // 5. PAGE COMMON STYLES //------------------------------------------*/ /*---- Header - Logo ----*/ div#header div.logo h1, div#header div.logo h1 span, div#header div.logo a, div#header div.logo a span { display: block; width: 282px; height: 42px; overflow: hidden; } div#header div.logo{padding:37px 0px 0px 20px;} div#header div.logo h1, div#header div.logo a { position: relative; text-indent:-1000em; } div#header div.logo h1 span, div#header div.logo a span { position: absolute; top: 0; left: 0; z-index: 10; background: transparent url(../images/header/venveo_logo.png) no-repeat; } div#header div.logo a span { cursor: pointer; } /*---- Navigation ----*/ div#navigation ul li { float:left; } div#navigation ul li a { display:block; float:left; height:51px; } div#navigation ul li a span{text-indent:-1000em; display:block; } div#navigation ul li.about a{background:transparent url(../images/header/navigation_bg.png) no-repeat -3px -18px; width:105px; margin-right:-22px;} div#navigation ul li.about a:hover{background-position:-149px -18px;} div#navigation ul li.about a.active, div#navigation ul li.about a.active:hover{background-position: -305px -18px;} div#navigation ul li.work a{background:transparent url(../images/header/navigation_bg.png) no-repeat -5px -74px; width:103px; margin-right:-14px;} div#navigation ul li.work a:hover{background-position:-151px -74px;} div#navigation ul li.work a.active, div#navigation ul li.work a.active:hover{background-position:-307px -74px;} div#navigation ul li.service a{background:transparent url(../images/header/navigation_bg.png) no-repeat -11px -131px; width:107px; margin-right:-14px;} div#navigation ul li.service a:hover{background-position:-157px -131px;} div#navigation ul li.service a.active, div#navigation ul li.service a.active:hover{background-position:-313px -131px;} div#navigation ul li.blog a{background:transparent url(../images/header/navigation_bg.png) no-repeat -11px -185px; width:107px; margin-right:-22px;} div#navigation ul li.blog a:hover{background-position: -157px -185px;} div#navigation ul li.blog a.active, div#navigation ul li.blog a.active:hover{background-position: -313px -185px;} div#navigation ul li.contact a{background:transparent url(../images/header/navigation_bg.png) no-repeat -7px -247px; width:106px;} div#navigation ul li.contact a:hover{background-position:-153px -247px;} div#navigation ul li.contact a.active, div#navigation ul li.contact a.active:hover{background-position:-309px -247px;} /*---- Content ----*/ div#content h1 {color:#3c3a34; font-size:290%;} div#content h2 {font-size:200%;} div#content p {color:#656258; font-size:130%; line-height:18px; margin-bottom:18px; } /*---- Communicate ----*/ div#communicate h2 { text-transform:uppercase; margin-bottom:7px; font-size:200%; letter-spacing:-1px; } div#communicate p { color:#d2ccbe; font-size:120%; line-height:12px; margin-bottom:5px; margin-bottom:14px;} /*---- Communicate - Column1 ----*/ div#communicate div.column1 { width:224px; padding-left:25px; } div#communicate div.column1 p{font-size:11px; color:#9b9685;} div#communicate div.column1 p { font-weight:bold;} div#communicate div.column1 p a{color:#4598aa; margin-left:4px;} /*---- Communicate - Column1 - Post ----*/ div#communicate div.column1 p{margin-bottom:0px;} div#communicate div.column1 p a.more-link{color:#FFF; background:transparent url(../images/content/arrow.gif) no-repeat 0px 3px; padding-left:10px; font-weight:bold; font-size:120%; margin-left:0px;} div#communicate div.column1 p a.more-link:hover{background-position:0px -38px; text-decoration:none; color:#4598aa;} div#communicate div.column1 p.line {background:transparent url(../images/content/bottom_border1.gif) no-repeat 0px 0px; height:2px; line-height:2px; margin:6px 0px;} /*---- Communicate - Column2 ----*/ div#communicate div.column2 { width:347px; padding-left:56px; } div#communicate div.column2 div.adr{width:100%; float:left;} div#communicate div.column2 div.adr div.box{width:154px; float:left; padding-right:17px;} div#communicate div.column2 div.adr div.box p{ line-height:16px; margin-bottom:0px;} div#communicate div.column2 div.adr div.box a{color:#fff;} div#communicate div.column2 div.adr div.box a:hover{ color:#4598AA; text-decoration:none;} div#communicate div.column2 div.application{padding:25px 0px 0px 0px; clear:both;} div#communicate div.column2 div.application ul{width:100%; overflow:hidden;} div#communicate div.column2 div.application ul li{float:left; padding:3px 12px 3px 0px;} div#communicate div.column2 div.application ul li a{color:#fff; font-size:100%; font-weight:bold; padding-left:23px;} div#communicate div.column2 div.application ul li.twitter{background:url(../images/content/icons.gif) no-repeat 0px 0px;} div#communicate div.column2 div.application ul li.facebook{background:url(../images/content/icons.gif) no-repeat 0px -31px;} div#communicate div.column2 div.application ul li.rss{background:url(../images/content/icons.gif) no-repeat 0px -62px;} div#communicate div.column2 div.application ul li a:hover{color:#4598aa; text-decoration:none;} /*---- Communicate - Column3 ----*/ div#communicate div.column3 {width:314px;} div#communicate div.column3 table { width:100%; } div#communicate div.column3 table td{padding-bottom:8px;} div#communicate div.column3 table td label{font-size:140%;} div#communicate div.column3 table td p.textfield{background:transparent url(../images/content/form_fields.gif) no-repeat -223px -40px; width:140px; padding:4px 10px; margin-bottom:0px;} div#communicate div.column3 table td#name p input{background:none; border:0; color:#d2ccbe; font-size:120%; width:135px;} div#communicate div.column3 table td#name p.focus {background:transparent url(../images/content/form_fields.gif) no-repeat 0px -40px;} div#communicate div.column3 table td#email p input{background:none; border:0; color:#d2ccbe; font-size:120%; width:135px;} div#communicate div.column3 table td#email p.focus {background:transparent url(../images/content/form_fields.gif) no-repeat 0px -40px;} div#communicate div.column3 table td p.textarea{background:transparent url(../images/content/form_fields.gif) no-repeat 0px -31px; width:360px; height:96px; padding:1px 10px;} div#communicate div.column3 table td p.textarea textarea{background:none; border:0; width:360px; height:86px; margin-top:5px; color:#d2ccbe; font-size:110%; padding:0px;} div#communicate div.column3 table td p.textarea.focus {background-position:0px -132px;} div#communicate div.column3 table td input.submit{background:transparent url(../images/content/join.jpg) no-repeat 0px -0px; width:79px; height:32px; float:left; border:0; cursor:pointer; margin-left:-2px;} div#communicate div.column3 table td input.submit:hover{background-position:0px -32px;} /*---- Communicate - Column3 ----*/ div#communicate div.column3 { width:313px; } div#communicate div.column3 ul li{font-size:120%; font-weight:bold; padding:4px 0px 4px 24px; margin-bottom:5px; } div#communicate div.column3 a{color:#FFF; text-decoration:none;} /*---- Box2 ----*/ div.box2-top-left { background:transparent url(../images/content/rounded_top_left.gif) no-repeat 0 0; padding-left:12px; } div.box2-top-right { background:transparent url(../images/content/rounded_top_right.gif) no-repeat 100% 0; padding-right:12px; } div.box2-top-middle { background:transparent url(../images/content/top_bg.gif) repeat-x 0 0; height:12px; line-height:12px; } div.box2-content { border:1px solid #dcd4c0; border-width:0px 1px; background:#e8e0ca; padding:0 0 4px 20px; } div.box2-bottom-left { background:transparent url(../images/content/rounded_bottom_left.gif) no-repeat 0 0; padding-left:12px; } div.box2-bottom-right { background:transparent url(../images/content/rounded_bottom_right.gif) no-repeat 100% 0; padding-right:12px; } div.box2-bottom-middle { background:transparent url(../images/content/bottom_bg.gif) repeat-x 0 100%; height:12px; line-height:12px; } /*---- Box3 ----*/ div.box3-top-left { background:transparent url(../images/content/boxes/box3-top-left.gif) no-repeat 0 0; padding-left:12px; } div.box3-top-right { background:transparent url(../images/content/boxes/box3-top-right.gif) no-repeat 100% 0; padding-right:12px; } div.box3-top-middle { background:#dfd7c0; border-top:1px solid #dcd4c0; height:11px; line-height:11px; } div.box3-content { border:1px solid #dcd4c0; border-width:0px 1px; background:#dfd7c0; padding:5px 0 4px 14px; } div.box3-bottom-left { background:transparent url(../images/content/boxes/box3-bottom-left.gif) no-repeat 0 0; padding-left:12px; } div.box3-bottom-right { background:transparent url(../images/content/boxes/box3-bottom-right.gif) no-repeat 100% 0; padding-right:12px; } div.box3-bottom-middle { background:#dfd7c0; border-bottom:1px solid #dcd4c0; height:11px; line-height:11px; } /*---- Form - Elements ----*/ /*---- Form1 ----*/ div#content div.form1 p, div#content div.form2 p { font-size:100%; margin-bottom:0; } div.form1 label { float:left; color:#306b78; font-size:140%; font-weight:bold; width:92px; line-height:1.2em; padding:21px 0 0 4px; display:block; } /*---- Form2 ----*/ div#content div.form2 h3 { color:#306b78; margin-bottom:5px; } div.form2 label { float:left; color:#656258; font-size:120%; font-weight:bold; width:61px; line-height:1.2em; padding:21px 0 0 0; display:block; } div.form2 p.message { padding-top:15px; } div.form2 p.message label { float:none; width:auto; padding:0; margin-bottom:5px; } div.form2 span.textbox3 { float:left; } /*---- Textboxes ----*/ /*---- Textbox2 ----*/ span.textbox2 { background:url(../images/content/input_box.jpg) no-repeat left top; padding-left:15px; display:block; overflow:hidden; height:56px; width:317px; } span.textbox2 span.inner { background:url(../images/content/input_box.jpg) no-repeat right top; display:block; height:28px; padding:14px 15px 14px 0; } span.textbox2.focus { background-position:left -56px; } span.textbox2.focus span.inner { background-position:right -56px; } span.textbox2 input.textbox { width:100%; padding:7px 0; border:0; background:none; font-size:120%; } /*---- Textbox3 ----*/ span.textbox3 { background:url(../images/content/textbox3.gif) no-repeat left top; padding-left:15px; display:block; overflow:hidden; width:337px; height:56px; } span.textbox3 span.inner { background:url(../images/content/textbox3.gif) no-repeat right top; display:block; height:28px; padding:14px 15px 14px 0; } span.textbox3.focus { background-position:left bottom; } span.textbox3.focus span.inner { background-position:right bottom; } span.textbox3 input.textbox { width:100%; padding:7px 0; border:0; background:none; font-size:120%; } /*---- Textarea1 ----*/ span.textarea1 { display:block; background:url(../images/content/textarea1-bg.gif) no-repeat left top; padding-left:15px; width:409px; margin-left:-10px; position:relative; } span.textarea1 span.inner { display:block; background:url(../images/content/textarea1-bg.gif) no-repeat right top; height:92px; padding:17px 15px 23px 0; } span.textarea1.focus { background-position:bottom left; } span.textarea1.focus span.inner { background-position:bottom right; } span.textarea1 textarea { width:100%; height:92px; border:0; background:none; padding:0; } /*---- Footer ----*/ div#footer p {color:#d2ccbe; font-size:100%;} /*---- Footer - Copyright ----*/ div#footer div.copyright { padding-left:27px; } /*---- Footer - Navigation ----*/ div#footer div.navigation { padding-right:22px;} div#footer div.navigation ul li { font-size:100%; color:#FFF; display:inline; padding-left:5px; } div#footer div.navigation ul li a{color:#FFF; font-weight:bold;} div#footer div.navigation ul li a:hover{color:#d2ccbe; text-decoration:none;} /*------------------------------------------ // 6. INDEX PAGE STYLES //------------------------------------------*/ /*---- Banner - Statement ----*/ div#banner div.statement {width:560px; padding:61px 0px 0px 24px; float:left;} div#banner div.statement h1 {background:transparent url(../../assets/images/banner/quote.png) no-repeat 0px 0px; width:534px; height:143px; margin-bottom:22px;} div#banner div.statement p {color:#def9ff; font-size:180%;} div#banner div.statement p span{text-transform:uppercase;} /*---- Banner - See Our Work Button ----*/ div#banner a#our_work_btn { background:transparent url(../images/banner/see_work.png) no-repeat 0px 0px; display:block; position:absolute; height:53px; width:217px; color:#67d9f2; bottom:23px; left:14px; } div#banner a#our_work_btn:hover {background-position:0px -65px;} div#banner a#our_work_btn.active { background-position: 0px 100%; } /*---- Banner - Projects ----*/ div#banner div.projects { width:388px; height:385px; padding:0px 11px 0 0; float:right; margin-top:15px; position:relative; } div#banner div.projects div.project { height:385px; } div#banner div.projects div.project div.description { background:transparent url(../images/banner/dots.gif) no-repeat scroll 0 0; bottom:13px; left:-343px; padding-left:24px; position:absolute; width:307px; padding-top:10px; } div#banner div.projects div.project div.description h3 { color:#FFF; font-size:160%; margin-bottom:8px; letter-spacing:1px; } div#banner div.projects div.project div.description p { color:#def9ff; font-size:120%; line-height:14px;} div#banner div.projects div.project div.description p a { color:#67d9f2; border-bottom:#67d9f2 1px dotted; text-decoration:none; } div#banner div.projects div.project div.description p a:hover { color:#2c616c; border-bottom:#2c616c 1px dotted;} div#banner div.projects div.project div.samples { position:relative; } div#banner div.projects div.project div.samples li { position:absolute; bottom:0; left:0; width:385px; height:388px; } div#banner div.projects div.pagination {position:absolute; bottom:4px; position:absolute; right:40px; z-index:10; } div#banner div.projects div.pagination a { background:transparent url(../images/banner/buttons.png) no-repeat -19px 0px; height:14px; width:14px; float:left; display:block; margin-right:5px; text-decoration:none;} div#banner div.projects div.pagination a.activeSlide { background-position:0px 0px;} /*---- Content - What We Do ----*/ div#content div#what_we_do { width:550px; padding-left:35px; overflow:hidden; float:left; } div#content div#what_we_do h1 { letter-spacing:-1px; margin-left:10px; text-transform:uppercase; } /*---- Content - What We Do - Tab Section - Tabs ----*/ div#content div#what_we_do div.tab_section ul.tabs { background:transparent url(../images/content/tabs.gif) no-repeat 0px -94px; width:100%; overflow:hidden; margin:0px 0px 12px -15px; } div#content div#what_we_do div.tab_section ul.tabs li{float:left; font-family:BreuerText, Arial, Helvetica; font-size:180%; background:transparent url(../images/content/tab_border.gif) no-repeat 0px 6px; padding-left:2px;} div#content div#what_we_do div.tab_section ul.tabs li a{float:left; width:106px; color:#827e74; text-decoration: none; padding:26px 0px; text-align:center;} div#content div#what_we_do div.tab_section ul.tabs li.first a:hover, div#content div#what_we_do div.tab_section ul.tabs li.first a.active{background:transparent url(../images/content/tabs.gif) no-repeat 0px 3px;} div#content div#what_we_do div.tab_section ul.tabs li.last a:hover, div#content div#what_we_do div.tab_section ul.tabs li.last a.active{background:transparent url(../images/content/tabs.gif) no-repeat -329px 3px;} div#content div#what_we_do div.tab_section ul.tabs li.first{background:none;} div#content div#what_we_do div.tab_section ul.tabs li a:hover, div#content div#what_we_do div.tab_section ul.tabs li a.active{background:transparent url(../images/content/tabs.gif) no-repeat -160px 3px; color:#d30000;} div#content div#what_we_do div.tab_section ul.tabs li a span{text-indent:-1000em;} div#content div#what_we_do div.tab_section ul.tabs li.web a span{ float:left; background:url(../images/content/tab_menu.gif) no-repeat 32px -3px; width:76px; height:20px;} div#content div#what_we_do div.tab_section ul.tabs li.web a:hover span, div#content div#what_we_do div.tab_section ul.tabs li.web a.active span{background:url(../images/content/tab_menu.gif) no-repeat 32px -31px;} div#content div#what_we_do div.tab_section ul.tabs li.print a span{ float:left; background:url(../images/content/tab_menu.gif) no-repeat -78px -3px; width:85px; height:20px;} div#content div#what_we_do div.tab_section ul.tabs li.print a:hover span, div#content div#what_we_do div.tab_section ul.tabs li.print a.active span{background:url(../images/content/tab_menu.gif) no-repeat -78px -31px;} div#content div#what_we_do div.tab_section ul.tabs li.branding a span{ float:left; background:url(../images/content/tab_menu.gif) no-repeat -185px -3px; width:90px; height:20px;} div#content div#what_we_do div.tab_section ul.tabs li.branding a:hover span, div#content div#what_we_do div.tab_section ul.tabs li.branding a.active span{background:url(../images/content/tab_menu.gif) no-repeat -185px -31px;} div#content div#what_we_do div.tab_section ul.tabs li.marketing a span{ float:left; background:url(../images/content/tab_menu.gif) no-repeat -295px -3px; width:90px; height:20px;} div#content div#what_we_do div.tab_section ul.tabs li.marketing a:hover span, div#content div#what_we_do div.tab_section ul.tabs li.marketing a.active span{background:url(../images/content/tab_menu.gif) no-repeat -295px -31px;} div#content div#what_we_do div.tab_section ul.tabs li.other a span{ float:left; background:url(../images/content/tab_menu.gif) no-repeat -405px -3px; width:90px; height:20px;} div#content div#what_we_do div.tab_section ul.tabs li.other a:hover span, div#content div#what_we_do div.tab_section ul.tabs li.other a.active span{background:url(../images/content/tab_menu.gif) no-repeat -405px -31px;} /*---- Content - What We Do - Tab Section - Tab Content ----*/ div#content div#what_we_do div.tab_section div.tab_content { display:none !important; } div#content div#what_we_do div.tab_content h2 { color:#4598aa; font-weight:normal; margin-bottom:0px; } div#content div#what_we_do div.tab_section div.active { display:block !important; } div#content div#what_we_do div.tab_section div.icon img{ padding-top:5px;} div#content div#what_we_do div.tab_content div.detail { float:right; width:410px; padding:0px 0px 0px 0px; } div#content div#what_we_do div.tab_content div.detail p { color:#656258; font-size:130%; line-height:18px; margin-bottom:18px; } div#content div#what_we_do div.tab_content div.detail ul{margin-bottom:10px; position:relative; overflow:hidden; width:400px;} div#content div#what_we_do div.tab_content div.detail ul li{background:transparent url(../images/content/bullets.gif) no-repeat 0px 5px; padding-left:10px; font-size:120%; color:#656258; float:left; width:207px; margin-right:-50px; line-height:18px;} /*---- Content - What We Do - Tab Content - About Web Button ----*/ div#content div#what_we_do div.tab_content div.detail a.about_web_btn { background:transparent url(../images/content/buttons.gif) no-repeat 0px 0px; height:31px; display:block; left:-3px; position:relative; color:#d30000; font-size:140%; line-height:30px; padding-left:15px; float:left; } div#content div#what_we_do div.tab_content div.detail a.about_web_btn span.inner{ display:block; background:transparent url(../images/content/buttons.gif) no-repeat right 0px; padding-right:30px; } div#content div#what_we_do div.tab_content div.detail a.about_web_btn:hover{background-position:0px -31px; text-decoration:none;} div#content div#what_we_do div.tab_content div.detail a.about_web_btn:hover span.inner{background-position:100% -31px; text-decoration:none;} /*---- Content - Who We Have Done Work For ----*/ div#content div#who_we_done { width:350px; padding-right:13px; float:right; padding-left:5px; } div#content div#who_we_done h1 { letter-spacing:-1px; margin-bottom:9px; text-transform:uppercase; } /*---- Content - Who We Have Done Work For - Box ----*/ div#content div#who_we_done div.box{width:360px; margin-bottom:10px; margin-left:-5px;} div#content div#who_we_done div.box div.top{background:transparent url(../images/content/box.gif) no-repeat 0px 0px; height:15px;} div#content div#who_we_done div.box div.middle{background:transparent url(../images/content/box.gif) repeat-y -356px 0px; padding:2px 0px 2px 15px;} div#content div#who_we_done div.box div.middle ul{width:100%; overflow:hidden;} div#content div#who_we_done div.box div.middle ul li{float:left; width:150px; padding:15px 10px;} div#content div#who_we_done div.box div.bottom{background:transparent url(../images/content/box.gif) no-repeat -712px 0px; height:20px;} /*---- Content - Who We Have Done - Client Button ----*/ div#content div#who_we_done a#client_btn{background:transparent url(../images/content/buttons.gif) no-repeat 0px -62px; width:200px; height:32px; float:left; position:relative;} div#content div#who_we_done a#client_btn:hover{background-position:0px -94px;} /*------------------------------------------ // 7. WORK PAGE STYLES //------------------------------------------*/ /*---- Content - Content header ----*/ div#content div.content_header h1 { font-size:660%; font-weight:normal; float:left; } div#content div.content_header { background:transparent url(../images/content/border_line.gif) no-repeat 50% 100%; padding:26px 0px 26px 26px; margin-bottom:19px;} div#content.work div.right{ width:360px;} /*---- Content - Content header - Controls ----*/ div#content div.content_header div.right { padding:25px 17px 0px 0px; float:right; width:auto; } div#content div.content_header div.right a.project_btn { background:transparent url(../images/content/buttons.gif) no-repeat 0px -186px; height:31px; float:right; width:194px;} div#content div.content_header div.right a.project_btn:hover{background-position:0px -217px;} div#content div.content_header div.right a.work_btn{background:transparent url(../images/content/buttons.gif) no-repeat 0px -424px; height:31px; float:right; width:172px;} div#content div.content_header div.right a.work_btn:hover{background-position:0px -454px;} /*---- Content - Content header - Next Previous Buttons ----*/ div#content div.content_header div.right div.next_previous { float:right; } div#content div.content_header div.right div.next_previous div.next, div#content div.content_header div.right div.next_previous div.previous { position:relative; z-index:100; width:36px; float:left; } div#content div.content_header div.right div.next_previous div.popup { position: absolute; display: none; width:190px; z-index:1000; } div#content div.content_header div.right div.next_previous div.popup div.top{background: url(../images/content/pop_up_top.png) no-repeat 0px 100% ; height:8px; position:relative; line-height:8px; } div#content div.content_header div.right div.next_previous div.popup div.middle{background: url(../images/content/pop_up_middle.png) repeat-y 0px 0px; padding:1px 20px; position:relative; text-align:center; height:30px; } div#content div.content_header div.right div.next_previous div.popup div.bottom{background:url(../images/content/pop_up_bottom.png) no-repeat 0px 0px; height:23px; position:relative;} div#content div.content_header div.right div.next_previous div.popup div.middle h2{color:#4598aa; font-size:140%; font-weight:bold; margin-bottom:3px; visibility:visible;}div#content div.content_header div.right div.next_previous div.popup div.middle p{color:#656258; } div#content div.content_header div.right div.next_previous div.popup p{margin-bottom:4px; line-height:13px;} div#content div.content_header div.right a, div#content div.content_header span{float:left; height:32px;} div#content div.content_header div.right div.next_previous div.previous a { background:transparent url(../images/content/buttons.gif) no-repeat 0px -249px; width:36px;} div#content div.content_header div.right div.next_previous div.previous a:hover {background-position:0px -283px;} div#content div.content_header span.pipe{background:transparent url(../images/content/buttons.gif) no-repeat -38px -249px; width:2px;} div#content div.content_header div.right div.next_previous div.next a {background:transparent url(../images/content/buttons.gif) no-repeat -40px -249px; width:36px;} div#content div.content_header div.right div.next_previous div.next a:hover{background-position:-40px -283px;} div#content div.content_header div.right div.next_previous div.previous-single , div#content div.content_header div.right div.next_previous div.next-single{float:left; position:relative; z-index:100; width:32px;} div#content div.content_header div.right div.next_previous div.previous-single a { background:transparent url(../images/content/button-single.gif) no-repeat 0px 0px; width:32px;} div#content div.content_header div.right div.next_previous div.previous-single a:hover {background-position:0px -31px;} div#content div.content_header div.right div.next_previous div.next-single a {background:transparent url(../images/content/button-single.gif) no-repeat -33px 0px; width:32px;} div#content div.content_header div.right div.next_previous div.next-single a:hover{background-position:-33px -31px;} /*---- Content - left - Sites ----*/ div#content div.left div.slideshow {margin-bottom:26px;} div#content div.left div.slideshow div.project{width:100%; position:relative; } div#content div.left div.slideshow div.project img{position:absolute; left:-6px; top:-7px;} div#content div.left div.slideshow div.project a{ left:-15px!important; top:-5px!important;} div#content div.left div.slideshow div.project span{position:absolute; background:url(../images/content/big_placeholder1.png) no-repeat 0px 0px; width:596px; height:452px; left:-11px; top:-15px;} div#content div.left div.slideshow div.project div.project_top{width:100%} div#content div.left div.slideshow div.project div.project_bottom{ width:100%; padding:1px 0px 20px 0px; text-align:center;} /*---- Content -Sites navigation ----*/ div#content div.left div.slideshow div.sites_navigation {background:transparent url(../images/content/rounded_bottom.jpg) no-repeat 0px 0px; height:56px; width:565px; margin-left:-4px; position:relative; z-index:10; margin-top:-10px;} div#content div.left div.slideshow div.sites_navigation div.pagination{padding:18px 0px 0px 17px; background:none;} div#content div.left div.slideshow div.sites_navigation div.pagination a{ float:left; width:15px; height:14px; background:transparent url(../images/content/buttons.gif) no-repeat -40px -324px; margin-right:5px;} div#content div.left div.slideshow div.sites_navigation div.pagination a:hover{text-decoration:none;} div#content div.left div.slideshow div.sites_navigation div.pagination a:hover, div#content div.left div.slideshow div.sites_navigation div.pagination a.activeSlide {background-position:-22px -324px;} div#content div.left div.slideshow div.sites_navigation div.pagination a.previous, div#content div#main div.sites_navigation div.pagination a.previous:hover{background:transparent url(../images/content/buttons.gif) no-repeat 0px -324px!important;} div#content div.left div.slideshow div.sites_navigation div.pagination a.next, div#content div#main div.sites_navigation div.pagination a.next:hover{background:transparent url(../images/content/buttons.gif) no-repeat -65px -324px!important;} div#content div.left div.slideshow div.sites_navigation div.pagination span.pipe {float:left; background:transparent url(../images/content/buttons.gif) no-repeat -84px -324px; width:2px; height:30px; margin:-5px 6px 0px 6px;} div#content div.left div.slideshow div.sites_navigation div.pagination a.zoom, div#content div#main div.sites_navigation div.pagination a.zoom:hover{background:transparent url(../images/content/buttons.gif) no-repeat -95px -324px!important; height:20px; margin-top:-5px;} div#content div.left div.slideshow div.sites_navigation a.launch_btn{background:transparent url(../images/content/launch_site.jpg) no-repeat 0px 0px; width:124px; height:31px; margin:9px 16px 0px 0px;} div#content div.left div.slideshow div.sites_navigation a.launch_btn:hover{background-position:0px -34px;} /*---- Content - Main - Work ----*/ div#content div.left div.box{ margin-bottom:33px;} div#content.work div.left div.box{ width:555px;} div#content div.left div.box div.box_top{background:transparent url(../images/content/top_bg.gif) repeat-x 0px 0px; height:12px; line-height:12px;} div#content div.left div.box div.box_top_left{background:transparent url(../images/content/rounded_top_left.gif) no-repeat 0px 0px; float:left; width:12px; height:12px;} div#content div.left div.box div.box_top_right{background:transparent url(../images/content/rounded_top_right.gif) no-repeat 100% 0px; height:12px; float:right; width:12px; height:12px;} div#content div.left div.box div.box_middle{border-color:#dcd4c0; border-style:solid; border-width:0px 1px; background:#e8e0ca; padding:1px 22px; width:516px;} div#content div.left div.box.testimonial div.box_middle, div#content div.left div.box.work_done div.box_middle{width:509px;} div#content div.left div.box div.box_bottom{background:transparent url(../images/content/bottom_bg.gif) repeat-x 0px 100%; height:12px; line-height:12px;} div#content div.left div.box div.box_bottom_left{background:transparent url(../images/content/rounded_bottom_left.gif) no-repeat 0px 0px; float:left; width:12px; height:12px;} div#content div.left div.box div.box_bottom_right{background:transparent url(../images/content/rounded_bottom_right.gif) no-repeat 100% 0px; height:12px; float:right; width:12px; height:12px;} div#content div.left div.box div.box_middle h2{color:#306b78; font-size:220%; text-transform:uppercase; } div#content div.right h2.breuer{margin-bottom:0px;} /*---- Content - Main - Box - Testimonial ----*/ div#content div.left div.testimonial blockquote{background:transparent url(../images/content/first_quote.gif) no-repeat 0px 0px; padding-top:5px;} div#content div.left div.testimonial blockquote p{color:#4598aa; text-indent:25px; font-size:140%;} div#content div.left div.testimonial blockquote p img{margin-bottom:-10px;} div#content div.left div.testimonial div.testimonial_by h3{color:#4a858e; font-size:160%;} div#content div.left div.testimonial div.testimonial_by p{color:#4a858e; font-size:110%; text-indent:10px; margin-bottom:0px; } /*---- Content - Left - Box - Work Done ----*/ div#content div.left div.work_done ul{width:540px;} div#content div.left div.work_done ul li{float:left; padding-right:19px; font-size:95%; margin-top:8px; position:relative; width:160px; background:none; padding:0px; margin-right:17px;} div#content div.left div.work_done ul li img{margin-bottom:3px;} div#content div.left div.work_done ul li p{padding-left:5px; font-weight:bold; margin-bottom:0px; clear:both;} div#content div.left div.work_done ul li a{float:left; width:159px; height:120px; overflow:hidden;} div#content div.left div.work_done ul li a span.rounded_corner{background:url(../images/content/placeholder3.png) no-repeat 0px 0px; width:159px; height:120px; position:absolute; left:0px; top:0px;} /*---- Content - Right ----*/ div#content div.right h1{color:#4598aa; font-size:300%; margin-bottom:8px; text-transform:uppercase;} div#content div.right h1 span{ text-transform:uppercase; } div#content div.right h2{font-size:240%; color:#4598AA; } div#content div.right h2 span{ color:#306b78;} div#content div.right h2.dark{text-transform:uppercase; color:#306b78; } div#content div.right h3{margin-bottom:10px; font-size:210%; font-weight:normal;} div#content div.right p.line{background:transparent url(../images/content/sidebar_line.gif) no-repeat 0px 0px; width:392px; margin:0px -18px; margin-bottom:15px; height:4px; line-height:4px;} div#content div.project div.right ul.list1 li{ width:145px;} /*------------------------------------------ // 7. WORK_HOME projects STYLES //------------------------------------------*/ div#content div.wrapper div.project div.right h2.challenge{ font-weight:bold;} div#content div.wrapper div.project div.right h4.breuer_light { color:#4598aa; font-weight:normal;} /*---- Content - Main ----*/ div#content div#main{width:725px; padding-left:12px; float:left;} /*---- Content - projects - Pagination ----*/ div#content div.pagination{ background:transparent url(../images/content/right_line.gif) no-repeat 100% 100%; clear:both; padding-top:10px;} div#content div.pagination div.pagination_right{background:transparent url(../images/content/left_line.gif) no-repeat 0px 100%; padding:0px 20px 1px 20px;} div#content div.pagination a{color:#d30000; line-height:18px; font-size:120%; border:1px dotted #F3EBD5;} div#content div.pagination a.previous{float:left;} div#content div.pagination a.previous:hover{border-bottom:#E6706E 1px dotted; text-decoration:none;} div#content div.pagination a.next{float:right;} div#content div.pagination a.next:hover{border-bottom:#E6706E 1px dotted; text-decoration:none;} div#content div.sites_navigation div.pagination a:hover{border-bottom:none;} div#content div.pagination.bottom{ background:transparent url(../images/content/right_line.gif) no-repeat 100% 0px; padding-top:0px;} div#content div.pagination.bottom div.pagination_right{ padding:50px 20px 0px 20px; background:transparent url(../images/content/left_line.gif) no-repeat 0px 0px;} div#content div.pagination p span{color:#9a9481;} /*---- Content - projects - Pagination - Active projects----*/ div#content div.pagination div.active_projects p{color:#9a9481;} div#content div.pagination div.active_projects p span{color:#656258;} /*---- Content - Sidebar ----*/ div#content div#sidebar{ width:208px; float:right; padding-right:14px;} div#content div#sidebar h2{ color:#306B78;} /*---- Content - Right - box1 ----*/ div#content div.box1{background:transparent url(../images/content/top_left_corner.gif) no-repeat 0px 0px; padding-left:17px; margin-bottom:13px; } div#content div.box1_right{background:transparent url(../images/content/top_right_corner.gif) no-repeat 100% 0px; padding:26px 17px 0px 0px; } div#content div.box1 ul li{margin:0px;} div#content div.box1.category ul li a{ padding:7px 0px 7px 36px; text-decoration:none; cursor:pointer;} div#content div.box1 ul li.web a{background:transparent url(../images/content/category_buttons.gif) no-repeat 0px -2px;} div#content div.box1 ul li.web a:hover{background-position:0px -345px;} div#content div.box1 ul li.web a.active, div#content div.box1 ul li.web a.active:hover{background-position:0px -190px;} div#content div.box1 ul li.print a{background:transparent url(../images/content/category_buttons.gif) no-repeat 0px -29px;} div#content div.box1 ul li.print a:hover{background-position:0px -371px;} div#content div.box1 ul li.print a.active{background-position:0px -216px;} div#content div.box1 ul li.branding a{background:transparent url(../images/content/category_buttons.gif) no-repeat 0px -56px;} div#content div.box1 ul li.branding a:hover{ background-position:0px -397px;} div#content div.box1 ul li.branding a.active{ background-position:0px -242px;} div#content div.box1 ul li.marketing a{background:transparent url(../images/content/category_buttons.gif) no-repeat 0px -84px;} div#content div.box1 ul li.marketing a:hover{background-position:0px -423px;} div#content div.box1 ul li.marketing a.active{background-position:0px -268px;} div#content div.box1 ul li.animation a{background:transparent url(../images/content/category_buttons.gif) no-repeat 0px -112px;} div#content div.box1 ul li.animation a:hover{background-position:0px -449px;} div#content div.box1 ul li.animation a.active{background-position:0px -294px;} div#content div.box1 ul li.other a{background:transparent url(../images/content/category_buttons.gif) no-repeat 0px -140px;} div#content div.box1 ul li.other a:hover{background-position:0px -475px;} div#content div.box1 ul li.other a.active{background-position:0px -320px;} div#content div.category ul li a{color:#656258; display:block; font-weight:bold; } div#content div.box1 ul li a{color:#656258; } div#content div.box1.category ul li a:hover{color:#d30000;} div#content div.box1 ul li a.active, div#content div.box1 ul li a.active:hover{color:#4598aa;} div#content div.box1 ul.list2 li{padding:0px 0px 0px 25px; margin-bottom:10px;} /*---- Content - Right - box1 - List5----*/ div#content div.box1 ul.list5 li{padding:0px; margin-bottom:0px; background:none; position:relative;} div#content div.box1 ul.list5 li a{display:block; background:url(../images/content/category_buttons.gif) no-repeat 100% 30px; text-decoration:none; cursor:pointer;} div#content div.box1 ul.list5 li a.active, div#content div.box1 ul.list4 li a.active:hover{background-position:100% -634px;} div#content div.box1 ul.list5 li a:hover{background-position:100% -660px;} div#content div.box1 ul.list5 li span{display:block; padding:7px 0px 7px 27px; background:url(../images/content/category_buttons.gif) no-repeat 0px -754px; font-weight:bold;} div#content div.box1 ul.list5 li span span{padding:0px; background:none; float:right; padding-right:10px; font-weight:normal;} div#content div.box1 ul.list5 li a span span{color:#9a9481;} div#content div.box1 ul.list5 li a:hover span{background-position:0px -728px; color:#d30000; text-decoration:none;} div#content div.box1 ul.list5 li a.active span, div#content div.box1 ul.list4 li a.active:hover span{background-position:0px -702px; color:#4598aa;} div#content div.box1 ul.list5 li a.active:hover{background-position:100% -634px;} div#content div.box1 ul.list5 li a.active:hover span{background-position:0px -702px;} /*---- projects ----*/ div.projects ul li{float:left;} div.projects ul li div.project_detail{background:transparent url(../images/content/bottom_curve.jpg) no-repeat 0px 100%; height:33px; padding:0px 10px;} div.projects ul li div.project_detail h2, div.projects ul li div.project_detail p{display:inline;} /*---- Content - projects - Projects List ----*/ div#content div.projects ul li{width:352px; padding:10px 0px 21px 8px; overflow:hidden;} div#content div.projects ul li div.project_pic {text-align:center; position:relative; width:354px; height:177px; overflow:hidden; } div#content div.projects ul li div.project_pic span.case_study{background:transparent url(../images/content/case_study.png) no-repeat 0px 0px; width:132px; height:80px; position:absolute; left:2px; top:6px;} div#content div.projects ul li div.project_pic a{position:absolute; top:-6px; left:1px; width:350px; overflow:hidden; height:193px;} div#content div.projects ul li div.project_pic span.corner{background: url(../images/content/corner.png) no-repeat 0px 0px; height:197px; left:-9px; position:absolute; top:-8px; width:360px;} div#content div.projects ul li div.title{padding:5px 0px 0px 0px; float:left;} div#content div.projects ul li div.category{float:right; padding:5px 4px 0px 0px;} div#content div.projects ul li div.category a{margin-left:4px; } div#content div.projects ul li div.project_detail h2 {color:#d30000; font-weight:bold; font-size:150%; margin-right:5px; margin-bottom:0px; float:left; } div#content div.projects ul li div.project_detail p{font-size:100%; margin-bottom:0px; line-height:22px; float:left; font-weight:bold; letter-spacing:-1px; } /*------------------------------------------ // 8. BLOG PAGE STYLES //------------------------------------------*/ div#content div.content_header a.subscribe_blog { background:transparent url(../images/content/subscribe_blog.jpg) no-repeat -6px -3px ; width:189px; height:29px;} div#content div.content_header a.subscribe_blog:hover {background-position:-6px -34px;} div#content div.blog { clear:both; } div#content div.blog div.pagination.bottom{margin:30px -20px 0px -20px;} /*---- Content - Blog - Right ----*/ div#content div.blog div.right{padding-top:0px;} div#content div.blog div.right ul.list3{padding-bottom:8px;} div#content div.blog div.right ul.list3 li{ margin-bottom:6px;} /*---- Content - Blog - Right - Search Form ----*/ div#content div.blog div.right div.search_form { background:transparent url(../images/content/search_box.gif) no-repeat 0px 0px; height:32px; padding:11px 10px 11px 17px; width:256px; margin:0px auto;} div#content div.blog div.right div.search_form * { vertical-align:top; } div#content div.blog div.right div.search_form input.textbox{width:146px; background:none; border:0; padding:5px 3px; color:#948e7d; font-size:140%; margin-top:2px;} div#content div.blog div.right div.search_form input.search{background:url(../images/content/buttons.gif) no-repeat 0px -486px; width:99px; height:33px; border:0; cursor:pointer;} div#content div.blog div.right div.search_form input.search:hover{background-position:0px -521px;} /*---- Content - Blog - Post ----*/ div#content div.blog div.post a { border-bottom:dotted 1px #F3EBD5; color:#d30000; } div#content div.blog div.post a:hover {text-decoration:none; border-bottom:dotted 1px #d30000;} div#content div.blog div.post h2 { font-size:260%; color:#4598aa; border-bottom:0; } div#content div.blog div.post h2 a { color:#4598aa; border-bottom:0;} div#content div.blog div.post h2 a:hover{text-decoration:none; border:none;} div#content div.blog div.post {padding:7px 0px;} div#content div.blog div.post p{font-size:120%;} /*---- Content - Blog - Post - Metadata ----*/ div#content div.blog div.post div.metadata { color:#9a9481; font-size:110%; margin-bottom:15px;} div#content div.blog div.post div.metadata span.categories { color:#656258;} div#content div.blog div.post div.metadata span.categories a {font-weight:bold; } /*---- Content - Blog - Post - Entry ----*/ div#content div.blog div.post div.entry {padding-bottom:15px;} div#content div.blog div.post div.entry div.post_image, div#content div.frame {position:relative; margin-bottom:10px; } div#content div.blog div.post div.entry div.post_image a, div#content div.frame p {display:block; overflow:hidden; border:none;} div#content div.blog div.post div.entry div.post_image span.placeholder, div#content div.frame p span.placeholder {position:absolute; width:587px; height:207px; background:url(../images/content/blog_image_holder.png) no-repeat 0px -4px; left:-19px; top:0px;} div#content div.blog div.post div.entry ol{margin:0px 0px 30px 40px;} div#content div.blog div.post div.entry ul{margin:0px 0px 30px 30px;} div#content div.blog div.post div.entry ol li{list-style:decimal outside; margin-bottom:5px;} div#content div.blog div.post div.entry ul li{background:transparent url(../images/content/bullets.gif) no-repeat 0px 0px; padding-left:13px; margin-bottom:6px;} div#content div.blog div.post div.entry div.pic_left p img{float:left; margin:0px 20px 5px 0px;} /*---- Content - Blog - Post - Footer ----*/ div#content div.blog div.post div.post_footer a {font-weight:bold; color:#d30000; font-size:120%; display:block; float:left;} div#content div.blog div.post div.post_footer a:hover { text-decoration:none; border:none; } div#content div.blog div.post div.post_footer a.more-link{float:left; color:#d30000; font-size:200%; font-weight:bold; text-transform:uppercase; background:url(../../assets/images/content/read_more.jpg) no-repeat 0px 0px; width:114px; height:14px; text-indent:-1000em; border:none; padding-bottom:3px;} div#content div.blog div.post div.post_footer a.more-link:hover{border-bottom:dotted 1px #D30000;} div#content div.blog div.post div.post_footer a.comments{background:transparent url(../images/content/comments_icon.gif) no-repeat 0px 0px; float:right; padding:5px 0px 4px 32px; margin-left:10px; } div#content div.blog div.post div.post_footer a.comments span{color:#D30000;} div#content div.blog div.post div.post_footer a.comments:hover span{border-bottom:dotted 1px #D30000;} div#content div.blog div.post div.post_footer a.share{background:transparent url(../images/content/share_icon.gif) no-repeat 0px 0px; float:right; padding:5px 0px 4px 32px; margin-left:10px;} div#content div.blog div.post div.post_footer a span span{color:#656258!important;} div#content div.blog div.post div.post_footer a.share span{color:#D30000;} div#content div.blog div.post div.post_footer a.share:hover span{border-bottom:dotted 1px #D30000;} /*---- Content - List3 ----*/ div#content div.box1 ul.list3 {padding:7px 0px 0px 6px;} div#content div.box1 ul.list3 li { padding-left:18px; margin-bottom:5px;} div#content div.box1 ul.list3 li span {float:right; color:#9a9481; } div#content div.box1 ul.list3 li a {text-decoration:none;} div#content div.box1 ul.list3 li a:hover, div#content div.box1 ul.list3 li a:hover span {color:#656258;} /*------------------------------------------ // 9. Comments Page Styles //------------------------------------------*/ /*---- Content - Comments ----*/ div#comments {margin:0px -20px -30px -20px;} div#comments div.comment{ background:transparent url(../images/content/fading_dots.gif) no-repeat 0px 100%; padding:10px 20px 10px 20px; margin-bottom:5px;} div#comments div.comment div.metadata span.name{color:#d30000; font-size:120%; font-weight:bold; } div#comments div.comment div.metadata span.time_stamp{ font-size:120%; color:#9a9481;} div#comments div.comment div.content{padding:15px 0px 0px 0px;} /*---- Content - Comment Form ----*/ div#content div.comment_form{margin-top:30px;} div#content div.comment_form h2{color:#4598aa; margin-bottom:5px; font-size:240%;} div#content div.comment_form dt span{font-size:90%;} div#content div.comment_form p{margin-bottom:10px;} /*---- Content - Comment Form - form----*/ div.box.form dl dt, div.box.form dl dd{line-height:1.2em;} div.box.form dl dt{width:100px; float:left; color:#306b78; font-size:140%; font-weight:bold; padding-top:18px;} div.box.form dl dt label{padding-left:5px;} div.box.form dl dd.textfield, div.box.form dl dd.center span.enter{background:transparent url(../images/content/input_box_bg.jpg) no-repeat 0px -3px; width:420px; float:left; margin-right:-6px; } div.box.form dl dd.textfield span{padding:0px;} div.box.form dl dd.textfield span span{background:transparent url(../images/content/input_box_normal.jpg) no-repeat scroll 100% -3px; padding:15px 13px 15px 17px; width:390px; float:left;} div.box.form dl dd.textfield.focus span span{background-position:100% -68px} div.box.form dl dd.center span.enter span{background:url(../images/content/input_box_normal.jpg) no-repeat 100% -3px; display:block; height:37px; padding:15px 13px 1px 13px;} div.box.form dl dd span.required span{background:url(../images/content/input_box_rightbg.jpg) no-repeat 100% -3px; display:block; height:37px; padding:15px 13px 1px 13px;} div.box.form dl dd.textfield.focus span.required span{background-position:100% -68px;} div.box.form dl dd.center span.enter.focus {background-position:0px -68px;} div.box.form dl dd.center span.enter.focus span{background-position:0px -68px;} div.box.form dl dd.center span.enter.required span{background:url(../images/content/input_box_rightbg.jpg) no-repeat 100% -3px;} div.box.form dl dt.center, div.comment_form dl dd.center{width:310px; margin:0px auto; display:block; float:none; margin-bottom:10px; overflow:hidden;} div.box.form dl dd.submit{display:block; text-align:center; float:none; clear:both; padding-top:20px;} div.box.form dl dd.submit input{background:url(../images/content/submit.jpg) no-repeat 0px 0px; height:46px; width:144px; border:none; cursor:pointer;} div.box.form dl dd.submit input:hover{background-position:0px -51px;} div.box.form dl dd.center span.codes{float:left;} div.box.form dl dd.center span.enter{width:149px; float:right; margin-top:-11px;} div.box.form dl dd.center span.enter span{padding:12px 10px 5px 10px; height:38px;} div.box.form dl dd.center span.enter.focus span{background-position:100% -68px;} div.box.form dl dd.center span.enter input{padding:4px; font-size:140%; background:none; border:0; width:120px;} div.box.form dl dd.textfield input, div.comment_form dl dd.textfield1 input{width:100%; font-size:140%; border:0; background:none; padding-top:3px;} div.box.form dl dd.textarea {background: url(../images/content/textarea.jpg) 0px 0px; display:block; clear:both; position:relative; margin:0px -5px; } div.box.form dl dd.textarea.required{background: url(../images/content/textarea.jpg) 0px 0px; height:100px; width:514px; padding:11px 7px;} div.box.form dl dd.textfield.small{width:289px; float:right;} div.box.form dl dd.textfield.small span span{width:264px;} div.box.form dl dd.textarea textarea{width:490px; height:77px; background:none; border:0; font-size:120%; padding:10px; } div.box.form dl dd.textarea.focus{background-position:0px -122px;} div.box.form dl dd.textarea.focus span span{background-position:100% -122px;} div.box.form dl dd.textfield.focus{background-position:0px -68px;} div.box.form dl dd.textfield.focus span.required span{background-position:100% -68px;} /*---- Content - Right - box1 - List6----*/ div#content div.box1 ul.list6 li{padding:0px; margin-bottom:0px; background:none; position:relative; line-height:1.2em; } div#content div.box1 ul.list6 li a{display:block; background:url(../images/content/category_buttons.gif) no-repeat 0px -905px; text-decoration:none; cursor:pointer; } div#content div.box1 ul.list6 li a span{ padding:7px 0 7px 27px; display:block;} div#content div.box1 ul.list6 li a:hover span{background:url(../images/content/category_buttons.gif) no-repeat 0px -856px;} div#content div.box1 ul.list6 li a:hover{ background:url(../images/content/large_tabs.gif) no-repeat -293px 100%; color:#d30000;} div#content div.box1 ul.list6 li a.active, div#content div.box1 ul.list6 li a.active:hover{background:url(../images/content/large_tabs.gif) no-repeat -0px 100%; color:#4598AA;} div#content div.box1 ul.list6 li a.active span, div#content div.box1 ul.list6 li a.active:hover span{ background:url(../images/content/category_buttons.gif) no-repeat 0px -791px;} /*------------------------------------------ // 10. CONTACT PAGE STYLES //------------------------------------------*/ /*---- Contect Left----*/ div#content div.contact div.left{padding:6px 0px 0px 25px;} div#content div.contact div.left h2, div#content div.spread-love h2 {color:#4598aa; font-size:300%; margin:0px 0px 10px -2px;} div#content div.contact div.left dd.submit{padding:10px 0px 20px 0px;} div.box.form dl dt.project_overview{width:100%;} div.box.form dl dt.size1{width:212px; float:left; padding-top:15px;} /*---- Content - comment - form----*/ div.contact div.comment_form div.box.form dl dd.size2 { width:auto; margin:15px -7px 0px 0px; } div#content div.left dl dd.size2 ul li{background:none; padding-left:6px;} div.contact div.comment_form div.box.form dl dt.size1 { clear:both; } div.contact div.comment_form div.box.form dl dt.size1 label { padding:0px; } div.box.form dl dd.size2{width:296px; float:right; margin:15px -7px 15px 0px;} div.box.form dl dt.size1{padding-bottom:13px; padding-top:21px;} div.box.form dl dd.size2 select{width:276px; padding:3px 0px; font-size:140%; margin-right:10px; margin-left:9px; } div.box.form dl dd.textbox1{background:url(../images/content/textbox1.gif) no-repeat 0px 0px; margin-top:0px; padding:10px 0px;} div.box.form dl dd.textbox1 input{width:264px; margin:0px 15px; background:none; border:0; font-size:140%; padding:4px 0px; } /*---- Contect Right----*/ div#content div.contact div.right{padding-top:0px;} div#content div.contact div.right p{padding-left:5px; font-size:120%;} div#content div.contact div.right a{color:#d30000;} div#content div.contact div.right ul.list1{margin-left:7px;} div#content div.contact div.right ul.list1 li{font-weight:normal; padding:0px 0px 2px 12px; line-height:16px; margin-bottom:8px; float:none;} /*------------------------------------------ // 11. Services Page Styles //------------------------------------------*/ div#content div.services div.left div.list{width:100%; overflow:hidden;} div#content div.services div.left div.list div.icon{float:left; width:144px;} div#content div.services div.left div.list div.description{width:409px; float:right;} div#content div.services div.left div.list h2{color:#4598aa; font-size:300%; float:left; width:415px;} div#content div.services div.left div.list div.description ul.list1 li{color:#d30000; float:none; width:auto; padding:0px 0 5px 15px; line-height:9px;} div#content div.services div.left div.list div.description ul.list1 li a{color:#d30000; text-decoration:none;} div#content div.services div.left div.list div.description ul.list1 li a:hover{ border-bottom:#d30000 1px dotted;} div#content div.services div.left div.list ul.list1 li{float:none; font-weight:normal;} div#content div.services div.left div.list h3{font-size:240%; color:#4598aa;} div#content div.services div.left div.list h3 span{font-weight:normal;} div#content div.services div.left div.list img.image1{ margin-right:18px; float:left;} /*---- Content - Right - box1 - List4----*/ div#content div.box1 ul.list4 li{padding:0px; margin-bottom:0px; background:none; position:relative;} div#content div.box1 ul.list4 li a{display:block; background:url(../images/content/category_buttons.gif) no-repeat 100% 30px; text-decoration:none; cursor:pointer;} div#content div.box1 ul.list4 li a.active, div#content div.box1 ul.list4 li a.active:hover{background-position:100% -634px;} div#content div.box1 ul.list4 li a:hover{background-position:100% -660px;} div#content div.box1 ul.list4 li span{display:block; padding:7px 0px 7px 27px; background:url(../images/content/category_buttons.gif) no-repeat 0px -575px; font-weight:bold;} div#content div.box1 ul.list4 li a:hover span{background-position:0px -547px; color:#d30000; text-decoration:none;} div#content div.box1 ul.list4 li a.active span, div#content div.box1 ul.list4 li a.active:hover span{background-position:0px -521px; color:#4598aa;} /*------------------------------------------ // 12. About Page STYLES //------------------------------------------*/ div#content.about div.left h2{color:#4598aa; font-size:300%; } div#content.about div.left h3{ font-size:240%;} div#content div.clients{ float:left; width:610px; padding-left:20px;} div#content div.clients h2{ color:#4598aa; font-size:300%; margin-bottom:5px; } div#content div.clients p{ color:#656258; font-size:150%; margin-bottom:50px;} div#content div.clients ul li{ float:left; margin:0 45px 60px 0;} div#content div.left ul li{ margin-bottom:6px; background:url(../images/content/bullets.gif) 0 0 no-repeat; padding-left:15px;} /*---- Communicate - Column1 ----*/ div#communicate div.column1 div.post h3{ margin-bottom:5px; line-height:1.2em} div#communicate div.column1 div.post p{ margin-bottom:6px;} div#communicate.about div.column1 div.post{ margin-bottom:10px;} div#communicate.about div.column1 div.post p.metadata{ margin-bottom:6px; font-size:100%;} div#communicate.about div.column1{ width:250px; margin-right:80px;} div#communicate.about div.column1 div.post p{ font-size:120%; line-height:1.2em; } div#communicate.about div.column1 div.post p span a { color:#FFF;} /*---- Communicate - Column2 ----*/ div#communicate.about div.column2{ width:175px; padding:0px; float:right;} div#communicate.about div.column2 div.adr div.box{ float:none; margin-bottom:10px;} div#communicate.about div.column2 div.application{ padding:0px;} div#communicate.about div.column2 div.application ul{ margin-bottom:20px;} div#communicate.about div.column2 div.application ul li{ float:none; margin-bottom:10px; list-style:none;} /*---- Communicate - Column3 ----*/ div#communicate.about div.column3{ float:left; width:350px;} div#communicate.about div.column3 table td input.submit{ background:url(../images/content/sendit.gif) 0 0 no-repeat; width:145px; } /*------------------------------------------ // 13. SPREAD THE LOVE STYLES //------------------------------------------*/ div.spread-love { padding:0 15px 0 28px; } div.spread-love div.box2 div.box3 { float:left; width:440px; } div.spread-love div.box2 div.box3.first { margin-right:24px; } div#content div.spread-love p.submit { padding:18px 0 0 378px; margin:0; clear:both; } div.spread-love input.submit-btn1 { background:url(../images/content/submit.jpg) no-repeat 0px 0px; height:46px; width:144px; border:none; cursor:pointer; } div.spread-love input.submit-btn1:hover { background-position:0 -51px; }