/* CSS for Verdant Marketing website - copyright Verdant Marketing, Parthian Systems 2010 */


body {
    font-family: Arial, sans-serif;
    font-size: 13px;
    text-align: center;
    color: #333;
    background: #fff;
    margin: 0;
    padding: 0;
}

h1, h2, h3, h4 {
        font-family: Arial, sans-serif;
        font-weight: bold;
        margin: 0px 0 1em 0;
        letter-spacing: .07em;
        line-height: 1.1em;
}
h1 { font-size: 150%; margin-top: 16px;}
h2 { font-size: 125%; margin-top: 12px; }
h3 { font-size: 115%; margin-top: 12px; }
h4 { font-size: 105%; letter-spacing: .15em; }

ul { margin: 0px 0 8px 16px; list-style-position: outside; padding-left: 0; } /* Clever stuff for IE/FF/Safari alignment make margin-top -ve to move up  */
li {  margin: 2px 0 2px 0; padding: 0; }
p { margin: 6px 0px; }

/*
a, a:link {
    text-decoration: none; color: #69c;
    border-bottom: 1px dotted #69c;
}
a:visited { color: #669; border-color: #669; }
a:hover { color: #693; border-color: #693; text-decoration: none; }
a:active { color: #c33; border-color: #c33 }
*/
/* Parthian - 29-7-10 - remove underlines and add on hover. */
a, a:link { text-decoration: none; color: #61783f; }
a:visited { }
a:hover { color: #693; border-color: #693; text-decoration: underline; }
a:active { }

a img, img {
    border: none;
}

.clear {
    clear: both;
    height: 1px;
    margin: -1px 0 0;
    font-size: 1px;
}

#page {
    width: 902px; /* was 770 */
    margin: 0 auto;
    text-align: left;
        background-color: white;
    /* background:  was url(images/tile.gif) repeat-y; */
        }


/* Header
------------------------------------------------------------------------- */

#header {
    margin-top: 1em;
    background: #fff url(../images/generic/plasma-header.jpg) no-repeat top center;
        /* width: 970px;  was n/a */
        width: 900px;
        height: 138px;
    position: relative;
}
#breadcrumbs { margin: 4px; padding: 0; position: absolute; bottom: 0px; font-size: 11px; }
#breadcrumbs a { font-size: 11px;}

#content {
    float: left; display: inline; /* IE6 Fix for double margin error (margin-left(right) is added to offset */
    position: relative; top: 0px;
    text-align: left;
    width: 560px; /* was 393  */
    margin: 10px 20px 20px 20px;
    padding: 0;
    line-height: 1.4em; /* may not have an impact */
}

#homeImpactPicture { margin-top: 18px; width:560px; height: 229px; }

.address  p { margin-top: 0px; margin-bottom: 0px; } /* Contact page use p but ensure lines are close together */

/* Sidebars
------------------------------------------------------------------------- */
#sidebar-left {
    float: left; width: 150px;
    margin: 16px 0px 15px 0px;
    padding: 0;
    font-size: 85%;
    line-height: 1.5em;
    color: #999;
    /* Removed 2/8/10 Parthian - takes time to load but doesn't exist
    background: url(images/sidebar_bg.gif) no-repeat 0 0; */
}



#sidebar-right {
        float: left; width: 150px;
        position: relative; /* for Search to Float Absolute */
    margin: 53px 0px 0px 0px;
    padding: 0;
    font-size: 85%;
    line-height: 1.5em;
    color: #999;
    /* Removed 2/8/10 Parthian - takes time to load but doesn't exist
    background: url(images/sidebar_bg.gif) no-repeat 0 0; */
}

.testimonials {margin-top: 30px; margin-bottom: 20px; }
.testimonialPhoto {width: 150px; height: 110px; }
.testimonials a, .testimonials a:link {
    text-decoration: none; color: #010101;
    border-bottom: none;
}
.testimonials a:visited { color: #010101; border-color: #669; }
.testimonials a:hover { color: #61783F; border-color: #693; text-decoration: none; }
.testimonials a:active { color: #010101; border-color: #c33 }


/* DropMenu --------------------------------------------------------------
*/
/* #61783F is the dark accordion green - #8D9F6A is the lighter accordion green  */
#dropmenu  { position: relative; top: 8px;  /* perhaps move down a little for alignment */ }

#dropmenu ul, #dropmenu p { color: #010101; font-weight: bold; list-style-type: disc;
    padding: 0px 0px 0px 15px;
    margin-left: 0px;
}
#dropmenu ul { margin-bottom: 0em; }
#dropmenu ul ul { margin-bottom: 0; border-bottom: 1px solid #ddd;
padding: 0px; /* make all bullets same depth */}
#dropmenu ul ul ul { border-bottom: none; margin-bottom: 0; }
/* Removed 2/8/10 Parthian - takes time to load but image doesn't exist
#dropmenu ul li ul li { background: url(images/tictac_green.gif) no-repeat 0 6px; } */

#dropmenu a, #dropmenu a:link {
    text-decoration: none; color: #010101;
    border-bottom: none;
}
#dropmenu a:visited { color: #010101; border-color: #669; }
#dropmenu a:hover { color: #61783F; border-color: #693; text-decoration: none; }
#dropmenu a:active { color: #010101; border-color: #c33 }

/* WayFinder Menu currently active */
#dropmenu .self a { color: #61783F; }
#dropmenu .self ul li a { color: #010101; } /* but stop self colour cascading */



/*  Search ---------------------------------------------------------------
  */
#search { /* override from site.css - Search results text */
           position: absolute; top: -3em; left: 0px; padding: 0;
                   width: 190px;  /* Width uncertain - see also current-search-results */
                   height: auto; margin: 0;
                   z-index: 10;
                   /*  color: #3A3; Body text of search results */
                    font-family: 'Arial';
}

/*
#search a, #search a:link {
    text-decoration: none;
    color: #69c;
    border-bottom: 1px dotted #69c;
}
#search a:visited { color: #669; border-color: #669; }
#search a:hover { color: #693; border-color: #693; text-decoration: none; }
#search a:active { color: #c33; border-color: #cFF }
*/

form { margin: 0; padding: 0;  }

#ajaxSearch_form {
                        margin: 0; padding: 0;
           width: 153px; /* was auto; - Different Box Model in FF and IE8 */
       }

fieldset { background: transparent;
        margin: 0; padding: 0;
    border: thin none;
}

#ajaxSearch_input {
           width: 100px;
           display: inline;
           height: 17px;
           border: 1px solid #ddd;
           border-left-color: #c3c3c3;
           border-top-color: #7c7c7c;
           /* background: #fff url(images/input-bg.gif) repeat-x top left; */
                   background-color: white;
           margin: 0 3px 0 0;
           padding: 3px 0 0;
           vertical-align: top;
       }
           /* Don't need styling just accept default for a button
       #ajaxSearch_submit {
           display: block;
           height: 22px;
           line-height: 22px;
                   width: 30px;
       }
           */

           /* Just makes a white blob.
       #ajaxSearch_output {
           border: 1px solid #444;
           padding: 10px;
           background: #fff;
           display: inline;
           height: auto;
           vertical-align: top;
                   width: 300px;
       }
           */

           #searchClose { position: absolute; top: 20px; left: 145px; width: 1.5em; height: 1.5em; }
           #indicator { position: absolute; top: 20px; left: 165px;}

               #current-search-results {
                   width: 190px;
               background: #DDD;
                   /* for IE */
                        filter:alpha(opacity=95);
                        /* CSS3 standard */
                        opacity:0.95;
       }
       .AS_ajax_result {
           padding: 3px;
       }
       .AS_ajax_resultLink a {
           text-decoration: underline;
                   color: #333; /* Dark Grey */
       }
       .AS_ajax_resultDescription{ /*  Description text from MODx - can be technical in nature so do not display */
           color: #444; /*  #61783F; */
                   display: none;
       }

           .AS_ajax_resultExtract{ /* Text found by Search */
           color: #444;
       }


       .AS_ajax_more {
           color: #61783F;
       }

/* Ditto Pagination --------------------------------------
*/
#ditto-pagination { margin-top: 40px; }
.ditto_paging { margin-top: 20px; border-top: 1px solid #ccc; padding: 10px; font-size: 86%; color: black;}
#ditto_pages .ditto_currentpage { border: 1px solid black; padding: 1px 5px 2px; margin-right: 1px; background-color: #008CBA; color: #fff;}
#ditto_pages .ditto_off { border: 1px solid #ccc; padding: 1px 5px 2px; margin-right: 1px; color: #ccc;}
#ditto_pages a, #ditto_pages a:link, #ditto_pages a:visited {
  border: 1px solid #008CBA; padding: 1px 5px 2px; margin-right: 1px; text-decoration: none !important; color: black;}
#ditto_pages a:hover { background-color: #fff; color: #000;}

/* People and Clients use Tooltip like animation ---------------------------------------------
*/
.peopleStatic {float:left; width: 128px; height: 180px; padding: 6px 6px; overflow: hidden; margin: 12px -30px 12px 90px;  background: transparent; }


/* Used for Sidebar and Content */
.clientStatic { clear:both; float:left; width: 150px; height: 110px; padding: 0px;  background: #C3CBAF; overflow: hidden; margin: 20px 0px 20px 0px; }
.clientStatic img { width: 150px; height: 110px;}
.clientStatic a  { text-decoration: none;  }
.clientStatic p  { margin: 6px; text-decoration: none; }
/* Content Who we work with specific */
.clientBody { float: left; width: 384px; height: 98px; margin: 20px 0px 20px 0px; padding: 6px 6px 6px 10px; background-image : url("../images/who-we-work-with/Dark-green-BG.jpg")}
.clientBody h3 { margin-top: 0px; margin-bottom: 0px; }
.clientBody a { text-decoration: none; color : #EEE;}
.clientBody p {margin-top: 2px; }
.clientText { color: #EEE; text-align: left; }


.clientBodyLight { float: left; width: 384px; height: 98px; margin: 20px 0px 20px 0px; padding: 6px 6px 6px 10px; background-image : url("../images/who-we-work-with/Light-green-BG.jpg")}
.clientBodyLight h3 { margin-top: 0px; margin-bottom: 0px; }
.clientBodyLight a { text-decoration: none; color : #333;}
.clientBodyLight p {margin-top: 2px; }
.clientTextLight { color: #333; text-align: left; }



.peopleStatic h4, clientStatic h4 { width: 118px; height: 1em; margin-bottom: 3px; padding: 0; text-align: left;
                  font: 11px Calibri, sans-serif; color: #666666; position: relative; left: -8px; }

.textHighlight {color: #22AA22 } /*  green highlight for text */

.peopleMove { position: absolute; /* text somehow starts after h3?  */
              z-index: 1; /* lift above text on page */
              width: 0px; margin: 0px 0px 0px 0px;
              overflow: hidden;
              height: 152px;
              /* height: 154px;  height of pS plus padding plus border? */
              /* Watch extra border and possibly padding of em value on LHS */
              opacity: 0.9; filter: alpha(opacity = 90);
              border: none;
              background: #555555;
              color: #DDDDDD;
               }

.peopleMoveContent { padding: 3px; width: 200px;
 /* position: relative; top:12px; left: 14px; width: 180px; padding 0.4em; */ }

.peopleMoveContent h3 { color: #44AA44; }

/* float should have width - 7em is a guess - and jobTitle gets right shifted with a width  */
.peoplePhoto { width: 95px; height: 95px; }
.jobTitle {  margin: 0px; font: 11px Calibri, sans-serif; text-align: left;
            position: relative; left: -8px;}
.readMore { margin: 12px 3px 12px 6px; }


 .people2 { width: 200px; }

 /*  Accordion
 ------------------------------------------------------------------------- */
 .ui-state-active { color: rgb(236,0,140); }

 .ui-accordion .ui-accordion-header a  { color: #FFFFFF; background-color: #87BC38; }
 .ui-state-active a:link { color: #FFFFFF; background-color: #61783F; }

 /* copied icons from jQuery folder in case of jQuery updates */
 .ui-state-default .ui-icon{ background-image : url("../images/generic/ui-icons_ffffff_256x240.png"); }
 .ui-state-active .ui-icon{ background-image : url("../images/generic/ui-icons_ffffff_256x240.png"); }

 /*.ui-state-active .ui-icon {background-image: none; }
 .ui-accordion .ui-accordion-header .ui-icon {background-image: none; } */


 /* Footer
------------------------------------------------------------------------- */
#footer {
    margin: 0px 0px;
    padding: 0 0 9px 0;
    font-size: 85%;
    color: #333;
    background: url(../images/generic/footer.jpg) no-repeat top center;
        width: 900px;
        height: 23px;
}

#footer-address {float:left; width: 15em; margin-bottom: 12px; }
#footer-address  p {margin: 0; }
#footer-phone {float:left; width: 18em; }
#footer-phone  p {margin: 0; }
#footer-logos1 {float:left; width: 10em; }
#footer-logos2 {float:left; width: 12em; }
#footer-logos1 p, #footer-logos2 p {margin: 0; }
#footer-frank {float:right; width: 170px; height: 70px;
    background: url(../images/generic/frank-25.jpg) no-repeat top left;
                }
#footer-frank a {font-size: 11px; text-decoration: none; color: #888;  }


#footer p {
    padding: 20px 320px 20px 95px;
}

#footer a {border-bottom: none;}