
h1, h2, h3, h4, h5, h6, p, li {color: #000000; font-family: "Helvetica Neue", Arial, Helvitica, sans-serif; }
a {font-family: "Helvetica Neue", Arial, Helvitica, sans-serif; }
h1 {text-align: center; }

a:link {color: #000000; border: #ffffff}
a:visited {color: #000080; }
a:hover {color: #ff0000; }
a:active {color: #ff0000; }

.footer {height: 30px; width: 100%; text-align: center; font-size: 0.6em; background: url('Images/footerbar.jpg'); line-height: 29px; clear: both; }
.footer a{vertical-align: bottom; }

.flaveartlogo {aligned: left; border: none; }

div#navigation {height: 30px; width 100%; border-top: solid #FFF 1px; border-bottom: solid #FFF 1px;}
div#navigation {background: url('Images/menubar.jpg'); } 
div#navigation ul{margin: 0px; padding: 0px; line-height: 30px; white-space: nowrap; }
div#navigation li{list-style-type: none; float: left; width: 16.5%; text-align: center; }
div#navigation li a{text-decoration: none; padding: 0px 15px 0px 15px; }

.icon {float: left; width: 23%; color: #ffffff; padding-left: 2%; height: 60px;}
.icontext {color: #ffffff; padding-left: 60px; }
.instructiontext {clear: both; color: #ffffff; text-align: center; padding-top: 20px;}

li#currentpage {color: #ff0000; }

#heading {background-color: #ffffff; }
.noborder {border: none; }

div#background {min-height: 453px; background-color: #000031; }
div#backgroundshort {min-height: 100px; background-color: #000031; }

.centred{text-align: center}

div#sitemapmargin {width: 50%; margin-left: 40%;}

.imageleft {float: left; z-index: -1; border: none; }
.imageright {float: right; z-index: -1; }

div#intro {width: 75%; background-color: #ffffff; float: left; }
div#contactbubble {width: 70%; background-color: #ffffff; float: left;}
div#widecontactbubble {width: 98%; background-color: #ffffff; float: left; margin: 1%;}
.widecontactbubble {width: 98%; background-color: #ffffff; float: left; margin: 1%;}
.descriptiontitle {width: 90%; text-align: center;}
.description {width: 90%; min-height: 90px; text-align: center;}
.productdesc {min-height: 100px; padding: 10px; }


div#features {width: 75%; background-color: #ffffff; float: left; text-align: center; }
.spacer {width: 100%; height: 30px; background-color: #000031; }
.spacerwhite {width: 100%; height: 30px; background-color: #ffffff; }
.endspacer {width: 100%; height: 10px; background-color: #000031; clear: both; }
.endspacerwhite {width: 100%; height: 1px; clear: both; }


.productimage {float: left; padding: 10px; }
.descriptiontitle {font-style: italic; font-weight: bold; }
.productdescription {width: 40%; float: left; padding-left: 10px; padding-right: 10px; }
.artistdescription {width: 40%; float: left; padding-left: 10px; padding-right: 10px; }
.featureproductdescription {width: 40%; float: left; padding-left: 10px; padding-right: 10px; }
.featureartistdescription {width: 35%; float: left; padding-left: 10px; padding-right: 10px; }

.addtocart {float: right; padding: 20px;}

div#product {float: left; width: 21%; min-width: 250px; padding: 1%;}
div#producttitle {float: left; width: 51%; padding: 1%;}
div#creator {float: right; width: 150px; padding: 1%;}

.clear {clear: both; }
#contacthead {padding: 20px;}

.condoimage {padding: 20px; margin: 20px; display: block; margin-left: auto; margin-right: auto }
.condopics {padding: 10px; float: left;}
#amenities {clear: both;}
.amenitylist {list-style-type: disc;}

.charitylogo {float: left; z-index: -1; border: none; padding: 20px;}

/* powered by http://mierendo.com/software/rounded_css_boxes/ */
.my_corners_tl, .my_corners_t, .my_corners_tr, .my_corners_l, .my_corners_r, .my_corners_bl, .my_corners_b, .my_corners_br, .my_corners {
    width: auto;
    margin: 0;
    padding: 0;
    border: 0;
    position: relative;
}
.my_corners_t {
    /*
        change this div to layout the whole box (width, height, float, margin, ...)
        example lines:
        width: 60%;
        margin: 7px 35px 0px 1px
        to change distance to content/text scroll to class ".my_corners" and change the padding
    */
    background-color: #ffffff;
    background-image: url("Images/my_corners_border.png");
    background-repeat: repeat-x;
    background-position: top;
}
.my_corners_tl {
    height: 100%;
    background-image: url("Images/my_corners_topleft.png");
    background-repeat: no-repeat;
    background-position: left top;
}
.my_corners_tr {
    height: 100%;
    background-image: url("Images/my_corners_topright.png");
    background-repeat: no-repeat;
    background-position: right top;
}
.my_corners_bl {
    height: 100%;
    background-image: url("Images/my_corners_bottomleft.png");
    background-repeat: no-repeat;
    background-position: left bottom;
}
.my_corners_br {
    height: 100%;
    background-image: url("Images/my_corners_bottomright.png");
    background-repeat: no-repeat;
    background-position: right bottom;
}
.my_corners {
    height: 100%;
    /* change this if you want to change the distance distance to text/content */
    padding: 16px 17px 16px 17px;
}

.my_corners_l {
    height: 100%;
    background-image: url("Images/my_corners_border.png");
    background-repeat: repeat-y;
    background-position: left;
}
.my_corners_r {
    height: 100%;
    background-image: url("Images/my_corners_border.png");
    background-repeat: repeat-y;
    background-position: right;
}
.my_corners_b {
    height: 100%;
    background-image: url("Images/my_corners_border.png");
    background-repeat: repeat-x;
    background-position: bottom;
}

