Serving Oak Ridge Since 1943

Adding these color class names, as well as the class name “Overlay” to the banner above with add a color gradient on the banner image allowing for color contrast with the photo text: “Blue”, “Red”, “Gold”, “Mauve” or “Green”. Adding just the class name of "Overlay" will apply a dark gray overlay on the image.

Adding the class name "Event" to the banner (promoSlider) will change the blue background color behind the CTA on mobile to red.

  • List Item One
  • List Item Two
  • List Item Three
  • List Item Four
  • List Item Five

Darkness cannot drive out darkness: only light can do that. Hate cannot drive out hate: only love can do that."

Martin Luther King Jr.

The above is example styling when a blockquote is used. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores.


Buttons

Below is a standard button utilizing the class name "Button."You can find this button style in the Page/Panel Elements dropdown within the Admin.

Code for a standard button will look like:
<a class="Button" href="//link">Button Text</a>

"Button" style on a link

Below is blue button option if needed, which is utilizing the class names "Button Blue."You can find this button style in the Page/Panel Elements dropdown within the Admin.

Code for a blue button will look like:
<a class="Button Blue" href="//link">Button Text</a>

"Button Blue" style on a link

Below is an example of a row of buttons centered, which is utilizing the class name "ButtonRow" on the p tag surrounding the a tag.

Code for a row of center buttons will look like:
<p class="ButtonRow"><a class="Button" href="//link">Button Text</a><a class="Button" href="//link">Button Text</a><a class="Button" href="//link">Button Text</a></p>

"Button" style on a link"Button" style on a link"Button" style on a link


Three Column List

  • Item1
  • Item2
  • Item3
  • Item4
  • Item5
  • Item6
  • Item7
  • Item8
  • Item9

Two Column List

  • Item1
  • Item2
  • Item3
  • Item4
  • Item5
  • Item6

Two Column Boxes

This is some text that is in a two column container. I'm using div instead of UL or OL

This is some text that is in a two column container. I'm using div instead of UL or OL

Three Column Boxes

This is some text that is in a three column container. I'm using div instead of UL or OL

This is some text that is in a three column container. I'm using div instead of UL or OL

This is some text that is in a three column container. I'm using div instead of UL or OL


Tab Container

Adding the class name "Event" to tabs or accordions will change the accordion hover colors to red and green. Accessible Tab Container on large screens, Accordions on small screen sizes. This Tab Container was designed and styled to display up to six different tabs. Add the class name "Event" from the styles dropdown to change the accordions to the red and green combo.

Tab Heading 1

This accordion is styled as an accordion on small resolutions and tabs at large resolutions.

Button Text

Tab Heading 2

Heading Text

All these toggles are H3s. These can be changed to H2s or lower headings. Remember to nest headings in order appropriately on the page to meet WCAG 2.0 success criteria.

Tab Heading 3

Accordions can contain other accordions, tabs, headings, lists, tables, iframes, anything you like, but please be cautious in doing so as you do not want to complicate the page.

Button Text

Tab Heading 4

Etiam ut sapien. Integer pharetra nunc eu eros. Aenean ullamcorper sapien a leo. Nunc lobortis mauris id lectus. Nunc commodo erat. Cras molestie urna quis felis porta rutrum. Integer malesuada.

Tab Heading 5

Etiam ut sapien. Integer pharetra nunc eu eros. Aenean ullamcorper sapien a leo. Nunc lobortis mauris id lectus. Nunc commodo erat. Cras molestie urna quis felis porta rutrum. Integer malesuada.

Button Text

Tab Heading 6

Heading Text

Etiam ut sapien. Integer pharetra nunc eu eros. Aenean ullamcorper sapien a leo. Nunc lobortis mauris id lectus. Nunc commodo erat. Cras molestie urna quis felis porta rutrum. Integer malesuada.

"Accordion"

Adding the class name "Event" to tabs or accordions will change the accordion hover colors to red and green. This is your classic accordion where when one item is clicked the other closes. Add the class name "Event" from the styles dropdown to change the accordions to the red and green combo.

Accordion Heading 1

This accordion functions as an accordion on all resolutions. Only one accordion in the group can be open at a time. Add class of "open" to one specific toggle heading to make this accordion section open by default instead of closed.

Button Text

Accordion Heading 2

All these toggles are H3s. These can be changed to h2s or lower headings. Remember to nest headings in order appropriately on the page to meet WCAG 2.0 success criteria.

Accordion Heading 3

Heading Text

Accordions can contain other accordions, tabs, headings, lists, tables, iframes, anything you like, but please be cautious in doing so as you do not want to complicate the page.

Accordion Heading 4

Content for the fourth accordion.

Accordion Heading 5

Content for the fifth accordion.

Button Text

Accordion Heading 6

Heading Text

Content for the sixth accordion.

"Accordion (independent triggers)"

Adding the class name "Event" to tabs or accordions will change the accordion hover colors to red and green. Like an accordion but each item opens and closes independently of the others. Add the class name "Event" from the styles dropdown to change the accordions to the red and green combo.

Accordion Heading 1

Content for the first accordion. Just a regular link.

Accordion Multi Heading 2

Heading Text

Content for the second accordion.

Button Text

Accordion Multi Heading 3

Content for the third accordion.

Accordion Multi Heading 4

Content for the fourth accordion.

Accordion Multi Heading 5

Heading Text

Content for the fifth accordion.

Accordion Multi Heading 6

Content for the sixth accordion.

Button Text

Lightbox Styles

Example of thumb image linked to a larger image. Description overlay is title attribute of link:
Test image


Image that opens a YouTube video source in a lightbox

By adding the class of "YouTubeVideo" to your link, your nested image will get an overlay of a play icon and your link (YouTube video) will open within a lightbox. Please use the YouTube embed path for your link.

Use the Styles dropdown within the Admin to add a class name to your link.

If a link (a href="/") with a class of "YouTubeVideo" is around an image, the play icon is automatically added.

Code for this will look like:
<a class="YouTubeVideo" href="//www.youtube.com/embed/l8glB7jZCHs">
<img alt="placeholder" src="//placehold.it/650x400" />
</a>

Below is an example of what this would look like on the site.

Play YouTube Video

Embedded Video

Below is an embedded video iframe utilizing a plain background. You can find this video style named "Video BG - Plain" in the Page/Panel Elements dropdown within the Admin. Be sure to update the title attribute, as well as the video source link.

Code utilizing the class "VideoBGPlain" for this will look like:
<div class="VideoBGPlain">
<iframe src="https://www.youtube.com/embed/K2WxoI66Jew" frameborder="0" height="315" width="560" title="Play Video: A Visit to the Hem/Onc Clinic" allowfullscreen>
</iframe>
</div>

Fantasy Of Trees 2020 Cancelled

After much careful consideration, East Tennessee Children’s Hospital announces the need to cancel this year’s Fantasy of Trees event due to ongoing concerns over the continued increase in COVID-19 cases in our community. The annual event is the hospital’s single largest fundraiser, attracting 60,000 people, during the week of Thanksgiving, each year.

Below Main Left

The maximum image width for this panel is 758px. The height is flexible.

Below Main Right

The maximum image width for this panel is 758px. The height is flexible.

Below Main Text

The maximum image width for this panel is 1580px. The height is flexible.

Adding one of these background color panels to the Row slots will produce the colored wave background panel featured below:

  • Templates: Campaign: BlueBackground
  • Templates: Campaign: GoldBackground
  • Templates: Campaign: GreenBackground
  • Templates: Campaign: MauveBackground
  • Templates: Campaign: PeachBackground
  • Templates: Campaign: RedBackground

Adding the class name “Blue” to h2 headers on dark photo panels will make them blue. (Sometimes necessary for color contrast on images when the default is white.)

Background Image Gold

More About Fantasy of Trees

Directions & Parking

Fantasy of Trees is located in the Knoxville Convention Center, in downtown Knoxville, TN. This page provides directions to the Convention Center from all local interstates, as well as information on where to park.

Directions & Parking

History of Giving

East Tennessee Children's Hospital is able to provide care and equipment with the generous support of people in East Tennessee who support Children's through fundraising events such as Fantasy of Trees.

History of Giving

Shops

One of our most popular attractions is our large selection of holiday-themed shops and kiosks. It's the perfect place to find the perfect present! Come stroll along our Village Marketplace for some special holiday shopping at these great vendors. 

Shops

Raffle Tree

Raffle Tree - WalMartRaffle Tree - Home DepotVisitors can purchase a ticket for $5 for a chance to win a beautiful seven-foot tree and gifts from Walmart Stores of Knoxville and The Home Depot, or one of four other prizes. 

Raffle Tree

Background Image Placeholder

Full Width Header Three

Alice in Wonderland

Adding the class name “Blue” to h2 headers, like the full width header, on dark photo panels will make them blue. (Sometimes necessary for color contrast on images.) Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore.

Alice in Wonderland

Alice was beginning to get very tired of sitting by her sister on the bank, and of having nothing to do. Once or twice she had peeped into the book her sister was reading, but it had no pictures or conversations in it, "and what is the use of a book," thought Alice, "without pictures or conversations?"

Alice in Wonderland

So she was considering in her own mind (as well as she could, for the day made her feel very sleepy and stupid), whether the pleasure of making a daisy-chain would be worth the trouble of getting up and picking the daisies, when suddenly a White Rabbit with pink eyes ran close by her.

What Patients Are Saying

Darkness cannot drive out darkness: only light can do that. Hate cannot drive out hate: only love can do that.

Martin Luther King Jr.

Darkness cannot drive out darkness: only light can do that. Hate cannot drive out hate: only love can do that.

Martin Luther King Jr.

Fantasy of Trees

Est.1985

Hours
  • Monday: 8 A.M. to 7 P.M.
  • Tuesday: 8 A.M. to 7 P.M.
  • Wednesday: 8 A.M. to 7 P.M.
  • Thursday: 8 A.M. to 7 P.M.
  • Friday: 8 A.M. to 6 P.M.
  • Saturday: 8 A.M. to 4 P.M.
  • Sunday: CLOSED

NEW HOURS! We are proud to serve children and families in Oak Ridge and surrounding communities and continue the legacy of excellent health care started by Dr. Preston almost eighty years ago. If you want caring, compassionate staff and doctors who always strive to do the right thing, then schedule an appointment for your child. We hope to see you soon!