* { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline;}
:focus { outline: 0; }
ol, ul { list-style: none; }
a img,:link img,:visited img { border:none; }
.clearer {float: none; clear: both; line-height: 0; font-size: 0; display: block; }
div {line-height: 0;}
body { background: #f5f1d9 url("images/layout/top_bg_tile.gif") 0px 210px repeat-x; line-height: 0; }

.wrap { width: 780px; margin-left: auto; margin-right: auto; position: relative; }
.main { width: 100%; position: relative; }
.textReplace { position: relative; z-index: 1; overflow: hidden; display: block; }
.textReplace span { position: absolute; top: 0px; left: 0px; z-index: 5; display: block; width: 100%; height: 100%; }
.floatright {float: right;}
.floatleft {float: left;}

#banner { width: 100%; height: 210px; background: #168981 url("images/layout/banner_bg_tile.gif") top left repeat-x; color: white; font-family: 'Trebuchet MS', serif; }
#banner a { color: white; }
#banner .wrap { height: 149px; background: #168981 url("images/layout/banner_bg_tile.gif") top left repeat-x;}

#header { width: 100%; position: relative; top: 48px; left: 0px; }
#header .logo { width: 383px; height: 64px; position: absolute; left: -55px;}
#header .logo a { line-height: 1.5; color: white;}
#header .logo span{ background: url("images/fish_recruiting_logo.jpg") top left no-repeat;}
#header ul { display: block; font-size: 10px; position: absolute; top: 17px; right: 0px;}
#header ul li{ float: left; display: block; line-height: 1.5; margin-left: 14px;}
#header ul li.authenticity { width: 81px; height: 24px;}
#header ul li.authenticity span{ background: url("images/values/authenticity.gif") top left no-repeat;}
#header ul li.excellence { width: 68px; height: 24px;}
#header ul li.excellence span{ background: url("images/values/excellence.gif") top left no-repeat;}
#header ul li.integrity { width: 57px; height: 24px;}
#header ul li.integrity span{ background: url("images/values/integrity.gif") top left no-repeat;}
#header ul li.passion { width: 48px; height: 24px;}
#header ul li.passion span{ background: url("images/values/passion.gif") top left no-repeat;}
#header ul li.social_responsibility { width: 129px; height: 24px;}
#header ul li.social_responsibility span{ background: url("images/values/social_responsibility.gif") top left no-repeat;}


#nav { height: 61px; background: url("images/layout/nav_back.jpg") center top no-repeat; }
#nav .wrap { height: 61px; background: url("images/layout/nav_back.jpg") center top no-repeat;}
#nav ul { display: block; font-size: 12px; width: 100%; position: absolute; top: 28px; left: 0px;}
#nav ul li { float: left; display: block; line-height: 1.5; margin-left: 3px;}
#nav ul li h3 a span {cursor: pointer;}
#nav ul li h3.welcome { width: 89px; height: 34px;}
#nav ul li h3.welcome a span{ background: url("images/nav/welcome.jpg") top left no-repeat;}
#nav ul li h3.welcome a:hover span, #welcome #nav ul li h3.welcome a span { background-position: bottom left;}
#nav ul li h3.philosophy { width: 101px; height: 34px;}
#nav ul li h3.philosophy a span{ background: url("images/nav/philosophy.jpg") top left no-repeat;}
#nav ul li h3.philosophy a:hover span, #philosophy #nav ul li h3.philosophy a span{ background-position: bottom left;}
#nav ul li h3.CSR { width: 70px; height: 34px;}
#nav ul li h3.CSR a span{ background: url("images/nav/CSR.jpg") top left no-repeat;}
#nav ul li h3.CSR a:hover span, #csr #nav ul li h3.CSR a span{ background-position: bottom left;}
#nav ul li h3.articles { width: 73px; height: 34px;}
#nav ul li h3.articles a span{ background: url("images/nav/articles.jpg") top left no-repeat;}
#nav ul li h3.articles a:hover span, #articles #nav ul li h3.articles a span, #article #nav ul li h3.articles a span{ background-position: bottom left;}
#nav ul li h3.links { width: 61px; height: 34px;}
#nav ul li h3.links a span{ background: url("images/nav/links.jpg") top left no-repeat;}
#nav ul li h3.links a:hover span, #links #nav ul li h3.links a span{ background-position: bottom left;}
#nav ul li h3.contact { width: 76px; height: 34px;}
#nav ul li h3.contact a span{ background: url("images/nav/contact.jpg") top left no-repeat;}
#nav ul li h3.contact a:hover span, #contact #nav ul li h3.contact a span{ background-position: bottom left;}
#nav ul li.candidate { float: right; }
#nav ul li h3.candidate { width: 91px; height: 75px; }
#nav ul li h3.candidate a span{ background: url("images/nav/candidate.jpg") top left no-repeat;}
#nav ul li h3.candidate a:hover span, body.candidate #nav ul li h3.candidate a span{ background-position: bottom left;}
#nav ul li.employer { float: right; }
#nav ul li h3.employer { width: 89px; height: 75px;}
#nav ul li h3.employer a span{ background: url("images/nav/employer.jpg") top left no-repeat;}
#nav ul li h3.employer a:hover span, body.employer #nav ul li.employer a span{ background-position: bottom left;}
#nav ul li.select { float: right; font-size: 11px; color: #3e889f; font-style: italic; position: relative; top: 16px;}


#main { background: url("images/layout/fish.gif") center 75px no-repeat; }
#main .wrap { top: 75px; background: url("images/layout/fish.gif") center top no-repeat; overflow: hidden; }
#main .left { width: 450px; float: left; overflow: hidden; }
#main .right { width: 290px; float: right; }

#main .select { position: relative; top: -2px; width: 100%; height: 120px; }
#main .select h1 { position: absolute; height: 111px; border: none; }
#main .select h1 a span  { cursor: pointer; }
#main .select h1.Candidate { top: 0px; left: -9px; width: 167px;}
#main .select h1.Candidate a span { background: url("images/nav/button_candidate.jpg") top left no-repeat; }
#main .select h1.Candidate a:hover span, .candidate #main .select h1.Candidate a span { background-position: bottom left;}
#main .select h1.Employer { top: 0px; right: -8px; width: 166px; }
#main .select h1.Employer a span { background: url("images/nav/button_employer.jpg") top left no-repeat; }
#main .select h1.Employer a:hover span, .employer #main .select h1.Employer a span { background-position: bottom left;}
#main .select .txt_select { width: 465px; height: 105px; position: absolute; top: 5px; left: 158px; background: url("images/layout/select_bg.gif") top left no-repeat; }
#main .select .txt_select p { font-family: 'Trebuchet MS', serif; font-size: 16px; text-align: center; padding-top: 30px; letter-spacing: 2px; color: #a09e8f; }

h1, h2, h3, h4 { font-family: 'Trebuchet MS', serif; line-height: 1.5; color: #787d73; font-weight: normal; display: block; position: relative; }
h1 { font-size: 22px; background: url("images/layout/h1_underline.jpg") bottom left no-repeat; margin-bottom: 15px; } 
h2 { font-size: 19px; } h3 { font-size: 16px; } h4 { font-size: 14px; }
a { line-height: 1.5; color: #178983; text-decoration: none; }
a:hover { color: black; text-decoration: underline; }
#main h1.setCorner, #main h2.setCorner, #main h3.setCorner, #main h4.setCorner { padding: 6px 10px 6px 10px; background-image: none; }
#main .opacity25 { background-color: #c2d4c5; }
#main .opacity20 { background-color: #c9d9c8; }
#main .opacity15 { background-color: #d7e1ce; }
#main .date { font-size: 0.8em; position: absolute; right: 0px; bottom: 0px; font-family: Arial, sans-serif;} 

#main img { display: block; border: 10px solid #c2d4c5; }
#main p { display: block; line-height: 2; font-family: Arial, sans-serif; font-size: 12px; letter-spacing: 1px; color: #424742; margin-bottom: 20px; }
#main p.setCorner, #main .setCorner p { padding: 6px 10px 6px 10px; }
#main .icon { width: 16px; height: 16px; display: block; position: absolute; margin: 0; padding: 0; border: 0; }

#main .imgText { margin-bottom: 20px; line-height: 0; font-size: 0; }
#main .imgText div { padding: 10px; display: block; float: left; }
#main .imgText p { margin-bottom: 10px; line-height: 2; font-size: 12px;}

#main .left h1.email { padding-left: 23px;}
#main .left h1.email .icon { background: url("images/icons/mail.gif") top left no-repeat; top: 9px; left: 0px; }
#main fieldset { border: none; margin-bottom: 20px; width: 100%; display: block; clear: both; }
#main fieldset .border { background-color: #FFFFFF; padding: 10px; border: 3px solid #c2d4c5; margin: 10px 10px 10px 0px; display: block; float: right;}
#main fieldset input, #main fieldset textarea { line-height: 1.5; font-family: Arial, sans-serif; font-size: 12px; width: 290px; letter-spacing: 1px; }
#main fieldset textarea { height: 160px; overflow: hidden; }
#main fieldset .submit { float: right; clear: both; overflow: visible; width: auto; padding: 2px 25px 2px 6px; border: none; margin: 10px; background: #c2d4c5 url("images/icons/mail_go.gif") 95% 53% no-repeat; font-family: 'Trebuchet MS', serif; color: #178983; font-size: 16px; font-style: italic; }
#main fieldset label { line-height: 1.5; font-family: 'Trebuchet MS', serif; color: #787d73; font-size: 16px; font-style: italic; display: block; float: left; padding: 16px 0px 0px 10px; }
#main form {clear: both;}

#main .left h1.contact { padding-left: 23px;}
#main .left h1.contact .icon  {background: url("images/icons/page_edit.gif") top left no-repeat; top: 8px; left: 0px; }
#main .left p.address { margin-bottom: 10px;}
#main .left p.phone { font-family: 'Trebuchet MS', serif; background: #d7e1ce url("images/icons/phone.gif") 10px center no-repeat; padding-left: 30px; margin-bottom: 10px;}
#main .left p.mobile { font-family: 'Trebuchet MS', serif; background: #d7e1ce url("images/icons/mobile.gif") 10px center no-repeat; padding-left: 25px;}

#main .video { width: 100%; height: 335px; }
#main .video #welcome_video { margin: 7px 0px 0px 11px; width: 428px; height: 277px; }
#main .video h2 { background: #c2d4c5 url("images/icons/comments.gif") 10px 11px no-repeat; padding-left: 32px; padding-top: 5px; margin-bottom: 5px; border-bottom: 1px solid #F5F1D9; }
#main .small_video { width: 290px; height: 208px; margin-bottom: 20px; } 
#main #employers_video, #main #candidates_video { width: 269px; height: 188px; border: 0px; margin: 0px; margin-left: 10px; margin-top: 10px; padding: 0px; }

#main .right h3, #main .right p { display: block; }
#main .right h3.contact { background: #c2d4c5 url("images/icons/mail_go.gif") 10px center no-repeat; padding-left: 33px; margin-bottom: 1px;}
#main .right p.phone { font-family: 'Trebuchet MS', serif; background: #d7e1ce url("images/icons/phone.gif") 10px center no-repeat; padding-left: 30px; margin-bottom: 1px;}
#main .right p.mobile { font-family: 'Trebuchet MS', serif; background: #d7e1ce url("images/icons/mobile.gif") 10px center no-repeat; padding-left: 25px; margin-bottom: 1px;}
#main .right p.email { margin-bottom: 30px; }
#main .right p.email a { display: block; padding-right: 15px; text-align: right; background: #c9d9c8 url("images/icons/bullet_go.gif") right center no-repeat; font-family: 'Trebuchet MS', serif; font-size: 14px; font-style: italic; text-decoration: none; line-height: 1.5;}
#main .right p.email a:hover { text-decoration: underline; }

#main .right h3.customers { background: #c9d9c8 url("images/icons/comments.gif") 10px center no-repeat; padding-left: 32px; margin-bottom: 5px;}
#main .right .quote { background-color: #E8EDDB; color: #909388; font-size: 11px;}
#main .right p.customer { position: relative; font-family: 'Trebuchet MS', serif; font-size: 14px; font-style: italic; color: #828177; margin: -20px 0 -1px 0; padding-left: 10px; padding-bottom: 15px;}
#main .right p.customer span { color: #a2a195; padding-left: 5px; }
#main .right p.video a { display: block; padding-right: 18px; text-align: right; background: #c9d9c8 url("images/icons/video_open.gif") right center no-repeat; font-family: 'Trebuchet MS', serif; font-size: 14px; font-style: italic; text-decoration: none; line-height: 1.5;}
#main .right p.video a:hover { text-decoration: underline; }

#main  .featured { width: 470px;  }
#main .featured .feature { display:block; width: 215px; height: 225px; margin-right: 20px; float: left; position: relative;}
#main .featured .feature  h3 { font-size: 16px; color: #178983; margin-right: 10px; padding: 5px 10px 5px 30px; background: url("images/icons/featured.gif") 10px 10px no-repeat; border-bottom: 1px solid #F5F1D9; }
#main .featured .feature  p { padding: 5px 10px 5px 10px; margin-bottom: 0px; }
#main .featured .feature .content { overflow:hidden; height: 150px; }
#main .featured .feature .readMore { display: block; width: 100%; border-top: 1px solid #F5F1D9; background: #d7e1ce url("images/icons/bullet_go.gif") 96% center no-repeat; position: absolute; bottom: 0px; }
#main .featured .feature .readMore a {padding: 2px 25px 5px 10px; display: block; text-align: right;font-family: 'Trebuchet MS', serif; font-size: 16px;}

#main .left ul, #main .left ol { font-family: Arial, sans-serif; font-size: 14px; line-height: 1.5; margin: -10px 0 12px 20px; color: #787d73; }
#main .left li { margin-bottom: 8px; }
#main .left ul li { list-style-type: disc; list-style-position: outside; }
#main .left ol li { list-style-position: outside; }

#main .footer { width: 100%; height: 210px; background: url("images/layout/footer_bg.jpg") top left no-repeat; clear: both; margin-top: 35px; }
#main .footer .contact { float: left; padding: 5px 10px 5px 10px;}
#main .footer .Neoterik { float: right; padding: 5px 10px 5px 10px; text-align: right;}
#main .footer h4 { color: #9d9b8f; font-style: italic; }
#main .footer p { padding-bottom: 10px; color: #9d9b8f; }
#main .footer span.phone { background: url("images/icons/phone.gif") left center no-repeat; padding-left: 20px; }
#main .footer span.mobile { background: url("images/icons/mobile.gif") left center no-repeat; padding-left: 15px; }
