/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

body {
  line-height: 1; }

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, main {
  display: block; }

nav ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent; }

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none; }

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold; }

del {
  text-decoration: line-through; }

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0; }

input, select {
  vertical-align: middle; }

/* -----font-----*/
/*----letter-spacing----*/
/* -----padding-----*/
/* Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS.  */
html {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%; }

/*  apply a natural box layout model to all elements - marging add OutsideTheBox and padding InsideTheBox  */
* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

/* -------------------------BODY--------------------------------*/
body {
  font-family: "Lato", sans-serif;
  font-weight: 400;
  font-size: 16px; }

/* -------------------------HEADER--------------------------------*/
header {
  background-color: black;
  color: #ffffff;
  padding: 1.5rem 2% 2rem 2%;
  text-decoration: none; }
  header ul.about {
    float: left; }
  header ul.about li {
    list-style-type: none;
    float: left; }
  header ul.about li a {
    font-size: 0.7rem;
    font-weight: 700;
    padding: 1rem 1rem 0 .5rem;
    color: #a4a1a1;
    text-decoration: none;
    letter-spacing: 0.06rem; }
  header ul.about li a:hover {
    color: white; }
  header ul.social {
    float: right; }
  header ul.social li {
    list-style-type: none;
    float: left; }
  header ul.social li a {
    font-size: 1.1rem;
    padding: 1rem .5rem 0 .5rem;
    color: #a4a1a1;
    letter-spacing: 0.06rem; }
  header ul.social li a:hover {
    color: white; }
  header ul li.active1 a {
    color: white;
    font-weight: 700;
    text-decoration: none;
    transition: 0.8s all; }

/* -------------------------LOGO BANNER--------------------------------*/
.banner {
  width: 100%;
  padding: 1rem 0 0 0; }

.banner img {
  width: 100%; }

/* -------------------------NAV BAR 2--------------------------------*/
nav {
  width: 100%;
  background-color: #ffffff; }
  nav ul {
    width: 100%; }
  nav ul li {
    float: left;
    width: 100%; }
  nav ul li a {
    display: block;
    text-align: center;
    font-weight: 400;
    font-size: 0.7rem;
    color: #a4a1a1;
    padding: 1rem 0 1rem  0;
    text-decoration: none;
    transition: text 0.8s ease; }
  nav ul li.active a {
    color: black;
    font-weight: 700;
    text-decoration: none;
    transition: 0.8s all; }
  nav ul li a:hover {
    color: black; }

/* -------------------------BODY--------------------------------*/
main {
  padding-bottom: 1rem;
  /*--h1 is for the about, contact and thanks page--*/
  /*--this is for the form -----------CONTACT PAGE--*/
  /*--end of form--*/
  /*--thanks page--*/
  /*--thanks page--*/ }
  main h1 {
    font-size: 1.5rem;
    text-align: center;
    color: #B8D5CD;
    margin: 0.5rem 2%;
    padding: 2rem 0 .5rem 0; }
  main figure.photo {
    width: 96%;
    margin: 1rem 2%;
    float: left; }
  main figure.photo img {
    width: 100%; }
  main figure.photo figcaption {
    text-align: left;
    color: #a4a1a1;
    font-size: 0.7rem; }
  main figure.photo1 {
    width: 96%;
    margin: 1rem 2%;
    float: left; }
  main figure.photo1 img {
    width: 100%; }
  main figure.photo1 figcaption {
    text-align: left;
    color: #a4a1a1;
    font-size: 0.7rem; }
  main figure.photo2 {
    width: 96%;
    margin: 1rem 2%;
    float: left; }
  main figure.photo2 img {
    width: 100%; }
  main figure.photo2 figcaption {
    text-align: left;
    color: #a4a1a1;
    font-size: 0.7rem; }
  main div.blog article {
    margin: 0.5rem 2%;
    width: 96%; }
  main p3 {
    line-height: 130%;
    padding: 4rem 0;
    color: #a4a1a1; }
  main div.etsy {
    width: 100%;
    text-align: center; }
  main div.etsy img {
    width: 25%;
    margin: 2rem 0 .5rem 0; }
  main form {
    padding: 0 2% 1rem 2%;
    max-width: 40rem;
    text: #a4a1a1;
    display: block;
    margin: 0 auto;
    /*--end of label--*/ }
    main form label {
      display: block;
      padding: .75rem 0;
      color: #a4a1a1;
      letter-spacing: 0.06rem; }
      main form label span {
        font-size: 1.1rem;
        color: #a4a1a1; }
      main form label textarea, main form label input {
        display: block;
        font-size: 1rem;
        padding: .75rem;
        background-color: #F6F6F6;
        border: 1px solid #bbb;
        color: #a4a1a1;
        magin-top: .2rem;
        width: 100%;
        margin-top: .3rem; }
      main form label textarea {
        min-height: 13rem; }
      main form label textarea:focus, main form label input:focus {
        background-color: white; }
    main form button.submit {
      display: block;
      margin: 1rem auto 3rem auto;
      border: none;
      background-color: #a4a1a1;
      color: white;
      font-size: 1.3rem;
      font-weight: normalWeight;
      padding: .4rem 1rem;
      border-radius: 1rem;
      Width: 30%;
      letter-spacing: 0.06rem;
      -webkit-appearance: none;
      -moz-appearance: none; }
    main form section span {
      display: none; }
  main div.blog2 article {
    text-align: center;
    padding: .5rem 0 5rem 0; }
  main p4 {
    color: #99c1cb;
    letter-spacing: 0.06rem; }

/*--end of MAIN--*/
/* -------------------------FOOTER--------------------------------*/
#navWrapper {
  background-color: #a4a1a1;
  padding: 7px 0 15px 0; }
  #navWrapper ul.social1 {
    float: left;
    width: 100%;
    border-bottom: 1px #B8D5CD  solid;
    padding: 0 0 20px 0; }
  #navWrapper ul.social1 li {
    list-style-type: none;
    float: left;
    width: 100%;
    text-align: center; }
  #navWrapper ul.social1 li a {
    display: block;
    letter-spacing: 0.06rem;
    font-size: 0.65rem;
    font-weight: 400;
    padding: .5rem 4rem;
    color: black;
    text-decoration: none;
    text-align: center; }
  #navWrapper ul.social1 li a:hover {
    color: white; }
  #navWrapper ul.gd1 {
    float: left;
    width: 100%;
    border-bottom: 1px #B8D5CD solid;
    padding: 0 0 20px 0; }
  #navWrapper ul.gd1 li {
    list-style-type: none;
    float: left;
    width: 100%;
    text-align: center; }
  #navWrapper ul.gd1 li a {
    display: block;
    letter-spacing: 0.06rem;
    font-size: 0.65rem;
    font-weight: 400;
    padding: .5rem 0;
    color: black;
    text-decoration: none;
    text-align: center; }
  #navWrapper ul.gd1 li a:hover {
    color: white; }
  #navWrapper ul.about1 {
    float: left;
    width: 100%; }
  #navWrapper ul.about1 li {
    list-style-type: none;
    float: left;
    width: 100%;
    text-align: center; }
  #navWrapper ul.about1 li a {
    display: block;
    letter-spacing: 0.06rem;
    font-size: 0.65rem;
    font-weight: 400;
    padding: .5rem 4rem;
    color: black;
    text-decoration: none;
    text-align: center; }
  #navWrapper ul.about1 li a:hover {
    color: white; }
  #navWrapper ul li.active a {
    color: black;
    font-weight: 700;
    text-decoration: none;
    transition: 0.8s all; }
  #navWrapper p1 {
    color: #B8D5CD;
    font-size: 0.63rem;
    font-weight: 400;
    display: block;
    padding: 1.5rem 4rem 1rem 4rem;
    text-align: center;
    letter-spacing: 0.06rem; }

/*--end of nav wrapper--*/
footer {
  width: 100%;
  background-color: black;
  padding: 0 0 1rem 0; }
  footer p {
    width: 100%;
    color: white;
    display: inline-block;
    text-align: center;
    font-size: 0.7rem;
    font-weight: 400;
    padding: 1rem 5rem 0 5rem;
    letter-spacing: 0.06rem; }

/*--end of footer--*/
/*----- Clearfix: Force an Element not to collapse -----*/
.clearfix:after {
  content: "";
  display: table;
  clear: both; }

@media only screen and (min-width: 560px) {
  /* -------------------------HEADER--------------------------------*/
  header {
    background-color: black;
    color: #ffffff;
    padding: 1.5rem 2% 3rem 2%;
    text-decoration: none; }
    header ul.about li a {
      font-size: 1rem;
      font-weight: 700;
      padding: 1rem 1rem 0 .5rem; }
    header ul.social li a {
      font-size: 1.5rem;
      padding: 1rem .5rem 0 1rem;
      color: #a4a1a1; }

  nav ul {
    width: 100%; }
  nav ul li {
    float: left;
    width: 33.33%; }
  nav ul li a {
    padding: 1rem 1rem 3.5rem 1rem;
    font-size: 1rem;
    font-weight: 400; }
  nav ul li.active a {
    color: black;
    font-weight: 700;
    text-decoration: none;
    transition: 0.8s all; }

  /* -------------------------BODY--------------------------------*/
  main {
    /*--h1 is for the about.html, contact and thanks page--*/
    /*--About page--*/
    /*--Hand-Painted--*/
    /*--thanks page--*/
    /*--thanks page--*/ }
    main h1 {
      font-size: 2rem;
      text-align: center;
      color: #B8D5CD;
      margin: 0.5rem 2%;
      padding: 2rem 0 2rem 0; }
    main figure.photo {
      width: 96%;
      margin: 0.5rem 2%; }
    main figure.photo figcaption {
      text-align: left;
      color: #a4a1a1;
      font-size: 0.9rem; }
    main figure.photo1 {
      width: 46%;
      margin: 0.5rem 2%;
      float: left;
      padding: 0 0; }
    main figure.photo1 figcaption {
      text-align: left;
      color: #a4a1a1;
      font-size: 0.9rem; }
    main figure.photo2 {
      width: 46%;
      margin: 0.5rem 2%;
      float: right;
      padding: 0 0; }
    main figure.photo2 figcaption {
      text-align: left;
      color: #a4a1a1;
      font-size: 0.9rem; }
    main figure.photo3 {
      width: 66%;
      float: left;
      padding: 1rem 5rem; }
    main figure.photo3 img {
      width: 100%; }
    main div.blog article {
      float: left;
      width: 46%; }
    main div.etsy {
      width: 100%;
      text-align: center; }
    main div.etsy img {
      width: 15%;
      margin: 2rem 0 .5rem 0; }
    main div.blog2 article {
      text-align: center;
      padding: .5rem 0 5rem 0; }
    main p4 {
      color: #99c1cb; }

  /* -------------------------NAV BAR BOTTOM--------------------------------*/
  #navWrapper {
    padding: 2rem 0; }
    #navWrapper ul.social1 {
      float: left;
      width: 33.33%;
      border-bottom: none; }
    #navWrapper ul.social1 li {
      list-style-type: none;
      float: left;
      text-align: center; }
    #navWrapper ul.social1 li a {
      display: block;
      padding: .5rem 0;
      font-size: 0.9rem;
      font-weight: 400; }
    #navWrapper ul.gd1 {
      float: left;
      width: 33.33%;
      border-bottom: none;
      border-left: 1px #B8D5CD solid;
      border-right: 1px #B8D5CD solid; }
    #navWrapper ul.gd1 li {
      list-style-type: none;
      float: left;
      text-align: center; }
    #navWrapper ul.gd1 li a {
      display: block;
      padding: .5rem 0;
      font-size: 0.9rem;
      font-weight: 400; }
    #navWrapper ul.about1 {
      float: left;
      width: 33.33%; }
    #navWrapper ul.about1 li {
      list-style-type: none;
      float: left;
      text-align: center; }
    #navWrapper ul.about1 li a {
      display: block;
      padding: .5rem 4rem;
      font-size: 0.9rem;
      font-weight: 400; }
    #navWrapper ul li.active a {
      color: black;
      font-weight: 700;
      text-decoration: none;
      transition: 0.8s all; }
    #navWrapper p1 {
      font-size: 0.9rem;
      font-weight: 400;
      padding: 1.5rem 4rem 2rem 4rem; }

  /* -------------------------FOOTER--------------------------------*/
  footer {
    width: 100%;
    background-color: black; }
    footer p {
      width: 100%;
      display: inline-block;
      text-align: center;
      font-size: 0.9rem;
      font-weight: 400;
      padding: 2rem 5rem 0 5rem; } }
/* end media query */
@media only screen and (min-width: 1140px) {
  body {
    background-image: url(../images/background4.jpg); }

  div#wrapper {
    max-width: 80rem;
    margin: 0  auto;
    background-color: #ffffff; }

  header ul.about li a {
    font-size: 0.9rem;
    font-weight: 400; }
  header ul.social li a {
    font-size: 1.3rem; }

  nav ul li a {
    font-size: 1rem;
    font-weight: 400; }

  #navWrapper ul.social1 li a {
    font-size: 0.9rem;
    font-weight: 400; }
  #navWrapper ul.gd1 li a {
    font-size: 0.9rem;
    font-weight: 400; }
  #navWrapper ul.about1 li a {
    font-size: 0.9rem;
    font-weight: 400; }
  #navWrapper ul li.active a {
    color: black;
    font-weight: 700;
    text-decoration: none;
    transition: 0.8s all; }
  #navWrapper p1 {
    font-size: 0.9rem;
    font-weight: 400; }

  footer p {
    font-size: 0.9rem;
    font-weight: 400; } }
/* end media query */
