1. /* clear all */
  2.  
  3. * {
  4.         margin: 0;
  5.         padding: 0;
  6.         font-family: Arial, Helvetica, sans-serif;
  7.         font-size: 1em;
  8. }
  9.  
  10. /* elements */
  11.  
  12. body {
  13.         color: #333333;
  14.         background: #5F634C url("images/body.gif") repeat left top;
  15. }      
  16.  
  17. a {
  18.         outline: none;
  19.         color: #390;
  20.         cursor: pointer;
  21. }
  22.  
  23. a:hover {
  24.  
  25. }
  26.  
  27. img {
  28.         border: 0;
  29. }
  30.  
  31. /* layers */
  32.  
  33. /* header */
  34.  
  35. #header {
  36.         height: 125px;
  37.         width: 864px;
  38.         margin: 0 auto;
  39.         background: transparent url("images/header.png") no-repeat left top;
  40. }
  41.         /* logo */
  42.  
  43.         #header h1 {
  44.                 padding: 25px 0 0 50px;
  45.                 float: left;
  46.         }
  47.                 #header h1 a {
  48.                         display: block;
  49.                         width: 180px;
  50.                         height: 100px;
  51.                         text-indent: -5000px;
  52.                 }
  53.                
  54.         /* check availability */
  55.                
  56.         #header p {
  57.                 float: right;
  58.                 padding: 47px 23px 0 0;
  59.         }
  60.                 #header p a {
  61.                         display: block;
  62.                         width: 138px;
  63.                         height: 18px;
  64.                         text-indent: -5000px;
  65.                 }
  66.                
  67. /* contents of the site */
  68.                
  69. #site {
  70.         width: 720px;
  71.         padding: 0 72px;
  72.         margin: 0 auto;
  73.         background: transparent url("images/site.png") repeat-y left top;
  74.         overflow: auto;
  75. }
  76.         /* common characteristics for both menus, top and bottom */
  77.  
  78.         .menu {
  79.                 clear: both;
  80.         }
  81.                 .menu ul li {
  82.                         float: left;
  83.                         list-style-type: none;
  84.                 }
  85.                         .menu ul li a {
  86.                                 display: block;
  87.                                 text-indent: -5000px;
  88.                                 height: 25px;
  89.                         }
  90.                        
  91.         /* top menu */
  92.                        
  93.         #topmenu {
  94.                 width: 720px;
  95.                 height: 25px;
  96.                 background: transparent url("images/topmenu.png") no-repeat left top;
  97.                 margin: 0 auto;
  98.         }
  99.                 #a_welcome { width: 75px; }
  100.                 #a_lodging { width: 74px; }
  101.                 #a_dining { width: 64px; }
  102.                 #a_spa { width: 38px; }
  103.                 #a_weddings { width: 86px; }
  104.                 #a_spaces { width: 140px; }
  105.                 #a_concierge { width: 88px; }
  106.                 #a_specials { width: 78px; }
  107.                 #a_about { width: 77px; }
  108.                
  109.         /* bottom menu */
  110.                
  111.         #bottommenu {
  112.                 width: 720px;
  113.                 height: 25px;
  114.                 background: transparent url("images/bottommenu.png") no-repeat left top;
  115.                 margin: 0 auto;
  116.         }
  117.                 #a_reservation { width: 168px; }
  118.                 #a_contact { width: 99px; }
  119.                 #a_location { width: 176px; }
  120.                 #a_grounds { width: 113px; }
  121.                 #a_green { width: 164px; }
  122.                
  123.         /* text part of the page */
  124.                        
  125.         #text {
  126.                 margin: 20px 0;
  127.         }
  128.                 #site .index {
  129.                         padding-right: 192px;
  130.                 }
  131.        
  132.                 /* four image links */
  133.        
  134.                 ul#imagelinks li {
  135.                         float: left;
  136.                         list-style-type: none;
  137.                         margin: 30px 0 0 0;
  138.                 }
  139.                         ul#imagelinks li a {
  140.                                 display: block;
  141.                                 text-indent: -5000px;
  142.                                 height: 140px;
  143.                         }
  144.                                 ul#imagelinks li #ai_spa {
  145.                                         width: 155px;
  146.                                         background: transparent url("images/spa.jpg") no-repeat left top;
  147.                                         margin: 0 16px 20px 0;
  148.                                 }
  149.                                 ul#imagelinks li #ai_weddings {
  150.                                         width: 171px;
  151.                                         background: transparent url("images/weddings.jpg") no-repeat left top;
  152.                                         margin: 0 16px 20px 0;
  153.                                 }
  154.                                 ul#imagelinks li #ai_lodging {
  155.                                         width: 170px;
  156.                                         background: transparent url("images/lodging.jpg") no-repeat left top;
  157.                                         margin: 0 16px 20px 0;
  158.  
  159.                                 }
  160.                                 ul#imagelinks li #ai_wv {
  161.                                         width: 170px;
  162.                                         background: transparent url("images/WVlogo.gif") no-repeat center center;
  163.                                         margin: 0;
  164.                                 }
  165.                                
  166.                 /* text */
  167.                                
  168.                 #text p {
  169.                         font-size: .75em;
  170.                         margin-bottom: 15px;
  171.                         line-height: 18px;
  172.                 }
  173.                 #text p.address {
  174.                         font-size: .7em;
  175.                         padding-top: 30px;
  176.                 }
  177.                 #text p.about {
  178.                         font-size: .65em;
  179.                         margin-bottom: 0;
  180.                 }
  181.                
  182.                 /* sidebar */
  183.                
  184.                 #sidebar {
  185.                         margin-top: 0;
  186.                         width: 175px;
  187.                         float: right;
  188.                 }
  189.                 /* sidebar2 */
  190.                
  191.                 #sidebar2 {
  192.                         margin-top: 20px;
  193.                         width: 175px;
  194.                         float: right;
  195.                 }
  196.                 /* specials2 (for snippet master) */
  197.                
  198.                         #specials2 {
  199.                                 width: 175px;
  200.                                 height: 600px;
  201.                                 background: transparent url("images/specials_back.gif") repeat left top;
  202.                                 color: #ffc;
  203.                                 font-size: .85em;
  204.                                 overflow: auto;
  205.                         }      
  206.                                 #specials2 h2 {
  207.                                         text-indent: -5000px;
  208.                                         height: 56px;
  209.                                 }
  210.                                         #specials2 h3 {
  211.                                                 font-family: Georgia, "Times New Roman", Times, serif;
  212.                                                 font-size: 1em;
  213.                                                 font-weight: bold;
  214.                                                 margin: 10px 5px 3px 5px;
  215.                                         }
  216.                                                 #specials2 p {
  217.                                                         margin: 5px;
  218.                                                 }
  219.                         /* specials (for snippet master) */
  220.                
  221.                         #specials {
  222.                                 width: 175px;
  223.                                 height: 300px;
  224.                                 background: transparent url("images/specials_back.gif") repeat left top;
  225.                                 color: #ffc;
  226.                                 font-size: .75em;
  227.                                 overflow: auto;
  228.                         }      
  229.                                 #specials h2 {
  230.                                         text-indent: -5000px;
  231.                                         background: transparent url("images/specials.gif") no-repeat center top;
  232.                                         height: 56px;
  233.                                 }
  234.                                         #specials h3 {
  235.                                                 font-family: Georgia, "Times New Roman", Times, serif;
  236.                                                 font-size: 1em;
  237.                                                 font-weight: bold;
  238.                                                 margin: 10px 5px 3px 5px;
  239.                                         }
  240.                                                 #specials p {
  241.                                                         margin: 5px;
  242.                                                 }
  243.                                                
  244.                 /* bottom of sidebar */
  245.                                                
  246.                 #sidebar #ads {
  247.                         text-align: center;
  248.                         margin: 10px 0 0 0;
  249.                 }
  250.                        
  251. /* big header photos */
  252. .header_photo {
  253.         width: 720px;
  254.         height: 364px;
  255. }
  256.         /* wedding page header photo */
  257.         #weddings_photo {
  258.                 background: transparent url("images/index5.jpg") no-repeat left top;
  259. }
  260.    /* Questionnaire page header photo */
  261.         #questionnaire_photo {
  262.                 background: transparent url("images/wedding-top.jpg") no-repeat left top;
  263.                
  264. }
  265.         /* wedding page2 header photo */
  266.         #weddings2_photo {
  267.                 background: transparent url("images/wedding2-top.jpg") no-repeat left top;
  268. }
  269.  
  270.         /* about page header photo */
  271.         #about_photo {
  272.                 background: transparent url("images/index6.jpg") no-repeat left top;
  273. }
  274.  
  275.    /* Lodging page header photo */
  276.         #lodging_photo {
  277.                 background: transparent url("images/lodging1.jpg") no-repeat left top;
  278. }
  279.  
  280.    /* dining page header photo */
  281.         #dining_photo {
  282.                 background: transparent url("images/index4.jpg") no-repeat left top;
  283. }
  284.    /* spa page header photo */
  285.         #spa_photo {
  286.                 background: transparent url("images/spa3.jpg") no-repeat left top;
  287. }
  288.    /* green page header photo */
  289.         #green_photo {
  290.                 background: transparent url("images/index4.jpg") no-repeat left top;
  291. }
  292.  /* spaces page header photo */
  293.         #spaces_photo {
  294.                 background: transparent url("images/index3.jpg") no-repeat left top;
  295. }
  296.  /* contact page header photo */
  297.         #contact_photo {
  298.                 background: transparent url("images/index2.jpg") no-repeat left top;
  299. }
  300.  /* grounds page header photo */
  301.         #grounds_photo {
  302.                 background: transparent url("images/index2.jpg") no-repeat left top;
  303. }
  304.  /* reservations page header photo */
  305.         #reservations_photo {
  306.                 background: transparent url("images/reservations.jpg") no-repeat left top;
  307. }
  308.  /* location page header photo */
  309.         #location_photo {
  310.                 background: transparent url("images/entrance.jpg") no-repeat left top;
  311. }
  312. /* activities page header photo */
  313.         #activities_photo {
  314.                 background: transparent url("images/activities.jpg") no-repeat left top;
  315. }
  316.  
  317. /* text */
  318. .title {
  319.         text-indent: -5000px;
  320.         height: 23px;
  321. }
  322.  
  323.         /* titles in text */
  324.         #weddings_title {
  325.                 background: transparent url("images/weddings_title.gif") no-repeat left top;
  326.         }
  327.         #about_title {
  328.                 background: transparent url("images/about_title.gif") no-repeat left top;
  329.         }
  330.         #lodging_title {
  331.                 background: transparent url("graphics/lodging.gif") no-repeat left top;
  332.         }
  333.         #lodging_title2 {
  334.                 background: transparent url("graphics/farmhouse.gif") no-repeat left top;
  335.         }
  336.         #lodging_title3 {
  337.                 background: transparent url("graphics/suites.gif") no-repeat left top;
  338.         }
  339.         #lodging_title4 {
  340.                 background: transparent url("graphics/small-cottages.gif") no-repeat left top;
  341.         }
  342.         #lodging_title5 {
  343.                 background: transparent url("graphics/large-cottages.gif") no-repeat left top;
  344.         }
  345.         #dining_title {
  346.                 background: transparent url("graphics/dining.gif") no-repeat left top;
  347.         }
  348.         #spa_title {
  349.                 background: transparent url("graphics/spa2.gif") no-repeat left top;
  350.         }
  351.         #spaces_title {
  352.                 background: transparent url("graphics/outdoor.gif") no-repeat left top;
  353.         }
  354.         #activities_title {
  355.                 background: transparent url("graphics/activities.gif") no-repeat left top;
  356.         }
  357.         #activities1_title {
  358.                 background: transparent url("graphics/at-creekside.gif") no-repeat left top;
  359.         }
  360.         #activities2_title {
  361.                 background: transparent url("graphics/historic.gif") no-repeat left top;
  362.         }
  363.         #activities3_title {
  364.                 background: transparent url("graphics/active.gif") no-repeat left top;
  365.         }
  366.         #activities4_title {
  367.                 background: transparent url("graphics/shopping.gif") no-repeat left top;
  368.         }
  369.         #specials_title {
  370.                 background: transparent url("graphics/specials.gif") no-repeat left top;
  371.         }
  372.         #reservations_title {
  373.                 background: transparent url("graphics/reservations.gif") no-repeat left top;
  374.         }
  375.         #contact_title {
  376.                 background: transparent url("graphics/contact.gif") no-repeat left top;
  377.         }
  378.         #location_title {
  379.                 background: transparent url("graphics/location.gif") no-repeat left top;
  380.         }
  381.         #location_title2 {
  382.                 background: transparent url("graphics/directions.gif") no-repeat left top;
  383.         }
  384.         #grounds_title {
  385.                 background: transparent url("graphics/grounds.gif") no-repeat left top;
  386.         }
  387.        
  388.        
  389.         /* introductions */
  390.         #text p.intro {
  391.                 font-style: italic;
  392.                 margin: 15px 0;
  393.         }
  394.        
  395.         /* right floated images */
  396.         .image {
  397.                 float: right;
  398.                 margin: 0 0 10px 20px;
  399.         }
  400.                 /* left floated images */
  401.         .image2 {
  402.                 float: left;
  403.                 margin: 0 0 10px 20px;
  404.         }
  405.  
  406.         /* sections of text */ 
  407.         .box {
  408.                 padding-top: 20px;
  409.         }
  410.                 /* bold italic subtitles */
  411.                 .box h3 {
  412.                         font-style: italic;
  413.                         font-weight: bold;
  414.                         font-size: .75em;
  415.                 }
  416.                         /* lists */
  417.                         .box ul {
  418.                                 margin: 15px 300px 15px 50px;
  419.                                 font-size: .75em;
  420.                         }
  421.                                 .box ul li {
  422.                                         line-height: 18px;
  423.                                 }
  424.        
  425. .wv {
  426.         float: right;
  427.         padding-top: 30px;
  428. }
  429.        
  430. /* footer */
  431.                
  432. #footer {
  433.         padding: 70px 0 20px 0;
  434.         background: transparent url("images/footer.png") no-repeat left top;
  435.         width: 864px;
  436.         margin: 0 auto;
  437.         text-align: center;
  438.         color: #390;
  439.         font-size: .65em;
  440.         clear: both;
  441.         line-height: 18px;
  442. }
  443.         #footer a {
  444.                 color: #390;
  445.         }