@import url("/stylesheets/forms.css"); 
/*------------------------------------------------------------------
[Screen Stylesheet]

Project:       Eickhof Columbaria
Version:       1.1
Last change:   11/19/08 [home page]
Assigned to:   Karl Kasischke
Primary use:   Page Layouts - one, two & three column layouts
-------------------------------------------------------------------*/



/*------------------------------------------------------------------
[Table of contents]
A. Global Reset

B. Typography

C. Layout
   1. Body 
      1.1. Skip to content / div#skip
   2. Layout wrapper / div#wrapper
      2.1. Header / div#header
         2.1.1. Logo / h1.logo
         2.1.2. Utilities / div#utility
            2.1.2.1. Utility Navigation / ul.nav
            2.1.2.2. Search box / form#searchbox
         2.1.3. Global navigation / #globalNav
      2.2. Banner / div#banner
      2.3. Middle section / div#middle     
         2.3.1. Primary column / div#primeCol
            2.3.1.1. Main content / div#mainContent
               2.3.1.1.1. Breadcrumbs / div#breadcrumbs
            2.3.1.2. Secondary content / div#secondContent
               2.3.1.2.1 Sidebars / div.sidebar
         2.3.2. Second column / div#secondCol
            2.3.2.1. Local subnavigation / ul#subNav
            2.3.2.2. Login form / form#login
            2.3.2.3. Home News / .home #news
      2.4. Footer / div#footer
         2.4.1. Copyright information / p#copy
         2.4.2. Footer navigation / ul#footNav

-------------------------------------------------------------------*/



/*------------------------------------------------------------------
[Color codes]

#fff     white: (middle background)
#000     black: (text)
#d6d0c7  gray (borders)
#e1e5ea  blue-gray: (globalNav dropdown text)
#f0f2f5  light-blue: (page background)
#369     blue #1: (links, footer text, login h3)
#40668c  blue #2: (globalNav hover background)
#e3e7ec  blue #3: (globalNav background)
#172f49  blue #4: (globalNav dropdown hover background)
#670100  burgundy (quote text, h2, subNav h3)
#f4d781  yellow #1: (utility hover background, subNav h3 background)
#f5e3af  yellow #2: (subNav hover background)
#f6f0dc  yellow #3: (subNav background)
#efe3bb  yellow #4: (utility background) 
#c30     red: (third level subNav text)


-------------------------------------------------------------------*/



/*------------------------------------------------------------------
A. GLOBAL RESET 
-------------------------------------------------------------------*/

body {font: 62.5%/1.25 'trebuchet ms',verdana,arial,geneva,lucida,sans-serif; background: #fff; color: #000; margin: 0; padding: 0;}
p, h1, h2, h3, h4, h5, h6, /*fieldset,*/ form, label, input, textarea, select, /*legend,*/ dl, dt, dd, table, caption, th, td, blockquote, cite {margin: 0; padding: 0; font-size: 1em;}
ul, ol, li, ul *, ol *  {font-size: 1em;}

input, textarea, select {font-family: 'trebuchet ms',verdana,arial,geneva,lucida,sans-serif; font-size: inherit;}
textarea {overflow: auto;}
/*fieldset {border: solid 0 transparent;}*/
table {border-collapse: collapse;}
img {border: 0;}
acronym, abbr {border-bottom: 1px dotted #ddd;}
cite {font-style: normal;}
#globalNav :focus, #subNav :focus, .logo :focus {outline: 0;}

.nav, .nav ul, form ul {margin: 0; padding: 0; list-style: none;}
.clear {clear: both;}
.clear-l {clear: left;}
.clear-r {clear: right;}
.left {float: left; display: inline;}
.right {float: right; display: inline;}
.center {text-align: center;}
.block {display: block;}

hr {color: #d6d0c7; background-color: #d6d0c7; height: 1px; border: none; margin: 1.5em 0;}

/*------------------------------------------------------------------
B. TYPOGRAPHY  
-------------------------------------------------------------------*/
strong, a, #footNav .current a, #utility, #globalNav, .sidebar blockquote {font-weight: bold;}
a, #breadcrumbs, #footer, #login h3, #subNav a, .home #news, .home #news h3 {color: #069; text-decoration: none;}
a:hover, a:focus {text-decoration: underline;}
.sidebar blockquote, h2, #utility li a:hover, #utility li a:focus, #utility li.current a, h4, h3 {color: #670100;}
.sidebar blockquote cite, #footNav a, #mainContent h3 {font-weight: normal;}
#utility a, #globalNav a {text-decoration: none;}
h1 {font-size: 1.7em;}
h2, #login h3, .home #news h3, .sidebar h3 {font: 2.2em/1.25 georgia,'palatino linotype','times new roman',serif;}
h3, .sidebar, #mainContent, #subNav li a, .sidebar h3 {font-size: 1.3em;}
h4 {font-size: 1.1em;}
h5 {font-size: 1.0em;}
h6 {font-size: 0.9em;}
#utility, #breadcrumbs {font-size: 12px;}
#globalNav {font-size: 14px;}
.sidebar blockquote {font-size: 1.231em;}
.sidebar blockquote cite {font-size: 0.75em;}
#subNav h3 {font-size: 1.5em;}
#subNav li a {color: #000;}
#login h3, .home #news h3 {font-size: 1.8em;}
#login li, #login p, .home #news li {font-size: 1.2em;}
#footer {font-size: 1.4em;}
.home #mainContent {font-size: 1em;}
.home #audience {font-size: 1.1em;}
.home #mainContent p {font-size: 1.3em;}

/*------------------------------------------------------------------
C. LAYOUT 
-------------------------------------------------------------------*/

/* 1. Body */
body {background: #f0f2f5 url(/images/body-bg.jpg) repeat-x top;}

   /* 1.1. Skip to content / a#skip */
   #skip {position: absolute; top: -1000px;}

/* 2. Layout wrapper / div#wrapper */
#wrapper {margin: 0 auto; width: 960px; position: relative;}

   /* 2.1. Header / div#header */
   #header {float: left; margin-bottom: 6px;}

      /* 2.1.1. Logo / h1.logo */
      h1 {float: left; display: inline; width: 230px; height: 105px; background: url(/images/logo.gif) no-repeat; text-indent: -9000px; z-index:5;}
      h1 a {display: block; width: 230px; height: 105px; background: url(/images/logo.gif) no-repeat;}
      
      /* 2.1.2. Utilities / div#utility */
      #utility {float: left; display: inline; height: 62px; width: 728px; background: #efe3bb; border: 1px solid #d6d0c7; border-top: 0;}

         /* 2.1.2.1. Utility Navigation / ul.nav */
         #utility .nav {float: left; display: inline; overflow: hidden; width: 476px;}
         #utility .nav li {float: left; display: inline; border-right: 1px solid #d6d0c7; width: 126px;}
         #utility .nav li.first {width: 93px;}
         #utility .nav li a {display: block; height: 62px; line-height: 62px; padding-left: 12px;}
         #utility li a:hover, #utility li a:focus, #utility li.current {background: #f4d781;}

         /* 2.1.2.2. Search box / form#searchbox */
         #searchbox {float: right; height: 62px; line-height: 62px; width: 252px;}
         #searchbox div {width: 224px; margin: 0 auto;}
         #searchbox input, #searchbox label {vertical-align: middle;}
         #searchbox label {padding-right: 6px;}
         #searchbox #query {border: 0; background: url(/images/search-bg.gif) no-repeat 50%; width: 171px; padding: 1px 0 1px 22px;}
      
      /* 2.1.3. Global navigation / #globalNav */
   
      /*** BEGIN SUPERFISH ESSENTIAL STYLES ***/
      #globalNav ul ul {position: absolute; top: -999em; width: 15em; /* left offset of submenus need to match (see below) */}
      #globalNav ul ul li {width: 100%;}
      #globalNav ul li:hover {visibility: inherit; /* fixes IE7 'sticky bug' */}
      #globalNav ul li {float: left; position: relative;}
      #globalNav ul a {display: block; position: relative;}
      #globalNav ul li:hover ul,
      #globalNav ul li.sfhover ul {left: 0; top: 3em; /* match top ul list item height */ z-index: 99;}
      #globalNav ul li:hover li ul,
      #globalNav ul li.sfhover li ul {top: -999em;}
      #globalNav ul li li:hover ul,
      #globalNav ul li li.sfhover ul {left: 15em; /* match ul width */ top: 0;}
      #globalNav ul li li:hover li ul,
      #globalNav ul li li.sfhover li ul {top: -999em;}
      #globalNav ul li li li:hover ul,
      #globalNav ul li li li.sfhover ul {left: 15em; /* match ul width */ top: 0;}
      /*** END SUPERFISH ESSENTIAL STYLES ***/


      #globalNav {position: relative; float: left; z-index: 99; background: #e3e7ec; height: 41px; width: 728px; border: 1px solid #d6d0c7; border-width: 0 0 1px 1px;}
      #globalNav ul {width: 729px; z-index: 99;}
      #globalNav li {float: left; display: inline; border-right: 1px solid #d6d0c7; width: 126px;}
      #globalNav li.first {width: 93px;}
      #globalNav li a {display: block; height: 37px; width: 114px; padding: 4px 0 0 12px;}
      #globalNav li.first a {width: 81px;}
      #globalNav li.first, #globalNav li.last {line-height: 37px;}
      #globalNav li a:hover, #globalNav li a:focus, 
      #globalNav li:hover a, #globalNav li.sfhover a, #globalNav li.current a {background: #40668c; color: #f4d781;}
      
      #globalNav ul.dropdown {filter: alpha(opacity=95); opacity: .95; -moz-opacity: .95;}
      #globalNav ul.dropdown li {border: 0;}
      #globalNav ul.dropdown a, #globalNav li.first ul.dropdown a {height: auto; width: 13em; padding: 0.5em 1em; line-height: 1.25; color: #e1e5ea;}
      #globalNav ul.dropdown a:hover, #globalNav ul.dropdown a:focus, #globalNav ul.dropdown li.current a,
      #globalNav li.first ul.dropdown a:hover, #globalNav li.first ul.dropdown a:focus {background: #172f49;}
      #globalNav ul.dropdown li.current li a {background: #40668c;}
      #globalNav ul.dropdown li.current li.current a, #globalNav ul.dropdown li.current li a:hover, #globalNav ul.dropdown li.current li a:focus {background: #172f49;}
      #globalNav ul.dropdown ul a {border-left: 1px solid #d6d0c7;}
      
      /*** shadows for all but IE6 ***/
      #globalNav .sf-shadow ul {background: url('/images/shadow.png') no-repeat bottom right; padding: 0 8px 9px 0; -moz-border-radius-bottomleft: 17px; -moz-border-radius-topright: 17px; -webkit-border-top-right-radius: 17px; -webkit-border-bottom-left-radius: 17px;}
      #globalNav .sf-shadow ul.sf-shadow-off {background: transparent;}
   
   /* 2.2. Banner / div#banner */     
   #banner {clear: both; width: 939px; height: 329px; padding: 8px 9px; border: 1px solid #d6d0c7; margin: 6px 0 11px; background: #fff; overflow: hidden;}
   #banner a {display: block; margin: 8px 9px;}

   /* 2.3. Middle section / div#middle */     
   #middle {overflow: hidden; width: 960px; clear: both; margin-top: 6px; background: #f0f2f5 url(/images/middle-bg.jpg) repeat-x top;}
   img.right {margin: 0 0 8px 10px;}
   img.left {margin: 0 10px 8px 0;}
   .home #middle {background: transparent;}
   #mid-wrapper {background: url(/images/content-bg.gif) repeat-y 230px; width: 100%; overflow: hidden; margin-top: 8px;}
   .home #mid-wrapper {background: transparent; margin-top: 0;}
   .twoCol #mid-wrapper {background: transparent;}

      /* 2.3.1. Primary column / div#primeCol */
      #primeCol {float: right; display: inline; width: 730px;}
      .oneCol #primeCol {float: none; display: block; width: 100%;}
      #primeCol h2 {border-bottom: 1px solid #d6d0c7; padding: 28px 20px 8px; margin-top: 0px; border-left: 1px solid #d6d0c7; height: 21px; background: #fff;}
      .home #primeCol {width: 635px; padding: 0; margin: 0; border-left: 1px solid #d6d0c7;}
      .home #primeCol h2 {border-left: 0; clear: both; padding: 8px 0 8px 20px; background: transparent;}

         /* 2.3.1.1. Main content / div#mainContent */
         #mainContent {float: left; display: inline; width: 434px; padding: 12px 20px 100px; border: 1px solid #d6d0c7; border-width: 0 1px; overflow: hidden;}
         .twoCol #mainContent {float: none; display: block; width: 690px;}
         #mainContent p, #mainContent ul, #mainContent ol {margin-top: 1.5em; margin-bottom: 1.5em;}
         #mainContent h3 {margin-bottom: 15px;}
         .home #mainContent {padding: 0; border: 0; width: 635px;}
         .home #mainContent p {padding: 0 20px;}
         .home #audience {margin: 8px 0 30px 9px; overflow: hidden;}
         .home #audience li {width: 115px; height: 127px; background: #fff url(/images/churches.jpg) no-repeat 5px 5px; border: 1px solid #d6d0c7; float: left; display: inline; margin-right: 10px;}
         .home #audience .churches {}
         .home #audience .cemetaries {background-image: url(/images/cemetaries.jpg);}
         .home #audience .retirement {background-image: url(/images/retirement.jpg);}
         .home #audience .institutions {background-image: url(/images/institutions.jpg);}
         .home #audience .municipal {margin-right: 0; background-image: url(/images/municipal.jpg);}
         .home #audience a {display: block; margin: 79px 14px 12px;}
         
         .project {clear: both; padding: 1.5em 0 0; border-top: 1px solid #d6d0c7; overflow: hidden;}
         .project img, .project p.images {float: left; display: inline; margin-right: 40px; margin-bottom: 1.5em;}
         .project p.images {width: 420px;}
         #mainContent .project p {margin-top: 0; overflow: hidden;}
         .project .description {float: right; width: 230px;}
         .search #mainContent .disc li {margin-bottom: 1em;}
         
         legend {font-weight: bold; font-size: 1.2em;}
         .CheckBoxListWidget label {width: auto;}
         fieldset#what_about label {width: 40%; margin-right: 5%; float: left; display: inline;}
         /*div.eventLink {position: relative; top: -1.5em;}*/
         
         .open, .close {cursor: pointer;}
         .open span {width: 15px; padding-right: 15px; background: url(/images/box-open.png) no-repeat right;}
         .close span {width: 15px; padding-right: 15px; background: url(/images/box-close.png) no-repeat right;}
         
         .account #account form div {margin: 1em;}
         .account #account form div label {display: block; float: left; width: 10em; margin-right: 1em;}
         .account #account form div input {width: 15em;}
         .account #account form input[type="submit"] {width: auto; margin: 0.5em 0 0 11em;}
       

            /* 2.3.1.1.1. Breadcrumbs / div#breadcrumbs */
            #breadcrumbs {padding-bottom: 12px;}
            #home #breadcrumbs {display: none;}
   
         /* 2.3.1.2. Secondary content / div#secondContent */
         #secondContent {float: right; display: inline; width: 253px; padding-top: 12px;}
         .home #secondContent, .twoCol #secondContent {display: none;}

            /* 2.3.1.2.1 Sidebars / div.sidebar */
            .sidebar {margin: 0 18px 20px;}
            .sidebar blockquote {background: url(/images/open-quote.gif) no-repeat top left;}
            .sidebar blockquote p {margin: 0 0 20px 24px;}
            .sidebar blockquote p img {vertical-align: bottom;}
            .sidebar h3 {margin: 45px 0 15px; border-bottom: 1px solid #d6d0c7; padding-bottom: 5px;}
            .sidebar.image h3, .sidebar.quote h3 {margin: 0; border: 0; padding: 0;}
            
            

      /* 2.3.2. Second column / div#secondCol */
      #secondCol {float: left; display: inline; width: 229px; border-right: 1px solid #d6d0c7; position: relative; left: 1px; margin-top: 0px;}
      * html #secondCol {width: 227px;}
      .oneCol #secondCol {float: none; display: none;}
      .home #secondCol {width: 323px;}

         /* 2.3.2.1. Local subnavigation / ul#subNav */
         #subNav {margin: 0 0 25px 9px;}
         #subNav h3 {border: 1px solid #d6d0c7; border-right: 0; background: #f4d781; padding: 28px 12px 12px; height: 16px;}
         #subNav .nav {border-left: 1px solid #d6d0c7; background: #f6f0dc;}
         #subNav ul li {border-bottom: 1px solid #d6d0c7;}
         * html #subNav ul li a {border-bottom: 1px solid #d6d0c7;} /* KLUDGE : get borders to appear in IE 6 */
         #subNav li ul li {border: 0;}
         #subNav li a {padding: 7px 25px; display: block; background: url(/images/subnav-bullet.gif) no-repeat 12px 1em;}
         #subNav li.current {background: #f5e3af}
         #subNav li a:hover, #subNav li.current a {background: #f5e3af url(/images/subnav-bullet-on.gif) no-repeat 12px 1em;}
         #subNav li.current ul li a {padding-left: 43px; padding-top: 7px; background: url(/images/subnav-arrow.gif) no-repeat 28px 1em;}
         #subNav li.current ul li a:hover, #subNav li.current ul li.current a {background: #f5e3af url(/images/subnav-arrow-on.gif) no-repeat 28px 1em; color: #c30;}
         * html #subNav li a {height: 1%;} /* fix for list item spacing and clickable area IE 6*/
      
         /* 2.3.2.2 Login form / form#login */
         #login {margin: 0 13px 20px;}
         .home #login {margin: 0 0 20px 0;}
         #login h3 {margin-bottom: 20px; padding: 15px 12px 12px;}
         .home #login h3 {border-bottom: 1px solid #d6d0c7;}
         #login label {padding-right: 0.3em;}
         #login li {margin-bottom: 6px; text-align: center; padding-left: 60px;}
         #login p {margin: 1em;}
         #login li.field {text-align: right; padding: 0;}
         #login input {width: 135px;}
         .home #login input {width: 200px;}
         #login input.submit {width: auto;}
         .home #login ul {padding-right: 40px;}
         
         
         /* 2.3.2.3. Home News / .home #news */
         .home #news {margin: 0}
         .home #news ul {padding-right: 40px;}
         .home #news ul li {list-style: url(/images/bullet-red.gif); margin-bottom: 0.5em;}
         .home #news h3 {margin-bottom: 20px; border-bottom: 1px solid #d6d0c7; padding: 9px 12px 12px; height: 16px;}
         .home #news p {display: inline;}
         
         
   /* 2.4. Footer / div#footer */
   #footer {width: 960px; overflow: hidden; padding-bottom: 35px; border-top: 1px solid #d6d0c7;}

      /* 2.4.1. Copyright information / p#copy */
      #copy {float: left; display: inline; width: 206px; padding: 20px 12px 0; text-indent: -12px;}
      .home #copy {width: 300px;}

      /* 2.4.2. Footer navigation / ul#footNav */
      #footNav {text-align: center; border-left: 1px solid #d6d0c7; width: 729px; float: right; display: inline; padding-top: 20px;}
      #footNav li {display: inline; border-right: 1px solid #369;}
      #footNav li a {padding: 0 20px;}
      #footNav li.last {border: 0;}
      .home #footNav {width: 635px;}
