/* default font size*/
@import url(small.css);



/* --- Common Elements
-------------------------------------------------------*/

* { 
    margin: 0;
    padding: 0;
}

html {
    height: 100%;
}

img { 
    border: 0;
}

hr {
    height: 20px;
    color: #fff;
    background: #fff;
    border: 0;
}

body {
    font: 12px Tahoma, Arial, Helvetica, sans-serif;
    color: #333333;
    background: #e5e5e5;
    line-height: 1.5em;
}

h1 {
    font: 160% tahoma, Arial, Helvetica, sans-serif normal;
    color: #7D8315;
    padding: 5px;
    text-transform: lowercase;
}

h2 {
    font: 140% tahoma, Arial, Helvetica, sans-serif normal;
    color: #7D8315;
    padding: 10px 5px 10px 5px;
    text-transform: lowercase;
}

h3 {
    font: 120% tahoma, Arial, Helvetica, sans-serif normal;
    color: #7D8315;
    padding: 5px;
    text-transform: lowercase;
}

h4 {
    font: 115% tahoma, Arial, Helvetica, sans-serif normal;
    color: #7D8315;
    padding: 5px;
    text-transform: lowercase;
}

h5 {
    font: 110% tahoma, Arial, Helvetica, sans-serif normal;
    color: #7D8315;
    padding: 5px;
    text-transform: lowercase;
}

p {
    padding: 5px;
}

a {
    text-decoration: none;
}

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
/* End hide from IE-mac */


/* --- Container Elements
-------------------------------------------------------*/

#site_wrapper {
    margin: 0 auto;
    width: 880px;
    height: 100%;
    background: #fff;
    border: 1px solid #d5d5d5;
}

#site_innerwrapper {
    width: 880px;
    background: url(../images/innershadow_top.jpg) no-repeat top;
    clear: both;
}

#site_outterwrapper {
    width: 880px;
    background: url(../images/innershadow_bottom.jpg) no-repeat bottom;
    margin: 0 auto;
    padding-bottom: 30px;
}

#site_content {
    margin: 20px;
    
}

#site_content a {
    color: #848B19;
    text-decoration: underline;
    clear: both;
}

#site_content a:hover {
    text-decoration: none;
}

#site_leftcol {
    margin: 0 15px;
    width: 200px;
    position: relative;
    float: left;
    z-index: 1000;
}

#site_leftcol h1 span, .downloadbrochure span {
    display: none;
}

#site_leftcol h1 {
    background: url(../images/logo.jpg) no-repeat top #fff;
    width: 200px;
    padding-bottom:0px;
    height: 190px;
}

#site_leftcol a {
    color: #848B19;
    text-decoration: underline;
}

#site_leftcol a:hover {
    text-decoration: none;
}

#site_leftcol hr {
    height: 1px;
    background: #fff;
    border-top: 1px dotted #ccc;
    padding: 10px 0;
}

#site_rightcol {
    position: relative;
    float: left;
    width: 630px;
}

#site_rightcol li {
 margin-left: 20px;   
}

#site_splitcontentleft {
    position: relative;
    float: left;
    width: 310px;
    padding: 0;
    margin: 0 20px 0 0;
}

#site_splitcontentright div {
    position: relative;
    float: left;
    background: url(../images/splitcontentright_bg.jpg) repeat-y;
    padding: 0;
    margin: 0;
    width: 256px;
}

div#splitcontentright_top {
    background: transparent url(../images/splitcontentright_top.jpg) top no-repeat;
    padding: 0;
    margin: 0;
}

div#splitcontentright_bottom {
    background: url(../images/splitcontentright_bottom.jpg) bottom no-repeat;
    padding: 0 0 15px 0;
    margin: 0;
}

#splitcontentright_top h2 {
    background: url(../images/nationaltrust.gif) no-repeat top right;
    margin: 10px 0 0 0;
    width: 238px;
    height: 45px;
    display: block;
}

#splitcontentright_top h3, #splitcontentright_top a {color: #734d75;}
#site_splitcontentright h3, #site_splitcontentright p {position: relative; float: left;}

#famousgarden h2 {
    background: url(../images/famousgardens.gif) no-repeat top right;
    margin: 10px 0 0 0;
    width: 238px;
    height: 45px;
    display: block;
}

#famousgarden h2 a, #famousgarden span, #splitcontentright_bottom h2 a, splitcontentright_top h2 a {display: block; height: 45px; width: 238px;}
#famousgarden span, #splitcontentright_top h2 span, #splitcontentright_bottom h2 span { display: none; }
#famousgarden h3, #famousgarden a {color: #5284c7;}
#famousgarden h3, #splitcontentright_top h3, #splitcontentright_bottom h3, #famousgarden p, #splitcontentright_top p, #splitcontentright_bottom p { padding: 0; width: 125px; }


#splitcontentright_bottom h2 {
    background: url(../images/gardencharities.gif) no-repeat top right;
    margin: 10px 0 0 0;
    width: 238px;
    height: 45px;
    display: block;
}

#splitcontentright_bottom h3, #splitcontentright_bottom a {color: #cd5a00;}

.thumb_img {
    border: 5px solid #fff; float: left; margin: 0 4px 5px 8px;
}

.thumb_img2 {
    border: 5px solid #e1e1e1; float: left; margin: 5px 8px;
}

dl.tips_top { background: url(../images/tips_top.jpg) top no-repeat; width: 192px; padding: 10px 0 0 0; margin-left: 10px; }
dl.tips_top dt , dl.tips_top dd p { padding: 3px 15px; color: #fff; }
dd.tips_bottom {background: url(../images/tips_bottom.jpg) bottom no-repeat; width: 192px; padding-bottom: 10px;}
dl.tips_top dt { font-weight: bold; }

.site_welcome {
    font-size: 20px;
    font-weight: normal;
}

h3 span.eventsdate {
    font-size: 12px;
    font-weight: bold;
    padding-top: 10px;
}

.spl_right_img {
  position: relative;
  float: left;
  width: 90px; 
  top: 0;
  left: 10px;  
}

.spl_right_txt
{
  position: relative;
  float: left;
  top: 0;
  left: 100px;
  width: 100px
}

h3.subscribe
{
    color: #734D75;
}

.bookyourbreak span {
    display: none;
}

.bookyourbreak a 
{
    background: url(../images/btn_bookyourbreak.jpg) no-repeat;
    display: block;
    height: 45px;
    width: 144px;
    margin: 5px 0;
}

/* --- site navigation
-------------------------------------------------------*/
#menu {
    width: 180px;
    margin: 0 0 20px 5px; /* this page only */
}

/* remove all the bullets, borders and padding from the default list styling */
/*-----------------------------------------------------*/
#menu ul {
    position: relative;
    padding: 0;
    margin: 0;
    list-style-type: none;
    width: 200px;
    display: inline-block;
    border-right: 1px solid #fff;
}

/* style the list items */
/*-----------------------------------------------------*/
#menu li {
    list-style: none;
    background: url(../images/nav_shadow.jpg) top repeat-y left;
    width: 190px;
    /* for IE7 */
    float:left;
}

#bookgarden_btn {font-weight: bold;}

#menu li#subA {background: #fff;}
#menu li#subB {background: #fff;} 

/* get rid of the table */
#menu table {position:absolute; border-collapse:collapse; top:0; left:0; z-index:2000; font-size:1em;}

/* style the links */
#menu a {
    display: block;
    color: #333333;
    padding: 5px 10px;
    line-height: 20px;
    border-bottom: 1px solid #fff;
    text-decoration: none;
    width: 180px;
    background: url(../images/nav_bg.jpg) repeat-y;
}
/* hack for IE5.5 */
* html #menu a {width:190px; w\idth:189px;}
/* style the link hover */
* html #menu a:hover {color: #fff; text-decoration: none; background: #7D8315; position:relative;}

#menu li:hover {color: #fff; position:relative;}

/* For accessibility of the top level menu when tabbing */
#menu a:active, #menu a:focus {background: #7D8315; color: #fff;}

/* retain the hover colors for each sublevel IE7 and Firefox etc */
#menu li:hover > a {color: #fff; background: #7D8315;}
 
/* hide the sub levels and give them a positon absolute so that they take up no room */
#menu li ul {
    visibility:hidden;
    position:absolute;
    top:0;
    border-left: 1px solid #fff;
/* set up the overlap (minus the overrun) */
    left:200px;
/* set up the overrun area */
    padding:0;
/* this is for IE to make it interpret the over-run padding */
    background:#fff;
}

#menu ul li ul li a {
    background: #EBF19A;
}

/* for browsers that understand this is all you need for the flyouts */
#menu li:hover > ul {color: #fff; visibility:visible;}


/* for IE5.5 and IE6 you need to style each level hover */

/* keep the third level+ hidden when you hover on first level link */
#menu ul a:hover ul ul{
visibility:hidden;
}

/* make the second level visible when hover on first level link */
#menu ul a:hover ul {
visibility:visible;
}
/* make the third level visible when you hover over second level link */
#menu ul a:hover ul a:hover ul{ 
visibility:visible;
}

#menu ul li ul li#dd_fg a {
    background: #5284C7;
    color: #fff;
}

#menu ul li ul li#dd_nt a {
    background: #734D75;
    color: #fff;
}

#menu ul li ul li#dd_gs a {
    background: #CD5A00;
    color: #fff;
}

#menu ul li ul li#dd_fg a:hover, #menu ul li ul li#dd_nt a:hover, #menu ul li ul li#dd_gs a:hover {
    background: #7D8315;
}



/* --- header container
-------------------------------------------------------*/

#accessibility {
    position: relative;
    background: #333;
    min-width: 95%;
    padding: 5px;
    z-index: 5000;
}

#accessibility_components
{
    width: 400px;
    margin: 0 auto;
    position: relative;
    left: 310px;
}

#accessibility ul 
{
    position: relative;
    float: left;
    top: 4px;
    width: 90px;
}

#accessibility li {
    list-style: none;
    width: 30px;
    height: 24px;
    position: relative;
    float: left;
}

#accessibility li a 
{
    color: #fff;
}

#accessibility li span 
{
    display: none;
}

#skip_content a
{
    background: url(../images/btn_skip.gif) no-repeat;
    display: block;
    width: 24px;
    height: 24px;   
}

#text_reduce a
{
    background: url(../images/btn_smaller.gif) no-repeat;
    display: block;
    width: 24px;
    height: 24px;   
}

#text_larger a
{
    background: url(../images/btn_larger.gif) no-repeat;
    display: block;
    width: 24px;
    height: 24px;   
}



/* --- header container
-------------------------------------------------------*/

#site_header {
    background: url(../images/header_container.jpg) no-repeat bottom #fff;
    width: 628px;
    height: 258px;
    margin-top: 5px;
}

#site_map_header {
    width: 630px;
    height: 500px;
    margin-top: 5px;
}

#keywordSearch 
{
    position: relative;
    float: left;
    width: 100px;
}

#keywordSearch input 
{
    border: 1px solid #fff;
    background: #ccc;
    padding: 3px;   
}
 



/* --- header container
-------------------------------------------------------*/

h3.gardens_head, h3.content_headerbar {
    background: url(../../images/greencorner.gif) top right no-repeat #848B19;
    color: #fff;
}

p.gardens_link {
    background: url(../../images/contact_web_green.gif) top left no-repeat;
    color: #848B19;
    padding: 5px 30px 5px 30px;
}

p.gardens_link a {
    color: #848B19;
}

p.gardens_address 
{
    background: url(../../images/contact_address_green.gif) top left no-repeat #EFF2B5;
    color: #000;
    padding-left: 30px;
}

div.gardens_open {
    text-align: right;
    font-size: 14px;
    color: #5284C7;
}

h4.content_subheaderbar 
{
    background: #EFF2B5;
    color: #000;
}

h3#map_fg 
{
    background: url(../../images/bluecorner.gif) top right no-repeat #5284C7;
    color: #fff;  
}

h3#map_nt 
{
    background: url(../../images/purplecorner.gif) top right no-repeat #734D75;
    color: #fff;  
}

#map_detail_fg dt 
{
    background: #dbe5f3;
    padding: 5px;   
}

#map_detail_fg dt a 
{
    color: #5284C7;  
}

#map_detail_nt dt
{
    background: #e3d7e3;
    padding: 5px;   
}

#map_detail_nt dt a 
{
    color: #734D75;   
}

#map_detail_fg dd, #map_detail_nt dd  
{
    padding: 5px;
}   
            
dl#map_detail_fg, dl#map_detail_nt   
{
    margin-bottom: 20px;
}               
                    


/* --- footer
-------------------------------------------------------*/

#footer {
    margin-left: 230px;
    width: 500px;
}

#footer a {
    color: #6BA417;
    text-decoration: none;
}

#footer a:hover {
    color: #999999;
    text-decoration: underline;
}


/* --- form elements
-------------------------------------------------------*/

input {
    padding: 2px;
    margin: 3px;
}

.forminput {
    background: #fff;
    border: 1px solid #d4d4d4;
}
textarea
    {
        padding:2px;
        margin:3px;    
    }
fieldset
    {
        padding:20px; 
        width:600px;
    }
    
/* --- left col elements
-------------------------------------------------------*/
.downloadbrochure {
    background: url(../images/leftcol_downloadbrochure.jpg) top no-repeat;
    width: 192px;
    height: 235px;
    margin: 20px 0 30px 10px;
    clear: both;
}

.downloadbrochure dt {
    font: 110% Tahoma, Arial, Helvetica, sans-serif;
    color: #734d75;
    padding-top: 215px;
    margin-top: 20px;
}

.bookgardenbreak a 
{
    display: block;
    margin: 5px 0 5px 10px;
    width: 192px;
    height: 100px;
    background: url(../images/bookabrochure_img.jpg) no-repeat;
}

.bookgardenbreak span 
{
    display: none;
}






/* Activity Links
............................................................*/

#tpnw_links {
    position: relative;
    top: 20px;
    border-top: 1px dotted #ccc;
    clear: both;
    width: 620px;
    padding-bottom: 20px;
}

#bubble span { 
    display: none; 
    visibility: hidden;
    padding: 0;
    margin: 0;
    height: 0; 
}

#bubble a { 
    display: block;
    width: 66px;
    height: 100px;
    margin: 0;
}

ul#bubble {
    height: 200px;
    margin: 0;
    padding: 0;
    width: 620px;
}

ul#bubble li 
{
    margin-left:0px;
    display: block;
    width: 66px;
    height:100px;
    float: left;
    /*padding-left: 3px;*/
}

ul#bubble li a#adventure { 
    background: url(../images/adventure.gif) no-repeat;
    height: 93px;
    width: 66px;
}

ul#bubble li a#walking {  
    background: url(../images/walking.gif) no-repeat; 
}

ul#bubble li a#movies { 
    background: url(../images/movie-map.gif) no-repeat; 
}

ul#bubble li a#breaks { 
    background: url(../images/short-breaks.gif) no-repeat; 
}

ul#bubble li a#attractions { 
    background: url(../images/attractions.gif) no-repeat; 
}
ul#bubble li a#walled { 
    background: url(../images/walled-towns.gif) no-repeat; 
}

ul#bubble li a#golf { 
    background: url(../images/golf.gif) no-repeat; 
}

ul#bubble li a#events { 
    background: url(../images/events.gif) no-repeat; 
}

ul#bubble li a#giants { 
    background: url(../images/giants.gif) no-repeat; 
}

ul#bubble li a#nw08 { 
    background: url(../images/north-wales-08.gif) no-repeat; 
}


/* SEARCH ENGINE */

.highlight {
    background-color:Yellow;
    font-weight:bold;
    padding: 2px;
}

/* FLOATING GARDEN IMAGES */

.gardenContent
    {
        float:none;
        clear:left;   
        padding:10px 0px 10px 0px; 
        overflow:auto;
    }
.leftGarden
    {
        width:160px;
        float:left;    
    }
.rightGarden
    {
        width:400px;
        float:left;
        padding-left:10px;    
    }
.gardenImage
    {
        padding:5px;
        border:solid 1px #eeeeee;
    }


/* OFFERS*/

.offer
    {
        border:dashed 1px #cccccc; 
        margin-bottom:10px;
        padding:10px;   
        background-image: url(../images/offer_bg.jpg);
        background-position:bottom;
        background-repeat:no-repeat;
        background-color:White;
    }
.offer h3
    {   
        color:Black;
    }
.valid
    {
        text-align:right;    
    }

.tpnw
    {
        text-align:center; 
        padding-top:10px;   
    }
.telephone  
    {
        text-align:center;
        margin:0px 0px 10px 0px;    
    }
.centre
    {
        text-align:center;    
    }