html{
    border-top:         20px solid #EDEDED;
    overflow-y:         scroll;
    width:              772px;
    margin:             0 auto;
    #border-top:        none;
    #width:             auto;
    #margin:            0;
    #background-color:  #EDEDED;
    #padding-top:       20px;
    }
body{
    background:         #EDEDEF url(../../images/background.png) 50% 0% repeat-y;
    font-family:        Georgia, Times, serif;
    color:              #666;
    margin:             0;
    margin:             0 auto;
    position:           relative;
    #width:             772px;
    _width:             771px;
    #height:            100%;
    }
a{
    color:              #BE1E2D;
    text-decoration:    none;
    }

img{
    border:             none;
    }


/**********************************************************
  HEADING AREA
**********************************************************/    
#Heading{
    width:              772px;
    height:             75px;
    background:         #FFF url(../../images/heading.png) 0 0 no-repeat;
    position:           relative;
    }

#Logo{
    display:            block;
    position:           absolute;
    top:                36px;
    left:               18px;
    width:              492px;
    height:             22px;
    overflow:           hidden;
    text-indent:        -9999px;
    }
    
#ContactLink{
    position:           absolute;
    bottom:             15px;
    right:              14px;
    display:            block;
    width:              47px;
    height:             17px;
    overflow:           hidden;
    text-indent:        -9999px;
    background:         #FFF url(../../images/contact-link.png) 0% 50% no-repeat;
    }
#ContactLink:hover{
    background-position:100% 50%;
    }

    
/**********************************************************
  NAVIGATION
**********************************************************/
#Navigation{
    clear:              left;
    width:              147px;
    float:              left;
    list-style:         none;
    margin:             10px 0 0 8px;
    padding:            0 0 200px 0;
    overflow:           hidden;                                                           
    text-indent:        -9999px;
    _margin-left:       3px;
    }
    
#Navigation li{
    margin:             0;
    padding:            6px 0;
    border-top:         1px solid #FFF;
    }
#Navigation li.first{
    border-top:         none;
    }
#Navigation a{
    display:            block;                                                            
    height:             12px;
    background:         transparent url(../../images/navigation.png) 0 0 no-repeat;
    outline:            none;
    margin-left:        12px;
    overflow:           hidden;
    }
#Navigation a:hover,
#Navigation a.active{
    margin-left:        -219px;
    }

a#AboutLink{background-position:0 0}
a#NewsLink{background-position:0 -13px}
a#BiosLink{background-position:0 -26px}
a#VisitLink{background-position:0 -39px}
a#GalleryLink{background-position:0 -52px}

#Navigation ul{
    list-style:         none;
    padding:            0;
    margin:             0;
    text-indent:        22px;
    position:           relative;
    }
#Navigation ul li{
    border-top:         none;
    padding:            0;
    }
#Navigation ul a{
    background-image:   none;
    text-decoration:    none;
    font-size:          75%;
    color:              #808080;
    display:            block;
    margin:             0 0 8px;
    overflow:           visible;
    }
#Navigation ul a:hover,
#Navigation ul a.active{
    margin-left:        0;
    color:              #BE1E2D;
    }


/**********************************************************
  FACEBOOK LINK
**********************************************************/
#Navigation #Facebook{
    display:            block;
    position:           relative;
    top:                42px;
    height:             27px;
    background:         transparent url(../../images/facebook.png) 0 -27px no-repeat;
    text-indent:        -9999px;
    }
#Navigation #Facebook:hover{
    margin-left:        12px;
    background-position:0 0;
    }


/**********************************************************
  ON MOST [BUT NOT ALL] PAGES
**********************************************************/
#Content{
    position:           relative;
    float:              left;
    width:              510px;
    margin-left:        32px;
    font-size:          80%;
    line-height:        1.4em;
    padding-bottom:     60px;
    }
#Content h2{
    height:             27px;
    overflow:           hidden;
    text-indent:        -9999px;
    margin:             18px 0 -2px;
    background-position:0 0;
    background-repeat:  no-repeat;
    }
#Content p{
    margin-top:         .8em;
    }
.narrowBanner{
    margin-left:        11px;
    padding-bottom:     5px;
    background:         transparent url(../../images/banner-stripes.gif) 0% 100% repeat-x;
    _margin-left:       10px;
    }


/**********************************************************
  HEAHDLINES
**********************************************************/
#HomeHeadline{background-image:   url(../../images/headlines/get-to-know-george-and-suzy.png)}
#AboutHeadline{background-image:  url(../../images/headlines/about.png)}
#NewsHeadline{background-image:   url(../../images/headlines/news.png)}
#GeorgeHeadline{background-image: url(../../images/headlines/george.png)}
#SuzyHeadline{background-image:   url(../../images/headlines/suzy.png)}
#VisitHeadline{background-image:  url(../../images/headlines/visit.png)}

    
/**********************************************************
  HOME AND NEWS PAGES
**********************************************************/
.newsItem{
    width:              565px;
    border-top:         1px solid #808080;
    position:           relative;
    }
.newsItem img{
    float:              left;
    margin:             18px 0 18px;
    width:              92px;
    background-color:   #E6E6E6;
    border:             1px solid #B3B3B3;
    }
.newsItem h3{
    margin:             18px 0 3px 108px;
    color:              #B3B3B3;
    font-weight:        normal;
    }
.newsItem p{
    margin:             0 80px 18px 108px;
    }


/**********************************************************
  HOME PAGE
**********************************************************/
#HomeImageContainer{
    width:              770px;
    border-top:         1px solid #666;
    border-right:       1px solid #666;
    border-left:        1px solid #666;
    overflow:           hidden;
    padding-top:        3px;
    background:         #FFF url(../../images/home-bar.png) 50% 100% no-repeat;
    position:           relative;
    top:                -5px;
    height:             229px;
    }
#HomeImageContainer img{
    width:              770px;
    }

#Introduction p{
    font-size:          160%;
    line-height:        1.4em;
    margin-top:         0;
    width:              565px;
    }

a.facebook{
    display:            block;
    margin-top:         .6em;
    }


/* Hiding the two extra elements needed on the home page if the article is short */
.readMoreLink,
.fade{
    display:            none;
    }

/* Making those elements visible (and giving all proper styling) if the article IS long */
.long{
    height:         200px;
    overflow:           hidden;
    }
.long .readMoreLink{
    display:            block;
    color:              #BE1E2D;
    position:           absolute;
    z-index:            2;
    top:                170px;
    left:               108px;
    text-decoration:    none;
    }
.long .fade{
    display:            block;
    position:           absolute;
    width:              400px;
    height:             80px;
    top:                120px;
    left:               108px;
    background:         transparent url(../../images/fade.png) 0 0 no-repeat;
    _background-image:  none;
    _filter:            progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/fade.png,sizingMethod='image');
    }


/**********************************************************
  NEWS PAGE
**********************************************************/
.newsPage .newsItem{
    border-top:         none;
    border-bottom:      1px solid #808080;
    }
.newsPage .newsItem img{
    margin-top:         0;
    }
.newsPage .newsItem h3{
    color:              #BE1E2D;
    font-size:          135%;
    }
.newsPage .newsItem p{
    margin-right:       40px;
    }

/* Styling for admin tools for the news */

#AdminLogin{
    position:           absolute;
    top:                22px;
    left:               85px;
    font-size:          90%;
    font-family:        Verdana, Arial, sans-serif;
    }
#AdminLogin input{
    margin-left:        5px;
    }
#AdminError{
    font-weight:        bold;
    font-style:         italic;
    color:              #BE1E2D;
    margin-left:        5px;
    }
#AdminNote{
    background-color:   #222;
    color:              #FFF;
    margin:             -5px 0 0 166px;
    padding:            8px;
    text-align:         center;
    font-family:        Helvetica, Arial, sans-serif;
    font-size:          80%;
    font-weight:        bold;
    letter-spacing:     .07em;
    }
#AdminNote a{
    color:              #BE1E2D;
    }

#StopReorderingLink{
    font-family:        Helvetica, Arial, sans-serif;
    color:              #BE1E2D;
    display:            block;
    margin:             10px 0;
    }

#NewsList{
    list-style:         none;
    margin:             0;
    padding:            0;
    }
#NewsList li{
    clear:              left;
    margin-top:         10px;
    }
    
#NewsList .handle{
    display:            none;
    }
    
#NewsList.reorder li{
    margin-top:         0;
    }
#NewsList.reordering .handle{
    display:            block;
    float:              left;
    width:              11px;
    border:             none;
    background:         #FFF;
    }
#NewsList.reordering .newsTitle{
    margin-left:        18px;
    }
#NewsList.reordering textarea,
#NewsList.reordering label,
#NewsList.reordering .deleteCheck,
#NewsList.reordering .file,
#NewsList.reordering img{
    display:            none;
    }
#NewsList.reordering .newsItem{
    border-bottom:      none;
    }

    
#NewsList .newsItem{
    padding-bottom:     8px;
    }
#NewsList input,
#NewsList textarea{
    display:            block;
    margin-left:        110px;
    }
#NewsList .newsTitle{
    width:              250px;
    }
#NewsList textarea{
    width:              400px;
    height:             280px;
    }
#NewsList label{
    margin-left:        110px;
    }

#NewsList .deleteCheck{
    display:            inline;
    margin-left:        0;
    }
    
#NewsAdminControls{
    margin-top:         22px;
    }
    

/**********************************************************
  VISIT PAGE
**********************************************************/
#Map{
    border:             1px solid #666;
    padding:            3px;
    margin:             12px -50px 0 40px;
    position:           relative;
    float:              right;
    line-height:        0;
    }
    
#Content.visit h3{
    font-weight:        normal;
    font-family:        Verdana, Arial, sans-serif;
    color:              #BE1E2D;
    margin-bottom:      0;
    clear:              both;
    }
    
#Content.visit p{
    margin-top:         0;
    }
    
#Content.visit table{
    text-align:         left;
    width:              400px;
    margin-bottom:      12px;
    }
    
    
/**********************************************************
  GALLERY PAGEs
**********************************************************/    
#Content.gallery{
    margin-left:        22px;
    width:              590px;
    line-height:        1em;
    }

#GalleryList{
    margin:             14px 0 8px;
    color:              #B3B3B3;
    }
#GalleryList span{
    font-size:          7pt;
    font-family:        Verdana, Arial, sans-serif;
    text-transform:     uppercase;
    }
#GalleryList a{
    font-size:          9pt;
    color:              #808080;
    text-decoration:    none;
    padding:            0 8px;
    }
#GalleryList a:hover,    
#GalleryList a.active{
    color:              #BE1E2D;
    }

#Thumbnails{
    width:              95px;
    float:              right;
    }
#Thumbnails a{
    outline:            none;
    }
#Thumbnails img{
    border:             1px solid #FFF;
    margin:             0;
    opacity:            .9;
    #filter:            alpha(opacity=90);
    }
#Thumbnails a:hover img,
#Thumbnails a.active img{
    opacity:            1;
    #filter:            alpha(opacity=100);
    }  
#Thumbnails a.active img{
    border-color:       #BE1E2D;
    }
    
#MainImage{
    width:              488px;
    background:         #FFF url(../../images/spinner.gif) 50% 180px no-repeat;
    }
    
#ImageCaption{
    margin:             4px 0 0 4px;
    }