/* Koi palette #85c5ce light blue (borders) #85c6cd light blue dropdown #00a4b5 bright blue (headings) #e5e5e5 light grey (background) #ccc grey (borders) #777 dark grey (subnav) Defaults ================================================================*/ *, dl, dd, dt { margin: 0; padding: 0; } img { border: 0; } a, a:visited { color: #00a4b5; text-decoration: none; } a:hover { text-decoration: underline; } .clear { clear: both; height: 0; line-height: 0; } html { min-height:100%; margin-bottom:1px; } body { margin: 0; font: 75% arial,verdana,sans-serif; color: #333; background-color: #fff; text-align: center; } /* Headings,text ================================================================*/ #content, #features, #highlight { line-height: 1.4em; } #content p, #content ul, #features ul { clear: left; margin: 0 0 1.35em; } #content li, #features li { padding-left: 20px; margin-bottom: 0.3em; background: url(../images/template/bullet.gif) 10px 7px no-repeat; } h1, #pageHome h2, #call { margin-bottom: 1.05em; font-size: 1.35em; font-weight: normal; color: #00a4b5; } h2 { color: #333; font-size: 1em; font-weight: bold; } h3 { color: #666; font-size: 1em; font-weight: bold; } ul,ul li { list-style: none; } cite { display: block; font-weight: bold; font-style: normal; } /* Forms ================================================================*/ .folaigh { display: none; } form { padding-top: 1em; } label { float: left; display: inline; width: 120px; } input, textarea, select { font: 1em arial, verdana, sans-serif; color: #333; } input { width: 200px; } textarea { width: 200px; height: 130px; } #content form p.actions { margin-left: 120px; } form em.error { padding-left: 1em; font-style: normal; color: #00a4b5; } p.alert { color: #00a4b5; font-weight: bold; } /* Structure ================================================================*/ #wrapper { width: 800px; margin: 0 auto; padding: 0 15px; text-align: left; background: #fff url(../images/template/bg-page.jpg) top left repeat-y; } * html #wrapper { width: 830px; w\idth: 800px; } #branding { position: relative; border-top: 9px solid #85c5ce; height: 107px; } #logo { position: absolute; width: 350px; top: 36px; left: 17px; } #call { position: absolute; top: 19px; right: 11px; font-size: 1.25em; } #nav { height: 30px; background: #777 url(../images/template/nav_bg.gif) top left repeat-x; text-transform: uppercase; color: #fff; font-weight: bold;font-size: .95em; } #nav li.primary { float: left; display: inline; background: url(../images/template/nav_divider.gif) top left no-repeat; } #nav li#navHome { width: 91px; background-image: none; } #nav li#navAbout { width: 128px; } #nav li#navBlog { width: 107px; } #nav li#navServices { width: 141px; } #nav li#navProcess { width: 165px; } #nav li#navContact { width: 168px; } #nav li a { display: block; line-height: 30px; text-align: center; } #nav li a, #nav li a:visited { color: #fff; } #nav li li { text-align: left; text-transform: none; font-weight: normal; } #nav li li a, #nav li li a:visited { color: #333; text-align: left; } #nav li a:hover { text-decoration: none; } /* #nav li a:hover, .sectionAbout li#navAbout a,.sectionServices li#navServices a, .sectionProcess li#navProcess a, .sectionContact li#navContact a { background-color: #e5e5e5; text-decoration: none; }*/ #nav ul { z-index: 30; width: auto; padding: 0.7em 0 1em; background-color: #85c6cd; } #nav li#navServices ul { width: 23em; } #nav li#navAbout ul { width: 150px; } #nav li#navProcess ul { width: 168px; } #nav li li a { padding-left: 30px; background: url(../images/template/drop_arrow.gif) 11px 3px no-repeat; line-height: 21px; } #nav li li a:hover { font-weight: bold; } #nav li ul { position: absolute; width: 10em; left: -999em; } #nav li:hover ul, #nav li.sfhover ul { left: auto; } #main, #content, #sidebar { float: left; display: inline; } #main { width: 677px; margin: 39px 0 25px 101px; padding-bottom: 100px; background: url(../images/template/strapline.gif) bottom right no-repeat; } #content { width: 430px; margin-right: 47px; min-height: 300px; height: auto; } * html #content { height: 300px; } #sidebar { width: 200px; } #sidebar h2 { margin: 0 0 0.3em 12px; text-transform: uppercase; font-size: .95em; font-weight: bold; color: #00a4b5; } #sidebar h2 a:hover { text-decoration: none; } #subnav { border-top: 1px solid #ccc; } #subnav ul { display: none; margin-left: -12px; } #subnav ul ul { margin-left: -24px; } #subnav li { padding-left: 12px; background: url(../images/template/arrow_blue.gif) 0 8px no-repeat; border-bottom: 1px solid #ccc; line-height: 20px; font-size: .95em; } #subnav ul ul li { font-size: 1em; } .sectionBio #subnav #navBio ul, .sectionPsych #subnav #navPsych ul, .sectionProc #subnav #navProc ul, .sectionWorkshops #subnav #navWork ul, .sectionEmployee #subnav #navEmployee ul, .sectionWSLead #subnav #navWork ul, .sectionWSTeam #subnav #navWork ul { display: block; } .sectionWorkshops #subnav #navWork ul ul, .sectionWSLead #subnav #navWork #navWSTeam ul, .sectionWSTeam #subnav #navWork #navWSLead ul { display: none; } #subnav li li { padding-left: 25px; background-image: url(../images/template/arrow_grey.gif); background-position: 13px 8px; border-top: 1px solid #ccc; border-bottom: 0; } #subnav ul ul li { padding-left: 37px; background-position: 25px 8px; } #subnav li a, #subnav li a:visited { color: #333; display: block; } #subnav li li a, #subnav li li a:visited { color: #777; } #subnav li a:hover, #pageAchieve #subnav li#navAchieve a, #pageQual #subnav li#navQual a, #pageCode #subnav li#navCode a, #pageKoi #subnav li#navKoi a, #pageTest #subnav li#navTest a, #pageChange #subnav li#navChange a, #pageCoach #subnav li#navCoach a, #pageLeader #subnav li#navLeader a, #pageTeam #subnav li#navTeam a, #pageProject #subnav li#navProject a, #pagePrinc #subnav li#navPrinc a, #pageEngage #subnav li#navEngage a, #pageContract #subnav li#navContract a, #pageAnalyse #subnav li#navAnalyse a, #pageDefine #subnav li#navDefine a, #pageImplement #subnav li#navImplement a, #pageReview #subnav li#navReview a, #pageEmployeeLead #subnav li#navEmployeeLead a, #pageEmployeeIndiv #subnav li#navEmployeeIndiv a, #pagePsychEmo #subnav li#navPsychEmo a, #pagePsychCareer #subnav li#navPsychCareer a, #pagePsychIndiv #subnav li#navPsychIndiv a, #pagePsychTeam #subnav li#navPsychTeam a, #pageWSCreate #subnav li#navWSCreate a, #pageWSWork #subnav li#navWSWork a, #pageWSSolve #subnav li#navWSSolve a, #pageWSLeadIntro #subnav li#navWSLeadIntro a, #pageWSLeadRole #subnav li#navWSLeadRole a, #pageWSLeadValue #subnav li#navWSLeadValue a, #pageWSLeadSkills #subnav li#navWSLeadSkills a { text-decoration: none; font-weight: bold; } /*separate rules that ie6 does not understand*/ .sectionBio #subnav li#navBio > a, .sectionWorkshops #subnav li#navWork > a, .sectionWSLead #subnav li#navWork > a, .sectionWSLead #subnav li#navWSLead > a, .sectionWSTeam #subnav li#navWork > a, .sectionWSTeam #subnav li#navWSTeam > a, .sectionPsych #subnav li#navPsych > a, .sectionEmployee #subnav li#navEmployee > a, .sectionProc #subnav li#navProc > a { text-decoration: none; font-weight: bold; } #wrapper-footer { width: 830px; margin: 0 auto 1em; padding-bottom: 15px; background: url(../images/template/bg-footer.jpg) bottom center no-repeat; } #footer { position: relative; height: 61px; margin: 0 15px; border-top: 1px solid #d9d9d9; border-bottom: 1px solid #fff; background: #85c5ce; color: #fff; font-size: .95em; } #footer p { position: absolute; top: 37px; left: 33px; width: 300px; font-weight: bold; } #links { position: absolute; top: 37px; right: 22px; } #footer li { display: inline; margin-right: 6px; } #footer #links li { padding-right: 9px; background: url(../images/template/divider-white.gif) center right no-repeat; } #footer a, #footer a:visited { color: #fff; } #footer li.last, #footer #links li.last { background: none; padding-right: 0; margin-right: 0; } /* Special cases ================================================================*/ p.illustration { text-align: center; } #pageKoi #content p.illustration { margin: -1em 25px 0.5em 0; } #pageHome h1 { margin-bottom: 1.3em; margin-right: 20px; font-size: 1.2em; line-height: 1.45em; color: #666; } #pageHome h1 em { color: #00a4b5; font-style: normal; } #pageContact #sidebar { display: none; } #pageContact #content { width: 600px; margin-right: 0; } #pageHome #main { margin-left: 17px; margin-right: 0; margin-top: 22px; width: 766px; padding-bottom: 7px; } #pageHome #content { width: 402px; margin-left: 13px; margin-right: 69px; line-height: 1.3em; } #banner { clear: left; margin-top: 1px; height: 216px; background: url(../images/template/bg-banner.gif) bottom left no-repeat; } #banner img { float: left; display: inline; width: 234px; margin-left: 45px; } #quotes { float: right; display: inline; width: 322px; height: 208px; overflow: hidden; background-color: #00a4b5; color: #fff; font-size: 1.4em; line-height: 1.4em; } /*some quotes paragraph styling is for non jquery visitors*/ #quotes p { margin: 50px 0 0 30px; width: 272px; display: none; } #quotes p.first { display: block; } #blog { float: left; margin-left: -5px; margin-top: 17px; padding: 15px 22px; background-color: #efefef; min-height: 320px; height: auto; } #blog h2 { margin-bottom: 0.7em; padding-bottom: 0.3em; text-transform: uppercase; border-bottom: 1px solid #ccc; font-size: 1.2em; font-weight: bold; } #blog h3 { margin-right: 70px; line-height: 1.4em; font-size: 1.1em; } #blog h3, h3 a, h3 a:visited { color: #333; } #blog h3 a:hover { text-decoration: none; color: #00a4b5; } #blog h4 { margin-bottom: 1em; color: #666; font-weight: normal; font-size: .95em; } #blog p a { border-bottom: 1px dotted #00a4b5; } #blog a:hover { text-decoration: none; } #pageHome #sidebar { margin-top: 3px; width: 270px; } #pageHome #sidebar h2 { margin-bottom: 1.1em; margin-left: 0; text-transform: none; font-size: 1.2em; font-weight: normal; } #pageHome #subnav { margin-bottom: 1.8em; margin-left: 4px; width: 225px; border-top: 0; } #pageHome #subnav li { padding-left: 16px; border-bottom: 0; font-weight: bold; line-height: 19px; background-position: 0 7px; } #pageHome #subnav a:hover { color: #00a4b5; } /* #features { clear: left; width: 766px; height: 214px; margin-bottom: 9px; background: url(../images/template/bg-features.jpg) top left no-repeat; font-size: .9em; } #features div { float: left; display: inline; width: 214px; margin: 15px 25px 15px 20px; } #features div.last { width: 219px; margin-right: 0; margin-left: 15px; } #features li { padding-left: 15px; background-position: 6px 5px; } #features li a, #features li a:visited { font-weight: bold; color: #333; } #features li a:hover { text-decoration: none; color: #00a4b5; } #pageHome #features h2 { margin-bottom: 0.6em; } #pageHome #features h2.major { margin-bottom: 1.5em; line-height: 1.4em; } #pageHome #features p { margin-bottom: 1em; } */ h2 a:hover, #interact a:hover { text-decoration: none; } #interact { position: relative; margin-left: -11px; margin-bottom: 7em; width: 270px; padding-bottom: 14px; background: #00a4b5 url(../images/template/rounded-bottom-blue.gif) bottom left no-repeat; color: #fff; } #interact h2, #interact a, #interact a:visited { color: #fff; } #pageHome #interact h2 { margin-bottom: 0.8em; font-size: 1.4em; /*font-weight: bold;*/ padding: 15px 27px 0; background: #00a4b5 url(../images/template/rounded-top-blue.gif) top left no-repeat; } #interact div { margin: 0 27px; } #interact ul { margin-top: 1.4em; } #interact li { margin-bottom: 0.5em; } #interact a { position: relative; background-position: top left; background-repeat: no-repeat; height: 20px; padding-top: 4px; } a#linkMail { background-image: url(../images/icons/info_icon.gif); } a#linkTwitter { background-image: url(../images/icons/twitter_icon.gif); } a#linkRSS { background-image: url(../images/icons/rss_icon.gif); } a#linkLinkedin { background-image: url(../images/icons/linked_in_icon.gif); } #interact a { display: block; padding-left: 36px; } #interact em { font-style: normal; border-bottom: 1px dotted #fff; } #pageHome blockquote { float: left; display: inline; width: 405px; margin-top: 10px; font-family: Georgia, "Times New Roman", Times, serif; } blockquote p { color: #00a5b5; font-size: 1.3em; margin-bottom: 0.5em; line-height: 1.4em; } blockquote cite { color: #666; text-transform: uppercase; font-weight: normal; font-size: .8em; } #pageHome #footer { height: 35px; } #pageHome #footer ul { float: left; display: inline; width: 650px; margin: 12px 0 0 35px; } #pageHome #footer li { margin-right: 14px; } a#credit { float: right; display: inline; width: 80px; margin: 18px 18px 0 0; text-align: right; font-size: .9em; color: #bee1e7; } .sectionProc #main { padding-bottom: 50px; }