/* Main Box + Background */
body {
    width: 390px;
    margin: 10% auto;
    background-image: url(../media/sunflower_bg.jpg);
    background-position: center;
    background-color: #dbd4b3;
    background-size: cover;
    background-repeat: no-repeat;
    font-family: 'Courier New', Courier, monospace;
    font-size: 15px;
    color: #5B888C;
}

/* Header Text */
h1 {
    color: #296A6D;
    padding: 10px;
    text-align: center;
}

h2,
h3 {
    text-align: center;
}


/* Main Content */
main {
    background-color: #9EC796;
    border: 10px ridge #9EC796;
    border-width: 6px;
}

.pfp {
    float: left;
    margin-right: 10px;
    border: 6px double #5B888C;
}

.introduction {
    background-color: #F6F6B1;
    padding: 10px;
    margin: 10px;
    border: 4px solid #5B888C;
}

.webpages {
    background-color: #F6F6B1;
    padding: 10px;
    margin: 10px;
    border: 4px solid #5B888C;
}

/* Buttons */
.blueberry {
    background-color: #364e83;
    text-decoration: none;
    color: aliceblue;
    padding: 6px 5px 6px 5px;
    border-radius: 2px;
}

.blueberry:hover {
    background-color: #344677;
    color: rgb(203, 214, 223);
}

.blueberry:active {
    background-color: #323663;
    color: rgb(156, 176, 190)
}

.blueberry:visited,
.blog:visited {
    color: #00ffaa;
}

.blog {
    background-color: #589861;
    text-decoration: none;
    color: antiquewhite;
    padding: 6px 5px 6px 5px;
    border-radius: 2px;
}

.blog:hover {
    background-color: #408149;
    color: rgb(221, 207, 189);
}

.blog:active {
    background-color: #3a6f48;
    color: rgb(212, 202, 187);
}

/* Link States */
a {
    color: #5B888C;
}

a:hover {
    color: #296A6D;
}

a:active {
    color: rgb(9, 36, 60);
}

a:visited {
    color: #14ab58;
}

/* lists */
ul {
    list-style: none;
    margin-top: 10px;
}

li {
    margin-bottom: 25px;

}

/* Decoration*/
.sunflower1 {
    float: left;
    margin-left: 10px;
    margin-top: 15px;
}

.sunflower2 {
    float: right;
    margin-right: 10px;
    margin-top: 15px;
}

.bluberrry,
.bloom {
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;
}