body {
    margin: 0;
    font-size:12pt;
    font-family: Arial, sans-serif;
    background-image:url('../img/background.jpg');
    background-repeat: no-repeat, repeat;
    background-size: cover;
}

img {
    max-width: 100%;
    height: auto;
    /* fixes anonymous space after images in header-img and home-reel */
    display: block;
}

a {
    color: blue;
}

.header-img {
    width: 100%;
}

.nav i.fa {
    margin-right: 5px;
}

.lang-choice select {
}

/*
This is the visible area of you carousel.
Set a width here to define how much items are visible.
The width can be either fixed in px or flexible in %.
Position must be relative!
*/
.reel {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    margin: 20px 0;
}

/*
This is the container of the carousel items.
You must ensure that the position is relative or absolute and
that the width is big enough to contain all items.
*/
.reel ul {
    width: 20000em;
    position: relative;

    /* Optional, required in this case since it's a <ul> element */
    list-style: none;
    margin: 0;
    padding: 0;
}

/*
These are the item elements. jCarousel works best, if the items
have a fixed width and height (but it's not required).
*/
.reel li {
    /* Required only for block elements like <li>'s */
    float: left;
}


.container {
    box-shadow: 0px 0px 50px -8px #000;
    margin-bottom: 25px;
}

.content {
    padding: 0px 20px;
    background-color: #fafafa;
}

.footer {
    padding: 20px 0;
    text-align:center;
    background-color: #eee;
    font-size:0.8em;
    margin-top: 1rem;
}

.product-note {
    margin-top: 3em;
    font-size: 0.7em;
}

.page-gallery {
    margin-top: 2rem;
}

.page-gallery .pure-g {
    margin-bottom: 10px;
}

.gallery-card {
    margin-right: 0.5rem;
}

.gallery-card img {
	margin: 0 auto;
}

.gallery-caption p {
	font-size:10pt;
	text-align: center;
	margin: 10px 0;
}

.breadcrumbs {
    font-size: 13px;
    margin-top: 1rem;
}

.checkout-form {
    margin: 0 auto;
}