/*.heart{
    position: relative;
    width: 100px;
    height: 90px;
}
.heart:before,
.heart:after{
    position: absolute;
    content: "";
    left: 500px;
    top: 0;
    width: 50px;
    height: 80px;
    background: #fc2e5a;
    -moz-border-radius: 50px 50px 0 0;
    border-radius: 50px 50px 0 0;
    -webkit-transform: rotate(-45deg);
       -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
         -o-transform: rotate(-45deg);
            transform: rotate(-45deg);
    -webkit-transform-origin: 0 100%;
       -moz-transform-origin: 0 100%;
        -ms-transform-origin: 0 100%;
         -o-transform-origin: 0 100%;
            transform-origin: 0 100%;
}
.heart:after{
    left: 450;
    -webkit-transform: rotate(45deg);
       -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
         -o-transform: rotate(45deg);
            transform: rotate(45deg);
    -webkit-transform-origin: 100% 100%;
       -moz-transform-origin: 100% 100%;
        -ms-transform-origin: 100% 100%;
         -o-transform-origin: 100% 100%;
            transform-origin :100% 100%;
}

.shape { 
  padding: 20px; 
}
.shape > div { 
  margin: 20px 0; 
}
.shape > h2 { 
  background: rgba(0,0,0,0.15); 
  padding: 10px; 
  width: 640px; 
  text-indent: 60px; 
  margin: 50px 0 0 -70px; 
  position: relative;
}
.shape > h2 > a {
  position: absolute;
  right: 20px;
  bottom: 10px;
  font-size: 20px;
}*/

/******************************************
 * The CSS below has been written for 
 * inhealthandhealling.com all use of it is
 * to be only used for the sole purpose of 
 * that website. 
 * Author: Ryan Henson
 ******************************************/

html, body{
  background-color: #d9dff3;
  height: 100%;
  width: 100%;

}
/*Main Image STUFF*/
.aboveImageHolder{
  width: 100%;
  margin: 0 auto;
}
.imageHolder{
  transform: translate(72%, 2%);
  width: 39vw;
  height: 30.5vh;
  background-image: url(img/InnerHealthandHealing.png);
  background-repeat: no-repeat;
  background-size: contain;
  border-radius: 232px;
}
/*NAV BAR STUFF*/
.nav{
  width: 100%;
  margin-top: 2vh;
  margin-bottom: 2vh;
}
.inner-nav{
  color: #4614d6d1;
  text-shadow: 0.1px 0.1px #37959ad1;
  border-radius: 9px;
  height: 3vh;
}
.nav-list{
  list-style: none;
  text-align: center;
  height: inherit;
  width: 98%;
  padding-left: 17px;
  display: table;
  border-spacing: 0.31vw 0;
}
.nav-item{
  display: table-cell;
  width: 16%;
  font-size: 1.2em;
  height: inherit;
  vertical-align: middle;
  background-color: rgba(150, 236, 81, 0.65);
  box-shadow: 0px 0px 3px #484040;
  border-radius: 40px;
}
.no-style{
  text-decoration-style: none;
  text-decoration: inherit;
  color: inherit;
}
.nav-item:hover{
  cursor: pointer;
  box-shadow: 0px 0px 4px #484040;
  color: #4614d6d1;
  text-shadow: 0.1px 0.1px #696969d1;
}
.nav-dropdown{
  list-style-type: none;
  margin: 0;
  padding: 0;
  position: absolute;
  text-align: left;
  margin-top: 10px;
  background-color: rgba(150, 236, 81, 0.65);
  border-radius: 3px;
  width: inherit;
  box-shadow: 0px 0px 2px #797878;
  display: none;
}
.nav-dropdown-item{
    padding-left: 19px; 
}
.nav-dropdown-item:hover{
  background-color: #a9bdce;
  cursor: pointer;
  font-style: italic;
}

/*Content STUFF*/
.content{
  width: 95vw;
  margin: 0 auto;
  font-family: 'Fjord One', serif;
}
.about{
  background-color: #cee9ff;
  border-radius: 17px;
  box-shadow: 0px 0px 2px rgba(74, 59, 59, 0.57);
}
.centered{
  text-align: center;
}
.welcome{
  color: #8242b1; 
  font-size: 3em;
  font-weight: bold;
}
.secondary{
  color: #c524b8;
  font-size: 2em;
  font-weight: bold;
}
.tag{
  color: #5c1e8a; 
  font-size: 2em;
}
.italic{
  font-style: italic;
}
.message{
  color: #5c1e8a; 
  font-size:  2em;
  font-weight: bold;
}
.butterfly{
  background-image: url(img/emiel-molenaar-186243-unsplash.jpg);
  background-repeat: no-repeat;
  background-size: contain;
}
.quote{
  width: 100%;
  position: static;
}
.quote-image{
  display: inline-block;
  width: 32%;
  height: 30%;
  margin-left: 10%;
}
.quote-text{
  display: inline-block;
  font-style: italic;
  width: 46%;
  font-size: 1.5em;
  color: #c524b8;
  position: static;
  vertical-align: top;
  margin-top: 6%;
}