/********************************************************************************************** Main Sections in CSS: 1. BASIC ELEMENTS Define styles for basic elements: body, h1-h6, ul, ol, a, p, etc. 2. LAYOUT Define the basic template: header, footer, etc. Elements that help to define the basic layout of the site 3. PAGE COMMON STYLES Define content styles that are common to all the pages in the project. For example Logo in header, tabs in navigation, buttons, rounded boxes etc 4. PAGE SPECIFIC STYLES Define content styles that are specific to a particular page ***********************************************************************************************/ /* import core styles */ @import url(base.css); /*------------------------------------------ // 1.BASIC ELEMENTS // Define styles for basic elements: body, h1-h6, ul, ol, a, p, etc. //------------------------------------------*/ body { color:#555555; font-family: Arial, Helvetica, sans-serif; background:#ededed; } h1, h2 h3, h4, h5, h6, p, li, a { line-height:1.2em; } a{color:#71b6d0;} /*------------------------------------------ // 2.LAYOUT // Define the basic template: header, footer, etc. Elements that help to define the basic layout of the site //------------------------------------------*/ /*---- Wrapper ----*/ div.wrapper { width:960px; margin:0 auto; } /*---- Header ----*/ div#header{ background:#fefefe url(../images/header/header-bg.gif) left top repeat-x; position:relative; z-index:1; } div#header div.wrapper{ background:url(../images/header/header-image.png) right top no-repeat; height:94px; padding-top:24px; overflow:hidden; } /*---- Navigation ----*/ div#navigation { background:url(../images/navigation/navigation-bg.png) left top repeat-x; height:40px; padding:9px 0px 8px 0px; position:relative; z-index:10; margin-top:-6px; } div#navigation div.wrapper { background:transparent url(../images/navigation/wrapper-bg.gif) no-repeat 0 0; padding-left:3px; } /*---- Content ----*/ div#container.home div#content{ padding-bottom:31px; } div#content { padding-bottom:41px; } /*---- Main ----*/ div#container.home div#main { float:left; width:534px; padding:0px 20px 0px 25px; } div#main{ width:652px; float:left; padding:27px 25px 18px;} div.box4 div#main, div.box7 div#main{ margin-top:-72px; } div.box5 div#main{margin-top:-53px;} /*---- Sidebar ----*/ div#container.home div#sidebar { float:right; width:378px; padding:4px 0px 93px 0px; } div#sidebar { width:258px; float:right;} div.box4 div#sidebar, div.box7 div#sidebar { margin-top:-62px; width:261px;} div.box5 div#sidebar { margin-top:-45px;} div.box7 div#sidebar {margin-right:5px; width:257px;} /*---- Banner ----*/ div#banner { background-color:#dadada; margin-bottom:30px; } /*---- Footer ----*/ div#footer{ background:#929292 url(../images/footer/footer-bg.gif) left top repeat-x; height:105px; } div#footer div.wrapper{ padding:35px 0px 0px 0px; } /*------------------------------------------ // 3. PAGE COMMON STYLES // Define content styles that are common to all the pages in the project. For example Logo in header, tabs in navigation, buttons, rounded boxes etc //------------------------------------------*/ /*---- Header - Logo ----*/ div#header div.logo { margin-left:22px; float:left; } div#header div.logo h1 a{ background:url(../images/header/logo.png) left top no-repeat; width:176px; height:69px; display:block; } div#header div.logo h1 a:hover { text-decoration:none; } /*---- Header - User Controls ----*/ div#user-controls{ float:right; margin-top:23px; } div#user-controls a{ color:#3c3c3c; font-size:120%; font-weight:bold; line-height:18px; } div#user-controls a#chat{ background:url(../images/header/chat-icon.gif) left center no-repeat; padding-left:12px; margin-right:30px; } div#user-controls a#email{ background:url(../images/header/email-icon.gif) left center no-repeat; padding-left:12px; margin-right:27px; } div#user-controls a#login{ background:url(../images/header/login-icon.gif) left center no-repeat; padding-left:12px; } div#user-controls span#phone{ background:url(../images/header/phone-icon.gif) left center no-repeat; padding-left:12px; margin-right:29px; color:#3C3C3C; font-size:120%; font-weight:bold; line-height:18px; } /*---- Navigation ----*/ div#navigation ul { background:url(../images/navigation/nav-bg.gif) left top repeat-x; height:42px; float:left; width:733px; } div#navigation ul li{ float:left; } div#navigation ul li.last a span{ background:none; } div#navigation ul li a{ padding-left:5px; display:block; float:left; height:42px; } div#navigation ul li a span{ font-size:140%; color:#fff; font-weight:bold; float:left; display:block; line-height:42px; padding:0px 18px 0px 13px; background:url(../images/navigation/pipe.gif) right top no-repeat; height:42px; } div#navigation ul li a:hover , div#navigation ul li a.active{ background:url(../images/navigation/tab1.gif) left top no-repeat; display:block; height:42px; float:left; padding-left:5px; } div#navigation ul li a:hover span , div#navigation ul li a.active span{ background:url(../images/navigation/tab1.gif) right bottom no-repeat; display:block; float:left; height:42px; padding:0 18px 0 13px; } div#navigation ul li a:hover , div#navigation ul li a:hover span { text-decoration:none; } /*---- Navigation - Search Form ----*/ div#navigation div#search-form{ background:url(../images/navigation/search-box.jpg) left top no-repeat; width:195px; height:22px; float:right; margin-right:-4px; position:relative; padding:10px 18px; } div#navigation div#search-form p input.textbox{ width:104px; border:none; background:url(../images/navigation/textbox.gif) left top no-repeat; height:18px; vertical-align:top; padding:2px 7px; margin-top:1px; } div#navigation div#search-form p input.search-btn { vertical-align:top; margin-left:-4px; position:relative; border:0; background:transparent url(../images/navigation/search.gif) no-repeat 0 0; width:72px; height:22px; cursor:pointer; } /*---- Main ----*/ div#main h1{ font-size:180%; color:#8b0b04; line-height:18px; font-weight:normal; margin-bottom:20px; text-transform:uppercase; } div#main h2{ font-size:160%; color:#8b0b04; line-height:18px; font-weight:bold; margin-bottom:10px; } div#main h3{ font-size:140%; color:#8b0b04; line-height:18px; font-weight:bold; margin-bottom:10px; } div#main h4{ font-size:120%; color:#8b0b04; line-height:18px; margin-bottom:20px; } div#main p{ font-size:120%; line-height:18px; margin-bottom:14px;} div#main ul { margin:0px 0px 14px 18px; list-style-type:disc; } div#main ol{ margin:0px 0px 14px 22px; list-style-type:decimal; } div#main li { font-size:120%; line-height:18px; margin-bottom:4px; } div#main li p, div#main li li{ font-size:100%; } div#main li p { margin-bottom:4px; } div#main blockquote{ font-style:italic; } div#main hr { margin-bottom:10px; height:1px; color:#d1d1d1; } /*---- Main - Images Section ----*/ div#main p img.aligncenter{ display:block; margin-left:auto; margin-right:auto; } div#main p img.alignright{ display:inline; margin:0 0 2px 7px; padding:4px; float:right; } div#main p img{ max-width:100%; padding:0; } div#main p img.alignright{ display:inline; margin:0 7px 2px 0; padding:4px; float:left; } /*---- Sidebar ----*/ div#container.home div#sidebar h1{ background:none; padding:0px; text-transform:uppercase; } div#sidebar h1{ font-size:160%; color:#8b0b04; font-weight:normal; line-height:16px; margin-bottom:7px; background:url(../images/content/sidebar/heading-bg.png) left top repeat-x; padding:17px 15px; text-transform:uppercase; } div#sidebar a#login-btn { margin:10px 0 5px 10px; } /*---- Sidebar - Copy - Section ----*/ div#sidebar div.copy { background:#bfbfbf url(../images/content/sidebar/copy-bg.gif) left top repeat-x; } div#sidebar div.copy div.section { padding:20px 0px 20px 15px; background:none; } div#sidebar div.copy div.section h1 { background:none; font-size:160%; padding:0px; text-align:center; } div#sidebar div.copy div.section p { color:#505050; font-size:120%; margin-bottom:15px; line-height:14px; } div#sidebar div.copy div.section ul { margin-bottom:18px; } div#sidebar div.copy div.section ul li { color:#505050; font-size:120%; line-height:14px; } div#sidebar div.copy div.devider { background:url(../images/content/sidebar/section-devider.gif) left top repeat-x; height:2px; } /*---- Footer ----*/ div#footer ul.foot-nav li{ color:#fff; font-size:110%; font-weight:bold; display:inline; line-height:30px; margin-right:9px; } div#footer ul.foot-nav li a{ color:#fff; } div#footer p.copyright{ font-size:110%; color:#d9d9d9; font-weight:bold; line-height:16px; } div#footer div#newsletter-form{ float:right; width:380px; margin-top:-5px; position:relative; } div#footer div#newsletter-form img{ vertical-align:middle; } div#footer div#newsletter-form label{ font-size:110%; color:#555555; line-height:18px; vertical-align:middle; text-transform:uppercase; font-weight:bold; padding-top:4px; } div#footer div#newsletter-form input.textbox{ background:url(../images/footer/textbox.png) right center no-repeat; border:none; vertical-align:middle; padding:4px 2px 0px 10px; width:112px; font-size:110%; color:#7e7e7e; font-weight:bold; height:16px; margin-left:6px; } div#footer div#newsletter-form input.button{ vertical-align:middle; background:url(../images/footer/join.png) left top no-repeat; width:49px; height:23px; border:none; padding:0; margin-left:-5px; cursor:pointer; } /*---- Boxes ----*/ /*---- Box1 ----*/ div.box1 div.box1-top{ background:url(../images/content/box1-top.gif) left top no-repeat; } div.box1 div.box1-middle{ background:url(../images/content/box1-middle.gif) left top repeat-y; padding:16px 0px 1px 0px; position:relative; } div.box1 div.box1-bottom{ background:url(../images/content/box1-bottom.gif) left bottom no-repeat; } /*---- Box2 ----*/ div.box2 div.box2-top-left{ background:url(../images/content/box2-top-left.gif) left top no-repeat; padding-left:6px; height:6px; line-height:6px; } div.box2 div.box2-top-left div.box2-top-right{ background:url(../images/content/box2-top-right.gif) right top no-repeat; height:6px; line-height:6px; padding-right:6px; } div.box2 div.box2-middle-left{ background:url(../images/content/box2-middle-left.gif) left top repeat-y; padding-left:6px; } div.box2 div.box2-middle-left div.box2-middle-right{ background:url(../images/content/box2-middle-right.gif) right top repeat-y; padding:5px 6px 5px 1px; } div.box2 div.box2-bottom-left{ background:url(../images/content/box2-bottom-left.gif) left bottom no-repeat; padding-left:6px; height:6px; line-height:6px; } div.box2 div.box2-bottom-left div.box2-bottom-right{ background:url(../images/content/box2-bottom-right.gif) right bottom no-repeat; height:6px; line-height:6px; padding-right:6px; } /*---- Box3 ----*/ div.box3 div.box3-top{ background:url(../images/content/box3-top.jpg) left top no-repeat; height:74px; line-height:78px; margin:0px -4px; position:relative; padding:3px 15px 0px; width:938px; } div.box3 div.box3-middle{ background:url(../images/content/box3-middle.gif) left top repeat-y; padding:0px 0px 1px 0px; margin:0px -1px; position:relative; } div.box3 div.box3-bottom{ background:url(../images/content/box3-bottom.gif) left bottom no-repeat; height:12px; line-height:12px; margin:0px -1px; position:relative; } /*---- Box4, Box7 ----*/ div.box4 div.box4-top, div.box7 div.box7-top { background:url(../images/content/box4-top.gif) left top no-repeat; height:77px; line-height:78px; padding:0px 15px; width:939px; } div.box7 div.box7-top { background:url(../images/content/box4-top2.gif) left top no-repeat; } div.box4 div.box4-middle, div.box7 div.box7-middle{ background:url(../images/content/box4-middle.gif) left top repeat-y;width:969px; } div.box4 div.box4-bottom, div.box7 div.box7-bottom{ background:url(../images/content/box4-bottom.gif) left bottom no-repeat; width:969px; } /*---- Box5 ----*/ div.box5 div.box5-top{ background:url(../images/content/box5-top.gif) left top no-repeat; height:51px; margin:0px -4px; padding:0px 15px; width:939px; } div.box5 div.box5-middle{ background:url(../images/content/box3-middle.gif) left top repeat-y;width:962px; } div.box5 div.box5-bottom{ background:url(../images/content/box3-bottom.gif) left bottom no-repeat; width:962px; } /*---- Box6 ----*/ div.box6-top-left { background:transparent url(../images/box/box6-top-left.png) no-repeat scroll left bottom; padding-left:4px; } div.box6-top-right { background:transparent url(../images/box/box6-top-right.png) no-repeat scroll right bottom; padding-right:4px; } div.box6-top-middle { background:transparent url(../images/box/box6-top-middle.png) repeat scroll left bottom; height:4px; line-height:4px; } div.box6-middle-left { background:transparent url(../images/box/box6-middle-left.png) repeat-y scroll left top; padding-left:4px; } div.box6-middle-right { background:transparent url(../images/box/box6-middle-right.png) repeat-y scroll right top; padding-right:4px; } div.box6-inner { background:#f7f7f7; } div.box6-bottom-left { background:transparent url(../images/box/box6-bottom-left.png) no-repeat scroll left top; padding-left:4px; } div.box6-bottom-right { background:transparent url(../images/box/box6-bottom-right.png) no-repeat scroll right top; padding-right:4px; } div.box6-bottom-middle { background:transparent url(../images/box/box6-bottom-middle.png) repeat scroll left top; height:4px; line-height:4px; } /*---- Sections ----*/ div.sections { background:transparent url(../images/content/sections.gif) no-repeat scroll 0 0; padding:0 0 20px 2px; } div.sections div.section2{ width:175px; padding:16px 19px 0; float:left; } /*---- Button1 ----*/ a.button1{ background:url(../images/content/button1.png) left top no-repeat; height:23px; padding-left:10px; display:block; margin-right:5px; } a.button1 span{ background:url(../images/content/button1.png) right bottom no-repeat; height:23px; padding-right:30px; display:block; float:left; line-height:23px; color:#fff; margin-right:-8px; position:relative; font-weight:bold; } a.button1:hover , a.button1:hover span{text-decoration:none; } /*---- Button2 ----*/ a.button2{ background:url(../images/content/button2.png) left top no-repeat; height:23px; padding-left:10px; display:block; margin-right:5px; } a.button2 span{ background:url(../images/content/button2.png) right bottom no-repeat; height:23px; padding-right:30px; display:block; float:left; line-height:23px; font-size:120%; color:#fff; text-transform:uppercase; margin-right:-8px; position:relative; font-weight:bold; } a.button2:hover , a.button2:hover span{ text-decoration:none; } /*---- Button3 ----*/ a.button3{ background:url(../images/content/button3.png) left top no-repeat; height:25px; padding-left:10px; display:block; margin-right:5px; } a.button3 span{ background:url(../images/content/button3.png) right bottom no-repeat; height:25px; padding-right:30px; display:block; float:left; line-height:25px; font-size:120%; color:#ff8179; margin-right:-8px; position:relative; font-weight:bold; } a.button3:hover , a.button3:hover span{ text-decoration:none; } /*---- Button4 ----*/ a.button4{ background:url(../images/content/button4.png) left top no-repeat; height:25px; padding-left:20px; display:block; } a.button4 span{ background:url(../images/content/button4.png) right bottom no-repeat; height:25px; padding:0 20px 0 10px; display:block; float:left; line-height:25px; font-size:120%; color:#ff8179; font-weight:bold; } a.button4:hover , a.button4:hover span{ text-decoration:none; } /*---- List1 ----*/ ul.list1 li{ background:url(../images/content/border.gif) center bottom no-repeat; padding-bottom:18px; margin-bottom:18px; list-style:none; } ul.list1 li.last{ background:none; } ul.list1 li img{ float:left; } ul.list1 li div.details{ width:425px; margin-left:103px; } ul.list1 li div.details h2{ color:#8b0b04; font-size:120%; line-height:14px; } ul.list1 li div.details h3{ color:#999999; font-size:120%; line-height:18px; margin-bottom:16px; } ul.list1 li div.details h3 strong{ color:#555555; } ul.list1 li div.details p{ font-size:110%; color:#555; line-height:18px; margin-bottom:10px; } /*---- List2 ----*/ ul.list2 li{ margin-bottom:10px; list-style:none; } ul.list2 li h2{ color:#4f93ac; font-size:120%; font-weight:normal; line-height:14px; } ul.list2 li h2 span{ color:#afafaf; } ul.list2 li p{ font-size:110%; color:#555555; line-height:14px; } /*---- List3 ----*/ div#main ul.list3 li{ margin-bottom:14px; background:url(../images/content/arrow1.gif) left center no-repeat; padding-left:10px; list-style:none; line-height:1.2em; } div#main ul.list3 li a{ color:#555555; line-height:14px;} /*---- List4 ----*/ div#main ul.list4 { margin:0 0 15px 0; } div#main ul.list4 li { list-style:none; float:left; width:146px; margin-right:17px; } div#main ul.list4 li.last { margin-right:0; } div#main ul.list4 li img { vertical-align:middle; } div#main ul.list4 li div.box6-inner { text-align:center; height:103px; } /*---- List5 ----*/ div#main ul.list5 { margin:0; } div#main ul.list5 li { list-style:none; } div#main ul.list5 li a { color:#71b6d0; font-size:110%; line-height:1.2em; font-weight:bold; } /*---- List6 ----*/ div#main ul.list6 { margin:0; padding-top:10px;} div#main ul.list6 li { list-style:none; background:url(../images/content/border2.gif) no-repeat 50% 0; padding:30px 0 10px 0; margin-bottom:14px; } div#main ul.list6 li.last { margin-bottom:0; } div#main ul.list6 li img { float:left; display:block; } div#main ul.list6 li div.details { float:right; width:445px; } /*---- Form ----*/ div.form label {display:block; font-weight:bold; font-size:103%; margin-bottom:3px; } div.form span.textbox{ background:url(../images/content/form/top-left.gif) left top no-repeat; float:left; display:block; padding-left:11px; width:289px;} div.form span.textbox-right{ background:url(../images/content/form/top-right.gif) right top no-repeat; display:block; height:31px; padding:5px 11px 0 0; } div.form input.text{ width:100%; border:medium none; vertical-align:middle; } div.form span.text-area{ width:289px; float:left; display:block; } div.form span.top{ background:url(../images/content/form/four-corner-topleft.gif) left bottom no-repeat; display:block; padding-left:10px; } div.form span.top-right{ background:url(../images/content/form/four-corner-topright.gif) right bottom no-repeat; display:block; height:8px; } div.form span.bottom{ background:url(../images/content/form/four-corner-bottomleft.gif) left top no-repeat; display:block; padding-left:10px; } div.form span.bottom-right{ background:url(../images/content/form/four-corner-bottomright.gif) right top no-repeat; display:block; height:8px; } div.form span.middle{ background:url(../images/content/form/four-corner-middleleft.gif) left top repeat-y; padding-left:1px; display:block; } div.form span.middle span.middle-right{ background:url(../images/content/form/four-corner-middleleft.gif) right top repeat-y; display:block; padding:0 0 10px 10px; } div.form textarea{ width:98%; border:medium none; } div.form input.submit{ background:url(../images/content/form/submit-button.png) left top no-repeat; width:93px; height:25px; cursor:pointer; border:medium none; } div.form input.checkbox{ vertical-align:middle; } div.form div.column1 { width:300px; float:left; } div.form div.column2 { width:300px; float:right; } /*---------------------------------- -------- // 4.1 INDEX PAGE SPECIFIC STYLES //------------------------------------------*/ /*---- Slideshow ----*/ div#slideshow{ background:#dadada; position:relative; z-index:2; } div#slideshow div.wrapper{ position:relative; height:310px; } div#slideshow div.wrapper div.slide{ background:url(../images/slideshow/slide-shadow.png) left top repeat-y; margin:-4px -4px 0px -4px; position:relative; padding:0px 4px; } div#slideshow div.wrapper div.slide img{ vertical-align:bottom; } div#slideshow div#pagination{ position:absolute; right:14px; bottom:12px; z-index:10; } div#slideshow div#pagination a{ background:url(../images/slideshow/pagination.gif) left bottom no-repeat; float:left; width:20px; height:20px; line-height:20px; text-align:center; margin:0px 1px; font-size:110%; color:#fff; } div#slideshow div#pagination a:hover , div#slideshow div#pagination a.activeSlide{ text-decoration:none; background:url(../images/slideshow/pagination.gif) left top no-repeat; } /*---- Partners ----*/ div#partners{ background:url(../images/parteners/partner-top.gif) left top repeat-y; margin:0px -4px 30px; position:relative; height:89px;} div#partners div.partners-bottom{ background:url(../images/parteners/partner-bottom.gif) left bottom no-repeat; padding:15px 20px 2px 8px; } div#partners div.partners-bottom div.controls{ width:160px; float:left; background:url(../../assets/images/partners/control-bg.jpg) left top no-repeat; width:126px; height:91px; margin:-15px 0px 0px 5px; position:relative; padding:4px 41px 0 10px; } /*---- Partners - Controls ----*/ div#partners div.partners-bottom div.controls h2{ color:#8b0b04; font-size:140%; line-height:30px; font-weight:normal; text-transform:uppercase; } div#partners div.partners-bottom div.controls p{ font-size:110%; color:#838383; line-height:14px; margin-bottom:12px; } div#partners div.partners-bottom div.controls a{ color:#838383; font-size:120%; text-transform:uppercase; } div#partners div.partners-bottom div.controls a:hover{ text-decoration:none; } div#partners div.partners-bottom div.controls a.previous{ background:url(../../assets/images/partners/previous.gif) left 2px no-repeat; padding-left:14px; float:left; } div#partners div.partners-bottom div.controls a.next{ background:url(../../assets/images/partners/next.gif) right 2px no-repeat; padding-right:14px; float:right; } /*---- Partners - List ----*/ div#partners div.partners-bottom ul{ float:left; overflow:hidden; } div#partners div.partners-bottom ul li{ float:left; text-align:center; width:193px; } div#partners div.partners-bottom ul li.last{ margin-right:0px; } /*---- Content Box1 ----*/ div#container.home div#content div.box1{ margin:0px -1px; position:relative; clear:both; } div#container.home div.box1 div#main ul.list1 li img.adobe{ margin-left:20px; } div#container.home ul{ margin-left:0px; } /*----About-Sidebar ----*/ div#container.home div#sidebar h1 span{ color:#444;} div#container.home div#sidebar div.section{ padding-left:28px; background:url(../images/content/sidebar/section-border.gif) left bottom repeat-x; padding-bottom:20px; margin-bottom:23px; } div#container.home div#sidebar div.section a.button1{ margin-right:20px; font-size:120%; } div#container.home div#sidebar div.section.last{ background:none; } div#container.home div#sidebar div.section ul.list2{ margin:0 0 15px 6px; } /*---- Sidebar - Quote ----*/ div#container.home div#quote{ bottom:-9px; right:0px; position:absolute; padding:0; } div#container.home div#quote div.quote-top{ background:#8f1c16 url(../images/content/sidebar/quote-top.jpg) left top no-repeat; } div#container.home div#quote div.quote-top div.quote-bottom{ background:url(../images/content/sidebar/quote-bottom.jpg) left bottom no-repeat; padding:18px 0 16px 26px; width:352px; } div#container.home div#quote p{ margin-bottom:13px; } div#quote{ background:#8b0b04 url(../images/content/sidebar/quote-bg.jpg) left bottom repeat-x; padding:18px 16px 20px; margin-left:-4px; } div#quote h2{ font-size:180%; color:#fff; line-height:18px; font-weight:normal; text-transform:uppercase; } div#quote p{ font-size:110%; color:#fff; line-height:16px; margin-bottom:10px; } /*------------------------------------------ // 5 ABOUT US PAGE SPECIFIC STYLES //------------------------------------------*/ /*---- Sidebar ----*/ div#sidebar h1.heading1{margin-bottom:0px; padding:15px; margin-right:5px;} div#sidebar ul.navigation{margin:0px 1px; } div#sidebar ul.navigation li{ background:url(../images/content/sidebar/section-border.gif) left bottom repeat-x; padding-left:12px; width:243px; height:32px; } div#sidebar ul.navigation li.active, div#sidebar ul.navigation li.active:hover { background:#FFF; margin-left:-2px; position:relative; padding-left:14px; } div#sidebar ul.navigation li:hover { background:#E1E1E1; margin-left:-2px; position:relative; padding-left:14px; } div#sidebar ul.navigation li a {font-size:140%; color:#4f93ac; line-height:30px; height:36px; font-weight:bold; display:block; } div#sidebar ul.navigation li a:hover { text-decoration:none; } div#banner img { margin:-3px -4px -2px; position:relative; } /*------------------------------------------ // 6 BRANDS PAGE SPECIFIC STYLES //------------------------------------------*/ /*---- Container ----*/ div#container.home div#main ul.list1 li { margin-bottom:19px; list-style:none; } div#container.home div#main ul.list1 li.last { margin-bottom:08px; list-style:none; padding-bottom:0px; } div#container.home div#main ul.list1 li div.details h2 { font-size:120%;margin-bottom:0px; line-height:14px; text-transform:capitalize; } div#container.home div#main ul.list1 li div.details h3 { color:#999999; font-size:100%; line-height:16px; margin-bottom:16px; margin-bottom:14px; } div#container.home div#main ul.list1 li div.details p { font-size:92%; color:#555; line-height:18px; margin-bottom:6px; } /*---- Content ----*/ div#content div.box3-top div.image {float:left; height:65px; width:174px; text-align:center; } div#content div.box3-top img{ margin-right:8px; margin-top:7px; } div#content div.box3-top ul{ float:left; height:73px; overflow:hidden; } div#content div.box3-top div.sub-nav ul li{ float:left; } div#content div.box3-top div.sub-nav ul li a{ float:left; display:block; padding-left:20px; } div#content div.box3-top div.sub-nav ul li a span{ float:left; display:block; background:url(../images/content/pipe.gif) right 3px no-repeat; height:73px; font-size:140%; color:#595959; font-weight:bold; line-height:78px; padding-right:24px;} div#content div.box3-top div.sub-nav ul li a:hover , div#content div.box3-top div.sub-nav ul li a.active{text-decoration:none; background:url(../images/content/sub-tab.gif) left 1px no-repeat;padding-left:20px; } div#content div.box3-top div.sub-nav ul li.last a:hover span, div#content div.box3-top div.sub-nav ul li a:hover span , div#content div.box3-top div.sub-nav ul li a.active span{text-decoration:none; background:url(../images/content/sub-tab.gif) right -71px no-repeat; padding-right:24px;} div#content div.box3-top div.sub-nav ul li.last a span{ background:none; } div.box3 div#quote{ margin-left:-1px; } div.box3 div#sidebar h1.heading1 { margin-right:1px; } /*------------------------------------------ // 7 CONTACT PAGE SPECIFIC STYLES //------------------------------------------*/ div.box4{ margin-top:20px;} /*---- Content ----*/ div#content div.box4-middle div#quote{ background:url(../images/content/sidebar/quote-bg1.jpg) left bottom no-repeat; padding:2px 15px 20px; margin:0 0 0 -1px; } div.section{ background:url(../images/content/sidebar/section-border.gif) left bottom repeat-x; } div#content div#contact div.adr, div#content div#contact div.phone, div#content div#contact div.e-mail { padding:10px 15px 10px 15px; } div#content div#contact h2{ font-size:120%; font-weight:bold; margin-bottom:6px; } div#content div#contact p{ font-size:120%; margin-bottom:5px; } div#content div#contact p.region span.postal-code{ float:none; display:inline;} div#content div#contact div.e-mail a{ font-size:120%; font-weight:bold; } div#content div#contact span.type{ width:58px; float:left; display:block; } /*---- Form ----*/ div.form p.submit{ } /*------------------------------------------ // 8 CONTACT REQUEST PAGE SPECIFIC STYLES //------------------------------------------*/ /*---- Box5 ----*/ div.box5{ margin-top:20px;} div.box5 div#sidebar h1{ background:none;} div.box5 div.form label{float:none; font-size:120%; display:block; margin-bottom:10px; width:160px;} div.box5 div.form div.address p.state-field label, div.box5 div.form div.address p.zip-field label{ width:50px;} /*---- Form Address ----*/ div.form div.address label{ margin:0 0 7px 5px;} div.form div.address p{ float:left;width:308px; margin-bottom:8px !important; } div.form div.address span.textbox-right{ width:285px;} div.form div.address p.organzation-field{ margin-right:30px; margin-bottom:10px !important; } div.form div.address p.name-field{ margin-right:30px;} div.form div.address p.address-field { width:230px; margin-right:22px; } div.form div.address p.address-field span.textbox-right{ width:208px;} div.form div.address p.city-field{ width:189px; margin-right:22px;} div.form div.address p.city-field span.textbox-right{ width:168px;} div.form div.address p.state-field{ width:78px; margin-right:22px; } div.form div.address p.state-field select {width:48px; font-weight:bold; color:#555555; font-size:90%;} div.form div.address p.zip-field{ width:80px;} div.form div.address p.zip-field span.textbox-right{ width:60px;} /*---- Form Product ----*/ div.form div.product{ margin-bottom:30px;} div.form div.product p{ width:163px; float:left; margin-bottom:10px; line-height:11px !important ; } div.form div.product p label { font-size:95%; width:160px; } div.form div.product input.checkbox{ float:left; width:20px; margin:0px; } div.form p.procurment-field{ width:230px; } div.form p.procurment-field span.textbox-right{ width:208px;} div.form p.project-name span.text-area{ width:438px;} div.form input.submitquote{ background:url(../images/content/form/submitquote-button.png) left top no-repeat; width:233px; height:25px; cursor:pointer; border:medium none; } div.form p.submitquote{ margin-left:0px;} div.form p.procurment-field label { width:195px; } /*---- Table ----*/ table.listing th { font-size:140%; } table.line-items th{ font-size:140%; color:#555555; font-weight:bold; text-align:left; padding:12px 15px 12px 0;} table.line-items th.productname{ width:400px;} table.line-items th.qty{ width:80px;} table.line-items td.serial-no {width:25px; font-size:140%; font-weight:bold; vertical-align:top; padding-top:10px;} table.line-items td.name p.name-field{ width:410px;} table.line-items td.name p.name-field span.textbox-right{ width:370px;} table.line-items td.quantity p.quantity-field span.textbox-right{ width:60px;} /*------------------------------------------ // 9 SERVICES PAGE SPECIFIC STYLES //------------------------------------------*/ div.box7 div#sidebar h1.heading1 {margin-right:0px; } body.services div#content { margin-top:20px; }