@charset "UTF-8";
/*page sections*/
header {
    background-color: #9FC131;
}

#banner {
    background-color: #DBF227;
}

#pots {
    background-color: #D6D58E;
}

#instagram {
background-color: #299AF3;
}

#workshop {
    background-color: #C99DA5;
}

footer {
background-color: #9FC131;
}
body{
font-family: "libre-bodoni", sans-serif;
font-weight: 700;
font-style: normal;
    
}
h1, h2, h3, h4, strong, figcaption {
    font-family: "libre-bodoni", sans-serif;
font-weight: 700;
font-style: normal;
}
/*header*/

header .container {padding: 40px 0;
    position: relative
}

@media (max-width: 767px) {
header #logo {
	display: block;
	margin: 0 auto;
}
header ul#social {
	text-align: center;
}
header #address {
	text-align: center;
	line-height: 2;
}
}  
@media (min-width: 768px) {
ul#social {
	position: absolute;
	top: 40px;
	right: 0px;
}
#address {
	font-size: 16px;
	position: absolute;
	bottom: 40px;
	right: 0px;
}
}
/*banner*/
#banner h1 {color: midnightblue;
    
}
figure {
	position: relative;
}
figcaption {
	position: absolute;
	bottom: 20px;
	left: 0;
}
figcaption span {
	color: white;
	font-size: 24px;
	line-height: 45px;
	background: rgb(0, 0, 0);
	background: rgba(0, 0, 0, 0.7);
	padding: 10px;
}
figcaption span.spacer {
	padding: 0 2px;
	background: none;
}
#banner .container {padding-bottom: 40px;}
/*posts*/
#pots h2 {color:mediumblue;
}
#pots {
	position: relative;
	padding-bottom: 80px;
    z-index: -1;
}
#tagline {
	position: absolute;
	bottom: -10px;
	right: 0px;
	font-size: 50px;
	line-height: 1;
	text-align: right;
	color:mediumblue;
}
/*instagram*/
#instagram h2{color:midnightblue;
    
}
#instagram img {
    border: 10px double #FFF;
    margin-bottom: 30px;
    color: #0B09E5;
}

@media (min-width: 768px) and (max-width: 991px) {
#instagram1 {
	position:relative;
}
#instagram2 {
	position: relative;
}
#instagram3 {
	position: relative;
	left: 40px;
}
#instagram4 {
	position: relative;
	top: 80px;
}
#instagram5 {
	position: relative;
}
#instagram6 {
	position: relative;
}
#instagram7 {
	position: relative;
}
}
@media (min-width: 992px) {
#instagram1 {
	position: relative;
}
#instagram2 {
	position: relative;
}
#instagram3 {
	position: relative;
}
#instagram4 {
	position: relative;
}
#instagram5 {
	position: relative;
}
#instagram6 {
	position: relative;
}
#instagram7 {
	position: relative;
}
}
/*workshop*/

#workshop h2{color:mediumblue;
    
}
#workshop .container{
 padding-top: 40px;
 padding-bottom: 40px;
}
#asterisk {
	position: absolute;
	top: -95px;
	left: 0px;
	font-size: 200px;
	line-height: 1;
	color: #96C994;
}
footer .container {
	padding-top: 80px;
	padding-bottom: 40px;
	position: relative;

}
