/* Cyan Color */ 
.dowcyan {
  color: #24ace3;
  }

a.dowcyan:link {
  color: #24ace3;
	}

a.dowcyan:visited { 
  color: #24ace3;
}

a.dowcyan:hover {  
  color: #24ace3;
}
/* Cyan Color ENDS*/ 


/* Yellow Color */ 
.dowyellow {
  color: #fff100;
  }

a.dowyellow:link {
  color: #fff100;
	}

a.dowyellow:visited { 
  color: #fff100;
}

a.dowyellow:hover {  
  color: #fff100;
}

/* 1920 Screen */
@media only screen and (min-width: 1918px) {

#popnav {
    float:right;
    position:relative;
    left: -2%;
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
    text-transform: uppercase;
    text-align:left;
height: auto;
margin-top: 20px;
}

/* Remove margins and padding from the list, and add a black background color */
ul.topnav {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
background-color: white;
}

/* Float the list items side by side */
ul.topnav li {
float: left;
}

/* Style the links inside the list items */
ul.topnav li a {
    display: inline-block;
    color: #24ace3;
    text-align: center;
  font-weight: 400;
letter-spacing: .2em;
    padding: 14px 16px;
    text-decoration: none;
    transition: 0.3s;
    font-size: 1.1em;
}

#logohead{
    float: left;
    position:relative;
    left: 2%;
height: 84px;
margin-top: 5px;
margin-bottom: 10px;
	z-index:1;
}

/* PoP Syrup Section*/

section#sellsomething{
position: static;
float:left;
width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
margin: 0;
  z-index: 100;
}

section#sellsomething sellbox{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
  color: black;
text-align: left;
    text-transform: uppercase;
letter-spacing: 2px;
  margin: 0;
  position: relative;
  top: 0;
  font-size: 6.5em;
}

section#sellsomething h2{
font-family: 'Work Sans', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
    text-transform: uppercase;
	line-height: .8em;
  font-size: 5.0em;
color: #27a9e1;
  margin: 0;
}

.sellbox{
margin: 0;
padding: 0 0 0 2%;
 box-sizing: border-box; 
}

.sellbox img {
display: block; 
width: 100%; 
  max-height: 100%;
  margin: 2% 0 0 0;
}

.buttonjoin {
background: #24ace3;
    padding: 5px 20px;
    margin: 20%;
    border: 0px solid white;
font-family: 'Work Sans', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
font-size: 1.5em;
    letter-spacing: 2px;
    display: inline-block;
    position: relative;
    transition: all 200ms linear 0;
    -webkit-transition: all 200ms linear 0;
    -moz-transition: all 200ms linear 0;
    -o-transition: all 200ms linear 0;
    -ms-transition: all 200ms linear 0;
    white-space: nowrap;
}

.buttonjoin:link, button:link{
  margin: 0 0 0 10%;
background: #fff;
font-size: 1.0em;
    color: #27a9e1;
    border: 1px solid #27a9e1;
}

.buttonjoin:visited, button:visited{
  margin: 6px;
background: #fff;
font-size: 2.0em;
    color: #27a9e1;
    border: 1px solid #27a9e1;
}

.buttonjoin:hover, button:hover {
    background: #45c4f8;
    color: #fff;
    border-color: #a1a1a1;
}

.sheep{
		float: left;
	height: 500px;
width: 50%;
	margin: 0;
	background: url("../images/bottlefruit.jpg") 50% 50% no-repeat #393;
	background-size: auto;
	border: 0px solid #060;
	border-radius: 5px;
}

div.sheep.height
{
	background-size: cover;
}

#open{
  position: absolute;
width: 50%;
margin-top: 2%;
    height: auto;
}

.motto{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 300;
  color: #EC008B;
text-align: left;
letter-spacing: 2px;
  margin: 0;
  position: absolute;
  top: 5%;
width: 65%;
line-height: 2.0em
  left: 0%;
  font-size: 1.3em;
}

.motto li{
line-height: 2.0em
}

.potsm{
width: 130px;
height: 115px;
}

.potsm img {
display: block; 
	width: auto; 
	height: auto; 
}

/* PoP Syrup Section End*/

}

/* 1024 Screen */
@media only screen and (min-width: 770px) and (max-width: 1024px) {

/* navigation bar */

#logohead{
    float: left;
    position:relative;
    left: 2%;
height: 84px;
margin-top: 5px;
	z-index:1;
}

#popnav {
    float:right;
    position:relative;
    left:-2%;
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
    text-transform: uppercase;
    text-align:left;
height: auto;
margin-top: 20px;
}

/* navigation bar ends*/

section#slide slidecontent {
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 400;
  color: white;
text-align: center;
letter-spacing: 1px;
  margin: 0;
  position: absolute;
  top: 50%;
  left: 20%;
  font-size: 2.0em;
  transform: translate(-15%, -50%);
}

.hevyletter{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
  color: white;
  font-size: 1.2em;
letter-spacing: 3px;
}

/* PoP Syrup Section*/

section#sellsomething{
position: static;
float:left;
width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
margin: 0;
  z-index: 100;
}

section#sellsomething sellbox{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
  color: black;
text-align: left;
    text-transform: uppercase;
letter-spacing: 2px;
  margin: 0;
  position: relative;
  top: 0;
  font-size: 6.5em;
}

section#sellsomething h2{
font-family: 'Work Sans', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
    text-transform: uppercase;
	line-height: .8em;
  font-size: 4.0em;
color: #27a9e1;
  margin: 0;
}

.sellbox{
margin: 0;
padding: 0 0 0 2%;
 box-sizing: border-box; 
}

.sellbox img {
display: block; 
width: 100%; 
  max-height: 100%;
  margin: 2% 0 0 0;
}

.sheep{
		float: left;
	height: 500px;
width: 50%;
	margin: 0;
	background: url("../images/bottlefruit.jpg") 50% 50% no-repeat #393;
	background-size: auto;
	border: 0px solid #060;
	border-radius: 5px;
}

div.sheep.height
{
	background-size: cover;
}

#open{
  position: absolute;
width: 50%;
margin-top: 2%;
    height: auto;
}

.motto{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 300;
  color: #EC008B;
text-align: left;
letter-spacing: 2px;
  margin: 0;
  position: absolute;
  top: 5%;
width: 65%;
line-height: 2.0em
  left: 0%;
  font-size: .8em;
}

.motto li{
line-height: 2.0em
}

.buttonjoin {
background: #24ace3;
    padding: 5px 20px;
    margin: 20%;
    border: 0px solid white;
font-family: 'Work Sans', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
font-size: 1.5em;
    letter-spacing: 2px;
    display: inline-block;
    position: relative;
    transition: all 200ms linear 0;
    -webkit-transition: all 200ms linear 0;
    -moz-transition: all 200ms linear 0;
    -o-transition: all 200ms linear 0;
    -ms-transition: all 200ms linear 0;
    white-space: nowrap;
}

.buttonjoin:link, button:link{
  margin: 0 0 0 10%;
background: #fff;
font-size: 2.0em;
    color: #27a9e1;
    border: 1px solid #27a9e1;
}

.buttonjoin:visited, button:visited{
  margin: 6px;
background: #fff;
font-size: 2.0em;
    color: #27a9e1;
    border: 1px solid #27a9e1;
}

.buttonjoin:hover, button:hover {
    background: #45c4f8;
    color: #fff;
    border-color: #a1a1a1;
}

.potsm{
width: 130px;
height: 115px;
}

.potsm img {
display: block; 
	width: auto; 
	height: auto; 
}

/* PoP Syrup Section End*/

}

/* 1024 Screen ENDS */

/* 800 Screen */
@media only screen and (min-width: 790px)  and ( max-width: 800px) {

#logohead{
    float: left;
    position: relative;
    left: 2%;
height: 84px;
margin-top: 5px;
margin-bottom: 35px;
	z-index: 1;
}

#popnav {
    float:right;
    position:relative;
    left: -2%;
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
    text-transform: uppercase;
    text-align:left;
height: auto;
margin-top: 20px;
}

/* Remove margins and padding from the list, and add a black background color */
ul.topnav {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
background-color: white;
}

/* Float the list items side by side */
ul.topnav li {
float: left;
}

/* Style the links inside the list items */
ul.topnav li a {
    display: inline-block;
    color: #24ace3;
    text-align: center;
  font-weight: 400;
letter-spacing: .2em;
    padding: 14px 16px;
    text-decoration: none;
    transition: 0.3s;
    font-size: .6em;
}

section#slide slidecontent {
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 400;
  color: white;
text-align: center;
letter-spacing: 1px;
  margin: 0;
  position: absolute;
  top: 50%;
  left: 20%;
  font-size: 1.2em;
  transform: translate(-15%, -50%);
}

.hevyletter{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
  color: white;
  font-size: 1.2em;
letter-spacing: 3px;
}

.socialstock{
position: relative;
float:left;
 width: 380px;
margin: 3% 0 2% 2%;
padding: 0 0 0 0;
height: 300px;
background: white;
	font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
}

.boxtest img {
    max-width: 45%;
    max-height: 60%;
}

.boxtest{
position: relative;
margin: 2% 0 0 2%;
padding: 0;
background: white;
}

/* PoP Syrup Section*/

section#sellsomething{
position: static;
float:left;
width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
margin: 0;
  z-index: 100;
}

section#sellsomething sellbox{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
  color: black;
text-align: left;
    text-transform: uppercase;
letter-spacing: 2px;
  margin: 0;
  position: relative;
  top: 0;
  font-size: 6.5em;
}

section#sellsomething h2{
font-family: 'Work Sans', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
    text-transform: uppercase;
	line-height: .8em;
  font-size: 3.0em;
color: #27a9e1;
  margin: 0;
}

.sellbox{
margin: 0;
padding: 0 0 0 2%;
 box-sizing: border-box; 
}

.sellbox img {
display: block; 
width: 100%; 
  max-height: 100%;
  margin: 2% 0 0 0;
}

.buttonjoin {
background: #24ace3;
    padding: 5px 20px;
    margin: 20%;
    border: 0px solid white;
font-family: 'Work Sans', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
font-size: 1.5em;
    letter-spacing: 2px;
    display: inline-block;
    position: relative;
    transition: all 200ms linear 0;
    -webkit-transition: all 200ms linear 0;
    -moz-transition: all 200ms linear 0;
    -o-transition: all 200ms linear 0;
    -ms-transition: all 200ms linear 0;
    white-space: nowrap;
}

.buttonjoin:link, button:link{
  margin: 0 0 0 10%;
background: #fff;
font-size: 1.0em;
    color: #27a9e1;
    border: 1px solid #27a9e1;
}

.buttonjoin:visited, button:visited{
  margin: 6px;
background: #fff;
font-size: 2.0em;
    color: #27a9e1;
    border: 1px solid #27a9e1;
}

.buttonjoin:hover, button:hover {
    background: #45c4f8;
    color: #fff;
    border-color: #a1a1a1;
}

.sheep{
		float: left;
	height: 400px;
width: 50%;
	margin: 0;
	background: url("../images/bottlefruit.jpg") 50% 50% no-repeat #393;
	background-size: auto;
	border: 0px solid #060;
	border-radius: 5px;
}

div.sheep.height
{
	background-size: cover;
}

#open{
  position: absolute;
width: 50%;
margin-top: 2%;
    height: auto;
}

.motto{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 300;
  color: #EC008B;
text-align: left;
letter-spacing: 2px;
  margin: 0;
  position: absolute;
  top: 5%;
width: 65%;
line-height: 2.0em
  left: 0%;
  font-size: .7em;
}

.motto li{
line-height: 2.0em
}

.potsm{
width: 130px;
height: 115px;
}

.potsm img {
display: block; 
	width: auto; 
	height: auto; 
}

/* PoP Syrup Section End*/

}

/* 800 Screen ENDS */

@media only screen and (min-width: 760px)  and (max-width: 768px) {

/* navigation bar */

#logohead{
    float: left;
    position:relative;
    left: 2%;
height: 84px;
margin-top: 15px;
margin-bottom: 10px;
	z-index:1;
}

#popnav {
    float:right;
    position:relative;
    left: -1%;
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
    text-transform: uppercase;
    text-align:left;
height: auto;
margin-top: 35px;
}

/* Remove margins and padding from the list, and add a black background color */
ul.topnav {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
background-color: white;
}

/* Float the list items side by side */
ul.topnav li {
float: left;
}

/* Style the links inside the list items */
ul.topnav li a {
    display: inline-block;
    color: #24ace3;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    transition: 0.3s;
    font-size: 13px;
}
/* navigation bar ends*/

section#slide slidecontent {
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 400;
  color: white;
text-align: center;
letter-spacing: 1px;
  margin: 0;
  position: absolute;
  top: 50%;
  left: 20%;
  font-size: 1.7em;
  transform: translate(-15%, -50%);
}

.hevyletter{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
  color: white;
  font-size: 1.2em;
letter-spacing: 3px;
}

/* PoP Syrup Section*/

section#sellsomething{
position: static;
float:left;
width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
margin: 0;
  z-index: 100;
}

section#sellsomething sellbox{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
  color: black;
text-align: left;
    text-transform: uppercase;
letter-spacing: 2px;
  margin: 0;
  position: relative;
  top: 0;
  font-size: 6.5em;
}

section#sellsomething h2{
font-family: 'Work Sans', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
    text-transform: uppercase;
	line-height: .8em;
  font-size: 3.3em;
color: #27a9e1;
    padding-left: 3%;
  margin: 0;
}

.sellbox{
margin: 0;
padding: 0 0 0 2%;
 box-sizing: border-box; 
}

.sellbox img {
display: block; 
width: 100%; 
  max-height: 100%;
  margin: 0 0 0 4%;
}

.buttonjoin {
background: #24ace3;
    padding: 5px 20px;
    margin: 20%;
    border: 0px solid white;
font-family: 'Work Sans', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
font-size: 1.5em;
    letter-spacing: 2px;
    display: inline-block;
    position: relative;
    transition: all 200ms linear 0;
    -webkit-transition: all 200ms linear 0;
    -moz-transition: all 200ms linear 0;
    -o-transition: all 200ms linear 0;
    -ms-transition: all 200ms linear 0;
    white-space: nowrap;
}

.buttonjoin:link, button:link{
  margin: 0 0 0 20%;
background: #fff;
font-size: 1.5em;
    color: #27a9e1;
    border: 1px solid #27a9e1;
}

.buttonjoin:visited, button:visited{
  margin: 6px;
background: #fff;
font-size: 1.5em;
    color: #27a9e1;
    border: 1px solid #27a9e1;
}

.buttonjoin:hover, button:hover {
    background: #45c4f8;
    color: #fff;
    border-color: #a1a1a1;
}


.sheep{
		float: left;
	height: 400px;
width: 50%;
	margin: 0;
	background: url("../images/bottlefruit.jpg") 50% 50% no-repeat #393;
	background-size: auto;
	border: 0px solid #060;
	border-radius: 5px;
}

div.sheep.height
{
	background-size: cover;
}

#open{
    display: none;
  position: absolute;
width: 80%;
margin-top: 5%;
left: 3%;
    height: auto;
}

.motto{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 300;
  color: #EC008B;
text-align: left;
letter-spacing: 2px;
  margin: 0;
  position: absolute;
  top: 5%;
width: 74%;
line-height: 2.0em
  left: 0%;
  font-size: .7em;
}

.motto li{
line-height: 2.0em
}

.potsm{
width: 130px;
height: 115px;
}

.potsm img {
display: block; 
	width: auto; 
	height: auto; 
}


/* PoP Syrup Section End*/

.socialstock{
position: relative;
float:left;
 width: 100%;
margin: 3% 0 8% 0;
padding: 0 0 0 0;
height: 300px;
background: white;
	font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
}

}

@media only screen and (min-width: 570px) and (max-width: 600px) {

#logohead{
    float: left;
    position:relative;
    left: 1%;
height: 84px;
margin-top: 50px;
	z-index:1;
}

header{
  width: 100%;
  height: auto;
  z-index: 9999;
  position: relative;
}

#popnav {
    float: left;
    position:relative;
    left: -8%;
width: 110%;
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
    text-transform: uppercase;
    text-align:left;
height: auto;
margin-top: 0px;
}

#popnav nav { 
    display: none; 
    position: static;
margin-top: 0%;
height: 200px;
    left: 0%;
    width: 70%;
    top: auto;
    left: 20px;
  }


}

/* iPhone 6plus */
@media only screen and (min-width: 350px) and (max-width: 414px) {

header{
  width: 100%;
  height: auto;
  z-index: 9999;
  position: fixed;
}

#popnav {
    float: left;
    position:relative;
    left: 0%;
width: 100%;
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
    text-transform: uppercase;
    text-align:left;
height: auto;
margin-top: -30px;
}

 ul.topnav li:not(:first-child) {
display: none;
}

ul.topnav li.icon {
    float: right;
    display: inline-block;
  }

ul.topnav li.icon  a {
background-color: #ec008c;
	font-size: .91em;	

}

ul.topnav.responsive {
position: relative;
}

ul.topnav.responsive li.icon {
    position: absolute;
    right: 0;
    top: 0;
  }

  ul.topnav.responsive li {
    float: none;
    display: inline;
  }

  ul.topnav.responsive li a {
    display: block;
    text-align: left;
  }

ul.topnav li a:hover {
background-color: #ec008c;
}

/* Dear Section*/

section#dear{
position: static;
float: left;
 width: 100%;
margin: 0 0 0% 0;
padding: 0 0 0 0;
text-align: center;
height: auto;
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
background-color: #BF1B7D;
}


section#dear .aboutcontent{
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 400;
color: white;
font-size: 1.0em;
padding: 0 10% 5% 10%;
letter-spacing: 1px;
	line-height: 1.2em;
background-color: #BF1B7D;
text-align: center;
}

/* Dear Section Ends*/

/* Joke Section begins*/

section#joke{
position: static;
float: left;
 width: 100%;
margin: 0 0 0% 0;
padding: 0 0 0 0;
text-align: center;
height: auto;
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
background-color: #92278f;
}

section#joke .aboutcontent{
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 400;
color: white;
font-size: 1.0em;
padding: 0 10% 2% 10%;
letter-spacing: 1px;
	line-height: 1.2em;
background-color: #92278f;
text-align: center;
}
/* Joke Section Ends*/

/* Campaign Section begins*/

section#campaign{
position: static;
float: left;
 width: 100%;
margin: 0 0 0% 0;
padding: 0 0 0 0;
text-align: center;
height: auto;
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
background-color: white;
}

section#campaign .aboutcontent{
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 400;
color: grey;
font-size: 1.0em;
padding: 0 10% 2% 10%;
letter-spacing: 1px;
	line-height: 1.2em;
background-color: white;
text-align: center;
}

/* Campaign Section Ends*/

/* Skill Section*/

section#niceskills{
position: static;
float:left;
width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
margin: 0;
padding-bottom: 1%;
background-color: #92278f;
  z-index: 100;
}

.skillbox{
position: relative;
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 300;
top: 0%;
  color: #fff;
text-align: left;
    text-transform: uppercase;
letter-spacing: 2px;
  margin-left: 0%;
  padding-left: 5%;
  margin-right: 2%;
line-height: 2.0em
  left: 0%;
background-color: #92278f;
  font-size: 1.0em;
}


/* Skill Section Ends*/

section#logos {
width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
margin: 0;
background-color: #92278f;
  z-index: 100;
}


/* PoP Syrup Section*/

section#sellsomething{
position: static;
float:left;
width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
margin: 0;
  z-index: 100;
}

section#sellsomething sellbox{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
  color: black;
text-align: left;
    text-transform: uppercase;
letter-spacing: 2px;
  margin: 0;
  position: relative;
  top: 0;
  font-size: 6.5em;
}

section#sellsomething h2{
font-family: 'Work Sans', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
    text-transform: uppercase;
	line-height: .8em;
  font-size: 3.3em;
color: #27a9e1;
    padding-left: 3%;
  margin: 0;
}

.sellbox{
margin: 0;
padding: 0 0 0 2%;
 box-sizing: border-box; 
}

.sellbox img {
display: block; 
width: 100%; 
  max-height: 100%;
  margin: 0 0 0 4%;
}

.sheep{
		float: left;
	height: 400px;
width: 100%;
	margin: 0;
	background: url("../images/bottlefruit.jpg") 50% 50% no-repeat #393;
	background-size: auto;
	border: 0px solid #060;
	border-radius: 5px;
}

div.sheep.height
{
	background-size: cover;
}

#open{
  position: absolute;
width: 80%;
margin-top: 5%;
left: 3%;
    height: auto;
}

.motto{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 300;
  color: #EC008B;
text-align: left;
letter-spacing: 2px;
  margin: 0;
  position: absolute;
  top: 5%;
width: 74%;
line-height: 2.0em
  left: 0%;
  font-size: .7em;
}

.motto li{
line-height: 2.0em
}

.potsm{
width: 130px;
height: 115px;
}

.potsm img {
display: block; 
	width: auto; 
	height: auto; 
}

.buttonjoin {
background: #24ace3;
    padding: 5px 20px;
    margin: 20%;
    border: 0px solid white;
font-family: 'Work Sans', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
font-size: 1.5em;
    letter-spacing: 2px;
    display: inline-block;
    position: relative;
    transition: all 200ms linear 0;
    -webkit-transition: all 200ms linear 0;
    -moz-transition: all 200ms linear 0;
    -o-transition: all 200ms linear 0;
    -ms-transition: all 200ms linear 0;
    white-space: nowrap;
}

.buttonjoin:link, button:link{
  margin: 0 0 0 20%;
background: #fff;
font-size: 1.5em;
    color: #27a9e1;
    border: 1px solid #27a9e1;
}

.buttonjoin:visited, button:visited{
  margin: 6px;
background: #fff;
font-size: 1.5em;
    color: #27a9e1;
    border: 1px solid #27a9e1;
}

.buttonjoin:hover, button:hover {
    background: #45c4f8;
    color: #fff;
    border-color: #a1a1a1;
}

/* PoP Syrup Section End*/

}

/* iPhone 6plus ENDS*/

/* iPhone 6 Plus land */
@media only screen and (min-width: 640px) and ( max-width: 737px) {


#logohead{
    float: left;
    position:relative;
    left: 0%;
height: 84px;
margin-top: 5px;
	z-index:1;
}

#popnav {
    float:right;
    position:relative;
    left:-2%;
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
    text-transform: uppercase;
    text-align:left;
height: auto;
margin-top: 20px;
}


/* Remove margins and padding from the list, and add a black background color */
ul.topnav {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
background-color: white;
}

/* Float the list items side by side */
ul.topnav li {
float: left;
}

/* Style the links inside the list items */
ul.topnav li a {
    display: inline-block;
    color: #24ace3;
    text-align: center;
  font-weight: 400;
letter-spacing: .2em;
    padding: 14px 16px;
    text-decoration: none;
    transition: 0.3s;
    font-size: .7em;
}

section#slide slidecontent {
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 400;
  color: white;
text-align: center;
letter-spacing: 1px;
  margin: 0;
  position: absolute;
  top: 70%;
  left: 20%;
  font-size: .8em;
  transform: translate(-15%, -50%);
}

.hevyletter{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
  color: white;
  font-size: 2.0em;
letter-spacing: 3px;
}

/* PoP Syrup Section*/

section#sellsomething{
position: static;
float:left;
width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
margin: 0;
  z-index: 100;
}

section#sellsomething sellbox{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
  color: black;
text-align: left;
    text-transform: uppercase;
letter-spacing: 2px;
  margin: 0;
  position: relative;
  top: 0;
  font-size: 6.5em;
}

section#sellsomething h2{
font-family: 'Work Sans', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
    text-transform: uppercase;
	line-height: .8em;
  font-size: 3.0em;
color: #27a9e1;
    padding-left: 3%;
  margin: 0;
}

.sellbox{
margin: 0;
padding: 0 0 0 2%;
 box-sizing: border-box; 
}

.sellbox img {
display: block; 
width: 100%; 
  max-height: 100%;
  margin: 0 0 0 4%;
}

.buttonjoin {
background: #24ace3;
    padding: 5px 20px;
    margin: 20%;
    border: 0px solid white;
font-family: 'Work Sans', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
font-size: 1.5em;
    letter-spacing: 2px;
    display: inline-block;
    position: relative;
    transition: all 200ms linear 0;
    -webkit-transition: all 200ms linear 0;
    -moz-transition: all 200ms linear 0;
    -o-transition: all 200ms linear 0;
    -ms-transition: all 200ms linear 0;
    white-space: nowrap;
}

.buttonjoin:link, button:link{
  margin: 0 0 0 12%;
background: #fff;
font-size: 1.5em;
    color: #27a9e1;
    border: 1px solid #27a9e1;
}

.buttonjoin:visited, button:visited{
  margin: 6px;
background: #fff;
font-size: 1.5em;
    color: #27a9e1;
    border: 1px solid #27a9e1;
}

.buttonjoin:hover, button:hover {
    background: #45c4f8;
    color: #fff;
    border-color: #a1a1a1;
}


.sheep{
		float: left;
	height: 400px;
width: 50%;
	margin: 0;
	background: url("../images/bottlefruit.jpg") 50% 50% no-repeat #393;
	background-size: auto;
	border: 0px solid #060;
	border-radius: 5px;
}

div.sheep.height
{
	background-size: cover;
}

#open{
  position: absolute;
width: 50%;
margin-top: 5%;
left: 51%;
    height: auto;
}

.motto{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 300;
  color: #EC008B;
text-align: left;
letter-spacing: 2px;
  margin: 0;
  position: absolute;
  top: 5%;
width: 60%;
line-height: 2.0em
  left: 0%;
  font-size: .6em;
}

.motto li{
line-height: 2.0em
}

.potsm{
width: 130px;
height: 115px;
}

.potsm img {
display: block; 
	width: auto; 
	height: auto; 
}


/* PoP Syrup Section End*/

}

/* iPhone 6 Plus land ENDS*/

/* iPhone SEbelow */
@media only screen and (max-width: 325px) {

header{
  width: 100%;
  height: auto;
  z-index: 9999;
  position: fixed;
}

#popnav {
    float: left;
    position:relative;
    left: 0%;
width: 100%;
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
    text-transform: uppercase;
    text-align:left;
height: auto;
margin-top: 0px;
}

 ul.topnav li:not(:first-child) {
display: none;
}

ul.topnav li.icon {
    float: right;
    display: inline-block;
  }

ul.topnav li.icon  a {
background-color: #ec008c;
	font-size: .91em;	

}

ul.topnav.responsive {
position: relative;
}

ul.topnav.responsive li.icon {
    position: absolute;
    right: 0;
    top: 0;
  }

  ul.topnav.responsive li {
    float: none;
    display: inline;
  }

  ul.topnav.responsive li a {
    display: block;
    text-align: left;
  }

ul.topnav li a:hover {
background-color: #ec008c;
}

/* Dear Section*/

section#dear{
position: static;
float: left;
 width: 100%;
margin: 0 0 0% 0;
padding: 0 0 0 0;
text-align: center;
height: auto;
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
background-color: #BF1B7D;
}


section#story .aboutcontent{
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 400;
color: grey;
font-size: 1.0em;
padding: 0 5% 0 5%;
letter-spacing: 1px;
	line-height: 1.2em;
text-align: center;
}


section#dear .aboutcontent{
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 400;
color: white;
font-size: 1.0em;
padding: 0 10% 5% 10%;
letter-spacing: 1px;
	line-height: 1.2em;
background-color: #BF1B7D;
text-align: center;
}

/* Dear Section Ends*/

/* Joke Section begins*/

section#joke{
position: static;
float: left;
 width: 100%;
margin: 0 0 0% 0;
padding: 0 0 0 0;
text-align: center;
height: auto;
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
background-color: #92278f;
}

section#joke .aboutcontent{
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 400;
color: white;
font-size: 1.0em;
padding: 0 10% 2% 10%;
letter-spacing: 1px;
	line-height: 1.2em;
background-color: #92278f;
text-align: center;
}
/* Joke Section Ends*/

/* PoP Syrup Section*/

section#sellsomething{
position: static;
float:left;
width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
margin: 0;
  z-index: 100;
}

section#sellsomething sellbox{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
  color: black;
text-align: left;
    text-transform: uppercase;
letter-spacing: 2px;
  margin: 0;
  position: relative;
  top: 0;
  font-size: 6.5em;
}

section#sellsomething h2{
font-family: 'Work Sans', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
    text-transform: uppercase;
	line-height: .8em;
  font-size: 2.8em;
color: #27a9e1;
    padding-left: 3%;
  margin: 0;
}

.sellbox{
margin: 0;
padding: 0 0 0 2%;
 box-sizing: border-box; 
}

.sellbox img {
display: block; 
width: 100%; 
  max-height: 100%;
  margin: 0 0 0 4%;
}

.potsm{
width: 130px;
height: 115px;
}

.potsm img {
display: block; 
	width: auto; 
	height: auto; 
}

.buttonjoin {
background: #24ace3;
    padding: 5px 20px;
    margin: 20%;
    border: 0px solid white;
font-family: 'Work Sans', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
font-size: 1.5em;
    letter-spacing: 2px;
    display: inline-block;
    position: relative;
    transition: all 200ms linear 0;
    -webkit-transition: all 200ms linear 0;
    -moz-transition: all 200ms linear 0;
    -o-transition: all 200ms linear 0;
    -ms-transition: all 200ms linear 0;
    white-space: nowrap;
}

.buttonjoin:link, button:link{
  margin: 0 0 0 10%;
background: #fff;
font-size: 1.5em;
    color: #27a9e1;
    border: 1px solid #27a9e1;
}

.buttonjoin:visited, button:visited{
  margin: 6px;
background: #fff;
font-size: 1.5em;
    color: #27a9e1;
    border: 1px solid #27a9e1;
}

.buttonjoin:hover, button:hover {
    background: #45c4f8;
    color: #fff;
    border-color: #a1a1a1;
}


.sheep{
		float: left;
	height: 400px;
width: 100%;
	margin: 0;
	background: url("../images/bottlefruit.jpg") 50% 50% no-repeat #393;
	background-size: auto;
	border: 0px solid #060;
	border-radius: 5px;
}

div.sheep.height
{
	background-size: cover;
}

#open{
  position: absolute;
width: 80%;
margin-top: 5%;
left: 3%;
    height: auto;
}

.motto{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 300;
  color: #EC008B;
text-align: left;
letter-spacing: 2px;
  margin: 0;
  position: absolute;
  top: 5%;
width: 85%;
line-height: 2.0em
  left: 0%;
  font-size: .6em;
}

.motto li{
line-height: 2.0em
}

/* PoP Syrup Section End*/

}

/* iPhone 5below Ends*/

/* iPhone 5 land */
@media only screen and (min-width: 560px) and ( max-width: 568px) {

#logohead{
    float: left;
    position:relative;
    left: 0%;
height: 84px;
margin-top: 5px;
margin-bottom: 2px;
	z-index:1;
}

header{
  width: 100%;
  height: auto;
  z-index: 9999;
  position: fixed;
}

#popnav {
    float: left;
    position:relative;
    left: 0%;
width: 100%;
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
    text-transform: uppercase;
    text-align:left;
height: auto;
margin-top: 0px;
}

 ul.topnav li:not(:first-child) {
display: none;
}

ul.topnav li.icon {
    float: right;
    display: inline-block;
  }

ul.topnav li.icon  a {
background-color: #ec008c;
	font-size: .91em;	

}

ul.topnav.responsive {
position: relative;
}

ul.topnav.responsive li.icon {
    position: absolute;
    right: 0;
    top: 0;
  }

  ul.topnav.responsive li {
    float: none;
    display: inline;
  }

  ul.topnav.responsive li a {
    display: block;
    text-align: left;
  }

ul.topnav li a:hover {
background-color: #ec008c;
}

/* PoP Syrup Section*/

section#sellsomething{
position: static;
float:left;
width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
margin: 0;
  z-index: 100;
}

section#sellsomething sellbox{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
  color: black;
text-align: left;
    text-transform: uppercase;
letter-spacing: 2px;
  margin: 0;
  position: relative;
  top: 0;
  font-size: 6.5em;
}

section#sellsomething h2{
font-family: 'Work Sans', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
    text-transform: uppercase;
	line-height: .8em;
  font-size: 5.0em;
color: #27a9e1;
    padding-left: 3%;
  margin: 0;
}

.sellbox{
margin: 0;
padding: 0 0 0 2%;
 box-sizing: border-box; 
}

.sellbox img {
display: block; 
width: 100%; 
  max-height: 100%;
  margin: 0 0 0 4%;
}

.buttonjoin {
background: #24ace3;
    padding: 5px 20px;
    margin: 20%;
    border: 0px solid white;
font-family: 'Work Sans', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
font-size: 1.5em;
    letter-spacing: 2px;
    display: inline-block;
    position: relative;
    transition: all 200ms linear 0;
    -webkit-transition: all 200ms linear 0;
    -moz-transition: all 200ms linear 0;
    -o-transition: all 200ms linear 0;
    -ms-transition: all 200ms linear 0;
    white-space: nowrap;
}

.buttonjoin:link, button:link{
  margin: 0 0 0 5%;
background: #fff;
font-size: 2.0em;
    color: #27a9e1;
    border: 1px solid #27a9e1;
}

.buttonjoin:visited, button:visited{
  margin: 6px;
background: #fff;
font-size: 2.0em;
    color: #27a9e1;
    border: 1px solid #27a9e1;
}

.buttonjoin:hover, button:hover {
    background: #45c4f8;
    color: #fff;
    border-color: #a1a1a1;
}


.sheep{
		float: left;
	height: 400px;
width: 100%;
	margin: 0;
	background: url("../images/bottlefruit.jpg") 50% 50% no-repeat #393;
	background-size: auto;
	border: 0px solid #060;
	border-radius: 5px;
}

div.sheep.height
{
	background-size: cover;
}

#open{
  position: absolute;
width: 55%;
margin-top: 5%;
left: 2%;
    height: auto;
}

.motto{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 300;
  color: #EC008B;
text-align: left;
letter-spacing: 2px;
  margin: 0;
  position: absolute;
  top: 5%;
width: 100%;
line-height: 2.0em
  left: 0%;
  font-size: .8em;
}

.motto li{
line-height: 2.0em
}

.potsm{
width: 130px;
height: 115px;
}

.potsm img {
display: block; 
	width: auto; 
	height: auto; 
}


/* PoP Syrup Section End*/

}

/* iPhone 5 land ENDS*/

/* iPhone 4 land */
@media only screen and (min-width: 479px) and ( max-width: 480px) {


#logohead{
    float: left;
    position:relative;
    left: 0%;
height: 84px;
margin-top: 5px;
	z-index:1;
margin-bottom: 8px;
}

header{
  width: 100%;
  height: auto;
  z-index: 9999;
  position: fixed;
}

#popnav {
    float: left;
    position:relative;
    left: 0%;
width: 100%;
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
    text-transform: uppercase;
    text-align:left;
height: auto;
margin-top: 0px;
}

 ul.topnav li:not(:first-child) {
display: none;
}

ul.topnav li.icon {
    float: right;
    display: inline-block;
  }

ul.topnav li.icon  a {
background-color: #ec008c;
	font-size: .91em;	

}

ul.topnav.responsive {
position: relative;
}

ul.topnav.responsive li.icon {
    position: absolute;
    right: 0;
    top: 0;
  }

  ul.topnav.responsive li {
    float: none;
    display: inline;
  }

  ul.topnav.responsive li a {
    display: block;
    text-align: left;
  }

ul.topnav li a:hover {
background-color: #ec008c;
}

section#slide slidecontent {
font-family: 'Playfair Display', 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 400;
  color: white;
text-align: center;
letter-spacing: 1px;
  margin: 0;
  position: absolute;
  top: 70%;
  left: 20%;
  font-size: .7em;
  transform: translate(-15%, -50%);
}

.hevyletter{
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
  font-weight: 900;
  color: white;
  font-size: 1.2em;
letter-spacing: 3px;
}

}

/* iPhone 4 land Ends */

/* Mobile Sections Only */
@media only screen and ( max-width: 768px) {

/* Social Media Section*/

section#socialhere {
width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
margin: 0;
  z-index: 100;
}

.socialbox {
 margin: 0; 
 box-sizing: border-box; 
}


.socialbox img {
display: block; 
width: 100%; 
  max-height: 70%;
    zoom: 2;  //increase if you have very small images
}

.socialbox img {
  -webkit-transition: all 1s ease;
     -moz-transition: all 1s ease;
       -o-transition: all 1s ease;
      -ms-transition: all 1s ease;
          transition: all 1s ease;
}
 
.socialbox img:hover {
  -webkit-filter: blur(0px);
}

section#social{
display: none;
position: static;
float: left;
 width: 100%;
margin: 0 0 2% 0;
padding: 0 0 0 0;
text-align: center;
height: auto;
font-family: 'Source Sans Pro', Arial, Helvetica, Times, Times New Roman, san-serif;
background: white;
}

}
/* Mobile Sections Only Ends */