@import url(https://fonts.googleapis.com/css?family=Open+Sans:400);
@import url(https://fonts.googleapis.com/css?family=Playfair+Display:400);

/**CSS RESET START - version 1.6.0 (last updated 29.4.2022**/
*:where(:not(html, iframe, canvas, img, svg, video):not(svg *, symbol *)) {
    all: unset;
    display: revert;
}

/* Preferred box-sizing value */
*,
*::before,
*::after {
    box-sizing: border-box;
}

/* Reapply the pointer cursor for anchor tags */
a, button {
    cursor: revert;
}

/* Remove list styles (bullets/numbers) */
ol, ul, menu {
    list-style: none;
}

/* For images to not be able to exceed their container */
img {
    max-width: 100%;
}
/**CSS RESET END **/

html {
    background-color: #FFF;
	color: #3f3f3f;
	font: 1em/1 "Open Sans",sans-serif;
	-webkit-text-size-adjust: 100%;
	/* background: white url("https://c2.staticflickr.com/2/1913/31373966508_e632f74460_o.jpg") no-repeat bottom center fixed; */
	background: url("https://live.staticflickr.com/65535/52052788653_6ba03f71a3_h.jpg") no-repeat bottom center fixed; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover 
}

#wrapper {
	max-width: 800px;
	min-width: 400px;
	overflow: hidden;
	margin: 0 auto
}

section {
	display: flex;  
	flex-flow: row wrap
}

aside {
	flex: 1 100%
}

#description {
	background: #FFF;
	padding: 0 30px 30px;	
	letter-spacing: .01rem;
	text-align: justify;
	margin: 0 1em 0 1em
}

#description p, li {
	 line-height: 160%
}

#description p {
	 margin-top: 1em;
}

#description ul {
	margin-top: 0;
	margin-left: 30px;
	text-align: left;
}

.list-space {
	padding-top: 16px;
}

#description label {
  font: 1.8rem "Playfair Display",serif;
  text-align: left;
  line-height: 0.9;
}

/* star bullet */
#description li:before {
  content: "\2605";
  color: #cccccc;
  margin-right: 0.5em;
  margin-left: -1.3em;
}

#description hr {
  height: 1px;
  border: 0;
  background: #cccccc;
  margin: 16px 0 16px 0
}

#description h1, h2 {
	margin-bottom: 0.1em;
}

#description h1 {
	font: 2.4rem "Playfair Display",serif;
	margin-top: 0;
}

#description h2 {
	font: 1.9rem/1 "Playfair Display",serif;
	margin-top: -0.3em;
}

#description h3 {
	font: 1.5rem "Playfair Display",serif;
	margin-top: -0.1em;
	margin-bottom: 0.6em;
}

#price:before {
    content: "|";
    color: #cccccc;
	margin: 0 10px 0 10px;
	font-style: normal
}

#price {
	color: #ff9999;	
}

.sold-out {
	font: italic 1.5rem "Playfair Display",serif;
	color: #878787;
	text-align: center;
}

.bolt:before{
    content: "🗲";
   color: #ff9999;
	margin-right: 3px
}

.bolt:after{
    content: "🗲";
   color: #ff9999;
	margin-left: 3px
}

.pink-color {
	color: #ff9999;	
}

.blue-color {
	color: #878787;
}

.pink-heart:after {
    content: "❤";
    color: #ff9999;
	margin-left: 5px
}

.music-note:after {
    content: "♪";
	margin-left: 5px;
}

#description .italic {
	font-style: italic;
}

/* blockquote start */
#description blockquote {
	width: 100%;
	max-width:480px;
	margin: 10px auto;
	box-sizing: border-box;
	padding: 0 20px 8px 40px;
	position: relative;
	font-family: "Playfair Display",serif;
	color: #878787;
}
		
#description blockquote p {
	margin-bottom: 0.3em
}

#description cite {
	text-align: left;
	color: #3f3f3f;	
}
		
.greybar:before {
    content: "|";
    color: #cccccc;
	margin: 0 5px 0 5px;
	font-style: normal;
}

/* quote graphic */
#description blockquote:before {
	content: "\201C";
	position: absolute;
	font: bold 50px "Georgia";
	color: #ff9999;
	left: 10px;
	top: -3px;
}
/* blockquote end */