vv @charset "utf-8";
/* CSS Document */

@font-face {
    font-family: Dosis;
    src: url("../fonts/DosisMedium.ttf");
    font-weight: normal;
}

@font-face {
    font-family: Dosis;
    src: url("../fonts/DosisBook.ttf");
    font-weight: lighter;
}

@font-face {
    font-family: Dosis;
    src: url("../fonts/DosisBold.ttf");
    font-weight: bold;
}

@font-face {
    font-family: MarketSaturday;
    src: url("../fonts/MarketSaturday.ttf");
    font-weight: normal;
}

body {
	background-color: #ffffff;
	font-family: Dosis, Calibri, Arial, Helvetica, sans-serif;
	font-weight: lighter;
	color: #000000;
	font-size: 20px;
	text-align: left;
}

h1 {
	font-family: MarketSaturday, Calibri;
	font-size: 150px;
	display: inline;
	line-height: 20px;
	letter-spacing: -6px;
}

h2 {
	font-family: Dosis, Calibri, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 20px;
	display: inline;
	padding-left: 10px;
	line-height: 45px;
}

a {
	text-decoration: none;
	color: #000;
}

a:hover {
	color: #8cc936;
	font-family: Dosis;
	font-weight: bold;
}

a.link {
		color: #8cc936;
		font-family: Dosis;
		font-weight: bold;
}

#container {
	position:relative;
}

img.bunting {
	max-width: 100%;
	height: auto;
	right: 0px;
	z-index: -1;
	position:absolute;
}

#nav-trigger {
   text-align: right;
   padding-bottom: 20px;
  }

#nav-trigger span {
    display: inline-block;
    padding: 10px 10px 0px;
}

#nav-trigger span:hover {
      background-color: #fff; 
	  }

#nav-trigger span.open:after {

	  }
	  
#nav-pc {
	display: none;
}
	  
nav#nav-mobile {
  position: relative;
  display: block; 
  }
  
nav#nav-mobile ul {
    display: none;
    list-style-type: none;
    position: absolute;
    left: 0;
    right: 0;
    background-color: white;
	border: 1px solid black; 
	}
	
	nav#nav-mobile ul.expanded {
	display: block;
	padding: 0px 20px;
}
	
nav#nav-mobile li {
    display: block;
    padding: none;
    margin: 20px 5px;
    border-bottom: none;
	text-align: center; 
	}
	
nav#nav-mobile li:last-child {
     padding-bottom: 5px; 
	 }
	  
nav#nav-mobile a {
    display: block;
    color: black;
    padding: 0px 5px; 
	}
	
nav#nav-mobile a:hover {
    color: #8cc936; 
	}
	
#sing {
	padding: 60px 0px 10px 0px;
}

#homepagecontent {
	padding: 10px 0px 20px 10px;
}

#pagecontent {
	padding: 10px 0px 20px 10px;
}

#contact {
	display: inline-block;
	position:relative;
	left: 0px;
	bottom: 0px;
	z-index: -2;
}
 
#jacapella {
	display: inline-block;
	position:absolute;
	right: 3px;
	bottom: -10px;
	text-align: right;
	z-index: -2;	
}

.bold {
	font-family: Dosis, Calibri, Arial, Helvetica, sans-serif;
	font-weight: bold;
}

.highlight {
	font-family: Dosis, Calibri, Arial, Helvetica, sans-serif;
	display: inline;
	color: #EF4042;
	font-weight: bold;
}

.highlight2 {
	font-family: Dosis, Calibri, Arial, Helvetica, sans-serif;
	display: inline;
	color: #00CCCC;
	font-weight: bold;
}


@media only screen and (min-width: 680px) {
    /* For tablets: */
	
body {
	background-color: #ffffff;
	font-family: Dosis, Calibri, Arial, Helvetica, sans-serif;
	font-weight: lighter;
	color: #000000;
	font-size: 18px;
	text-align: left;
	background-image:none;
}	

h1 {
	font-family: MarketSaturday, Calibri;
	font-size: 170px;
	display: inline;
	line-height: 65%;
	letter-spacing: 0px
}

h2 {
	font-family: Dosis, Calibri, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 22px;
	display: inline;
	padding-left: 10px;
}

#container {
	width: 600px;
	margin: auto;
	position:relative;
}

img.bunting {
	max-width: 100%;
	height: auto;
	right: 0px;
	z-index: -1;
	position:absolute;
}

#nav-trigger {
	display: none;
}

nav#nav-mobile {
    display: none;
  }
  
#nav-trigger span {
    display: none;
}

nav#nav-mobile ul {
	 display: none;
}

nav#nav-mobile ul.expanded {
	 display: none;
}
  
#nav-pc {
	position: absolute;
	display: block;
	right: 0px;
	top: 130px;
}

nav-pc ul {
    display: none;
    list-style-type: none;
    position: absolute;
    left: 0;
    right: 0;
    text-align: right;
    background-color: white; 
	}
	
#nav-pc li {
    display: block;
    padding: none;
    margin: 0 5px;
    border-bottom: none;
	text-align: right; 
	}
	
#sing {
	padding: 70px 0px 30px 0px;
}

#homepagecontent {
	width: 50%;
	padding: 10px 0px 30px 10px;
}

#pagecontent {
	padding: 10px 0px 30px 10px;
}

#contact {
	display:inline-block;
	position:relative;
	width: 50%;
	padding: 0px 0px 0px 10px;
}

#jacapella {
	display: inline-block;
	position:absolute;
	right: 3px;
	bottom: -10px;
	text-align: right;
	z-index: -2;	
}

.bold {
	font-family: Dosis, Calibri, Arial, Helvetica, sans-serif;	
	font-weight: bold;
}

.highlight {
	display: inline;
	color: #EF4042;
	font-weight: bold;
}

.highlight2 {
	display: inline;
	color: #00CCCC;
	font-weight: bold;
}