Thank you, to whomever answered my question. If someone else would like to give a different answer and break down how it is done, that would be great. Here's the problem;

Select one of your previous labs, preferably the one that you think looks the best, and make it responsive so that it looks great on a smartphone in portrait mode with media queries. It should look the way it used to, but just have a more compact look and feel when the screen width shrinks down to 320 pixels. In addition to performing media queries based on size and color, you should include at least one layout-based media query such that the physical position and layout of items changes in phone portrait mode. If none of your previous labs seem to have content that is conducive to demonstrating changing a page layout for a smaller form factor, you should create a new example instead, so as to demonstrate your mastery of media queries and making a site that adapts to both computers and smartphones.

Here is what I am using for my previous assignment;

HTML:

What it is like owning a ferret

...or at least what I think it is like owning a ferret

By Nina Gibson

When I first heard about ferrets I was really too young to know about what they were.

I just thought they were cute and fascinating. In 1987, several years after the movie

originally came out, I watched a movie called The Beastmaster. In that movie there

were these long fury animals that stole things from other people. I thought they were

so cute and funny. Other movies that had ferrets in them were the movies

Kindergarten Cop, and "Along came Polly". I knew then I had to have a ferret. A few

years went by before I thought about getting a ferret. That is until I saw them

again in the pet store. I saved my money and finally got one. She was six weeks old,

tiny and adorable. I loved her instantly. I had not done much research until after I

got her.

As I mentioned before I got my first ferret, I did a lot of research. Using the internet

was barely an option in the early 90s. So, I used other resources. If you are interested

in getting a ferret there are a few facts you need to research and some fun facts you will

enjoy reading about. Let's start with the facts that you will need to know.

Diet

Should be Protein Based foods.

Health

Bathing, Suppliments, nail clipping, ear cleaner, illness remedies, etc.

Housing Supplies

Cage, litter box, litter, sleeping area, food and water dish.

Over the years I have owned 3 ferrets and each one has been more lovable and entertaining

than the last. The one I currently own is now 5, almost 6, years old and very energetic.

Now that I am getting older I do not have a lot of time to train a new ferret but there are

older ferrets that still need a home and those are the ones I try to gear myself towards.

Ferrets are known to suffer from several distinct health problems. Among the most common are cancers affecting the adrenal glands, pancreas, and lymphatic system. Viral diseases include canine distemper and influenza. Health problems can

occur in unspayed females when not being used for breeding. Certain health problems have also been linked to ferrets being neutered before reaching sexual maturity. Certain colors of ferret may also carry a genetic defect known as

Waardenburg syndrome. Similar to domestic cats, ferrets can also suffer from hairballs and dental problems.

Many ferret owners in England and Europe keep their ferrets outdoors, but that practice is rare in the United States. This is because heartworm disease,

canine distemper, and rabies are common diseases in the U.S., and ferrets can develop all of these. Another reason why ferrets do better inside is because they are extremely prone to heatstroke, and any temperature above 75F can be dangerous.

Ferrets are safest and most comfortable at 65-68F. It is very important that a ferret has a safe and secure cage, like the Ferret Nation. For a single ferret, the smallest cage you put him in should be no less than 3 ft long by 2 ft high.

Obviously, a bigger cage is better. If you have multiple ferrets, you will need a multi-level cage.

Ferrets are very intelligent and highly curious, which can lead to some frustrating moments for unprepared ferret owners! They require training and

lots of interaction with humans for proper socialization. Ferrets are social animals that bond with their owners and their fellow ferret cage mates.

Ferrets are carnivores and need to be on a protien based diet. They have four types of teeth, the number includes maxillary (upper) and mandibular (lower teeth):

• Twelve small teeth (only a couple of millimeters) located between the canines in the front of the mouth. These are known as the incisors and are used for grooming.
• Four canines used for killing prey.
• Twelve premolar teeth that the ferret uses to chew food-located at the sides of the mouth, directly behind the canines. The ferret uses these teeth to cut through flesh, using them in a scissors action to cut the meat into digestible chunks.
• Six molars,two on top and four on the bottom, at the far back of the mouth are used to crush food.

The media has painted an unfriendly portrait of ferrets. They have said that ferrets

are aggressive and untrainable and dangerous, especially around infants and small

children. This information is UNTRUE! Ferrets, like any animal as a pet, need love

and care and can be trained with much success. No animal should be left alone with

an infant and all children must be supervised with any and all pets

(cat, dog, hampster, etc.) not just ferrets.

For more information and facts you can go to

lovethatpet.com

to check out some facts and how to care for ferrets!

Please Don't Forget to Sign The Guestbook!

JS:

var dynamicObject = {}; dynamicObject.Name = "Anything"; dynamicObject.Size = "Whatever"; dynamicObject.ThankYouText ="Thank You!";

function ToggleHighlight() { var captions = document.getElementsByClassName("ferrets-playing-caption"); var images = document.getElementsByClassName("ferrets-playing-images"); var hImages = document.getElementsByClassName("ferrets-playing-images-highlight"); var captionText; if (images[0] != null) { captions[0].innerHTML = "Just set ferrets-playing Highlight ON"; images[0].className = "ferrets-playing-images-highlight"; } else { captions[0].innerHTML = "Just set ferrets-playing Highlight OFF"; hImages[0].className = "ferrets-playing-images"; }

}

function MouseOver(x) { x.className = "list-item-highlight"; }

function MouseOut(x) { x.className = ""; }

function TextInputChanged(input) { var page = document.getElementsByClassName("ferrets_webpage")[0]; var footer = document.getElementsByClassName("footer")[0]; page.removeChild(input); footer.innerHTML = dynamicObject.ThankYouText; }

CSS;

body

{

background: -moz-linear-gradient(-45deg, rgba(249,247,247,0.69) 0%, rgba(181,181,181,0.73) 14%, rgba(177,179,249,0.81) 38%, rgba(39,49,244,0.93) 77%, rgba(31,47,119,1) 100%); /* FF3.6-15 */

background: -webkit-linear-gradient(-45deg, rgba(249,247,247,0.69) 0%,rgba(181,181,181,0.73) 14%,rgba(177,179,249,0.81) 38%,rgba(39,49,244,0.93) 77%,rgba(31,47,119,1) 100%); /* Chrome10-25,Safari5.1-6 */

background: linear-gradient(135deg, rgba(249,247,247,0.69) 0%,rgba(181,181,181,0.73) 14%,rgba(177,179,249,0.81) 38%,rgba(39,49,244,0.93) 77%,rgba(31,47,119,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b0f9f7f7', endColorstr='#1f2f77',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}

.ferrets_webpage li

{

font-style: italic;

width: 200pix;

}

.ferrets_webpage .list-item-highlight

{

font-weight: bold;

color: yellow;

}

.ferrets_webpage .footer

{

font-family: "Calibri";

}

.ferrets_webpage h1

{

font-family: "Arial";

color: black;

}

.ferrets_webpage h1, h2

{

display: inline-block;

}

.ferrets_webpage h1, h2, h3

{

margin: 0px;

}

.ferrets_webpage .standard-paragraph

{

font-family: "calibri";

font-size: 18px;

color: #000000;

width: 800px;

margin-top: 10px;

margin-bottom: 10px;

}

.ferrets_webpage .ferret

{

display: table;

font-size: 19px;

border: 2px solid blue;

margin-left: 20px;

margin-bottom; 20px;

}

.ferrets_webpage .name, .type, .supplies

{

display: inline-block;

font-family: "calibri";

font-size: 18px;

}

.ferrets_webpage .name

{

width: 140px;

border-right: 2px solid blue;

}

.ferrets_webpage .ferrets-playing-images

{

width: 300px;

height: 200px;

border: 3px solid blue;

background-image: url("images/Ferrets-playing.gif");

background-size: 300px 200px;

display: inline-block;

vertical-align: middle;

}

.ferrets_webpage .ferrets-playing-images-highlight

{

width: 300px;

height: 200px;

border: 3px solid white;

background-image: url("images/Ferrets-playing.gif");

background-size: 300px 200px;

display: inline-block;

vertical-align: middle;

}

.ferrets_webpage .ferrets-playing-caption

{

display: inline-block;

vertical-align: middle;

width: 480px;

}

Thank you in advance