/*

   CSS for display to screen for www.fluoridesandhealth.ie



   Attempt a Zen Garden-type setup, where *everything* about the display

   is in the CSS



   The two-column layout technique is from

   http://www.alistapart.com/articles/negativemargins/



   Tadgh O'Leary - department of health

   February 2005

   */



/* the defaults */

body { 

       font-size: 100%; 

       font-family: Verdana, sans-serif; 

       margin: 5px; 

       }



/* even though Georgia is serif, fall back to sans */

h1,h2 { font-family: Georgia,sans-serif; }

h1 { font-size: 1.3em; }

h2 { font-size: 1.1em; }

h3 { font-size: 1em; font-style: italic; }



/* the header */

div#header {

             background: white url("/images/header_bg.png") repeat-x top right;

             border-bottom: 2px solid #838D72; 

             height: 6em;

             }



img#logo { border: 0; }



ul#headermenu { 

                position: absolute;

                top: 4em;

                right: 10px;

                margin: 15px 0 5px 0; 

                font-size: 0.9em;

                padding: 0 1em 0 0; 

                }

ul#headermenu li { 

                   display: inline; 

                   list-style: none;

                   margin: 0 0.2em 0 0.2em;

                   }



ul#headermenu li a {

                     text-decoration: none;

                     color: #333300;

                     } 



div#search {

             position: absolute;

             top: 5px;

             right: 10px;

             margin: 0.5em 0 0 0;

             }



div#search form {

                  margin-right: 10px;

                  }



/* the main content */

div#wrapper { background: white url("/images/sidebar_bg.gif") repeat-y top left; }



div#main { 

           width: 100%; 

           float: right; 

           margin-left: -160px; 

           padding-top: 10px;

           background: white url("/images/sidebar_bg.gif") repeat-y top left;

           }



div#content {  

              margin-left: 160px; 

              padding-left: 10px;

              }



/* the sidebar */

div#sidebar {  

              float: left; 

              width: 160px;

              padding: 0;

              }



ul#sidebarmenu {

                 margin: 1em 0 4em 0;

                 padding: 0;

                 }



ul#sidebarmenu li {

                    list-style: none;

                    margin-left: 10px;

                    padding-left: 0;

                    }



ul#sidebarmenu li a,ul#sidebarmenu li span {

                      display: block;

                      color:  #838D72;

                      font-weight: bold;

                      text-decoration: none;

                      border-bottom: 1px solid white;

                      padding: 0 1em 0 0;

                      }



ul#sidebarmenu li a:hover,ul#sidebarmenu li span.linkdisabled {

                            color: #D8F8A1;

                            background: #838D72;

                            }



ul#sidebarmenu ul.submenu { 

                            font-size: 0.8em; 

                            padding-left: 0;

                            margin-left: 0;

                            }

ul#sidebarmenu ul.submenu li {

                               margin-left: 20px;

                               } 



ul#sidebarmenu ul.submenu li a,ul#sidebarmenu ul.submenu li span {

                                 display: block;

                                 border-bottom: 1px solid darkgreen;

                                 padding: 0 0.25em 0 0.25em;

                                 }         



/* the footer */

div#footer { clear: both;  font-size: 0.8em; margin-top: 2em; border-top: 1px dashed darkgreen; }



ul#footermenu {

                float: right;

                margin-right: 1em;

                }



ul#footermenu li {

                   list-style: none;

                   display: inline;

                   font-weight: bold;

                   }



.clearing {

            height: 0;

            clear: both;

            }



/* pictures */

div.picture { clear: left; float: left; margin: 10px 10px 10px 0;}

div.picture span.caption { display: block; font-size: 0.8em; }





/* rules applicable only to certain areas */

table#membership { border-collapse: collapse; margin-bottom: 1em; }

table#membership caption { font-weight: bold; background: black; color: white; }

table#membership th { text-align: left; width: 50%; vertical-align: top; border-bottom: 1px dotted grey; } 

table#membership td { text-align: left; width: 50%; vertical-align: top; border-bottom: 1px dotted grey; } 

table#membership thead th { background: #CACCC6; }



div.publication img { border: 1px solid grey; float: left; margin-right: 2em; }

div.publication p.title { font-size: 1.1em; font-weight: bold; }

div.publication ul li { list-style: none; }