.box{
  margin-bottom: 0;
}
.#gk-content {
    padding-bottom: 0;
}
#Home p, #Bloom p{
    color: #000000;
    font-family: Calibri, sans-serif;
    font-size: 15px;
}
#Home h2, #Bloom h2{
  color: #7ebf34;
  font-weight: 700;
  font-size: 30px;
  text-transform: uppercase;
}
#Home h3, #Bloom h3{
    font-weight: bold;
    font-size: 25px;
}
#Home h6, #Bloom h6{
    font-size: 15px;
    color: #000;
}
#Home h3, #Home h6, #Home span, #Home p, #Home h2, #Bloom h3, #Bloom h6, #Bloom span, #Bloom p, #Bloom h2{
  font-family: 'Raleway', sans-serif;
}

#Home .blurb, #Bloom .blurb{
  padding: 100px 125px;
  text-align: center;
}
#Home a.button-content, #Home a.button-content:hover, #Home a.button-content:focus{
  color:#fff;
}
#Home #gk-main {
    margin: 0;
}
#Home #gk-header{
  margin-bottom:0;
  z-index: 25;
}
#Home .button{
    width: 100%;
    padding: 15px 1px;
    font-size: 18px;
    line-height: 20px;
    text-align: center;
    cursor: pointer;
    background-color: #7cc124;
    max-width: 250px;
    color: #fff;
    margin-top:40px;
}
/*---- Video -----*/
.videoWrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
}
.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*------ tickets ------*/
#heading{
  text-align: center;
  padding: 100px;
}
.ticketInfo .btn-group{
    width: 100%;
    padding: 25px 0 50px 0;
}
.btn-group .ticket{ 
    display: inline-block;
    padding: 0 100px;
}
.ticket .button{
  margin-top: 15px !important;
}
.ticket h3 {
    text-transform: uppercase;
    letter-spacing: 1.5px;
}
.ticket .button-text {
    text-transform: capitalize;
}
/*----- festival info -----*/
#bloom.row, #artists.row, #garden.row{
 display: flex;
 min-height:450px;
 background-color: #fbfbfb;
 position: relative;
}
.row-left-col {
  display: inline-block;
  width: 50%;
}
.row-left-col .blurb{
  text-align: left !important;
}
.row-right-col .blurb {
    text-align: right !important;
}
.row-right-col {
  display: inline-block;
  width: 50%;
  background-size: cover !important;
  overflow: hidden;
  background-position: center !important;
}
.row .Image{
  overflow: hidden;
  height: 100%;
  z-index: 2;
  display: flex;
  justify-content: center;
}
.full.row {
    text-align: center;
}
.bloom .full {
    margin: auto;
}
.bloom .full.row, .bloom #slider {
    width: 100vw;
    left: 50%;
    position: relative;
    transform: translateX(-50%);
}
#gk-mainbody-top.video, .bloom #eapps-instagram-feed-1 {
    width: 100vw;
    left: 50%;
    position: relative;
    transform: translateX(-50%);
}
.home .gk-item-page .gk-article {
    margin: 0 auto;
}
.img-container {
    margin: auto;
    display: inline-block;
}
.img-container * {
    display: inline-block;
}
.img-container img{
	max-width: 300px;
  background-size: contain;
}
.row .Image .button{
  align-self: center;
  background-color: #fff0 !important;
  border: 2px solid #fff !important;
}
.row .Image .title{
  align-self: center;
  color: #f7fbf7;
  font-family: 'Poiret One', cursive !important;
  font-size: 100px;
  font-weight: bold;
  text-shadow: 1px 1px 10px #797878ad;
  text-transform: capitalize;
  letter-spacing: 1px;
}
#garden .row-right-col {
  background: #000 url(https://gardenandartfestival.co.nz/images/updated_18/garden.jpg) 0 0 no-repeat;
}
#bloom .row-right-col {
  background: #000 url(https://gardenandartfestival.co.nz/images/updated_18/DelPacifico.JPG) 0 0 no-repeat;
}
#bloom .Image{
  background-color: rgba(225, 141, 253, .25);
}
#bloom .row-left-col span{
  font-size: 16px;
}
#artists .row-left-col {
  background: #000 url(https://gardenandartfestival.co.nz/images/updated_18/artists.jpg) 0 0 no-repeat;
}
#artists .row-left-col {
  display: inline-block;
  width: 50%;
  background-size: cover !important;
  overflow: hidden;
  background-position: center !important;
}
#artists .button{
  margin-left: auto;
  margin-right: 0;
}
.bloom h1.gardens {
    background-color: #f4f4f4;
    color: #333;
    text-shadow: none;
    font-weight: bold;
}
#itemListPrimary > h2 {
    background-color: #333;
    color: #fff;
    margin: 50px auto;
    padding: 20px 0;
    width: 100vw;
    left: 50%;
    position: relative;
    transform: translateX(-50%);
}
/*----Bloom landing page------
.page-header{
  margin-bottom: 0px;
}------*/

.slide img
{
  position: absolute;
    left: -100%;
    right: -100%;
    top: -100%;
    bottom: -100%;
    margin: auto;
    min-height: 100%;
    min-width: 100%;
}
.slide.two img
{
    top: -75% !important;
}

#slider:after
{
    right: 30px;
    left: auto;
    -webkit-transform: skew(8deg) rotate(3deg);
    -ms-transform: skew(8deg) rotate(3deg);
    -transform: skew(8deg) rotate(3deg)
}

#slider input{display: none}

#slider .slider-container
{
    position:relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 400px;
    overflow: hidden  
}

#slider #slides
{
    position: absolute;
    width: 300%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden;
    -webkit-animation: slider 26s infinite;
    animation: slider 26s infinite
}

#slider #slides:hover
{
    -webkit-animation-play-state: paused;
    animation-play-state: paused
}

#slider #slides .slide
{
    position: relative;
    width: 33.33333333%;
    height: 100%;
    float: left;
    overflow: hidden
}
#slider .timeline
{
    position: absolute;
    left: 0;
    bottom: 0;
    height: 3px;
    width: 0;
    background-color: #f5f5f5;
    -webkit-animation: timeline 26s infinite;
    animation: timeline 26s infinite
}

#slider #slides:hover ~ .timeline
{
    -webkit-animation-play-state: paused;
    animation-play-state: paused
}

/*--- Start Slider animation ---*/
@-webkit-keyframes slider
{
    0%, 25%, 100%{left: 0}
    
    30%, 55%{left: -100%}
    
    60%, 85%{left: -200%}
}

@keyframes slider
{
    0%, 25%, 100%{left: 0}
    
    30%, 55%{left: -100%}
    
    60%, 85%{left: -200%}
}

@-webkit-keyframes timeline
{
    0%, 30%, 60%, 100%{width: 0}
    
    25%, 55%, 85%{width: 100%}
}

@keyframes timeline
{
    0%, 30%, 60%, 100%{width: 0}
    
    25%, 55%, 85%{width: 100%}
}

@media screen and (max-width: 480px) 
{
  #slider #slides .slide .caption
  {
    width: 100%;
    height: auto;
    top: auto;
    bottom: 0;
    padding: 20px 8%
  }
  
  #slider #slides .slide .caption p{font-size: 100%}
}
/*--- End Slider animation ---*/
#festivalInfo h4{
  line-height: 1.5;
  padding: 0 100px;
}
#festivalInfo h2 {
    margin-bottom: 20px;
    text-transform: uppercase;
    font-weight: bold;
}
#Bloom #heading, #events{
  background-color: #fcfcfc;
}
#events{
  padding: 0 100px 100px 100px;
 }
#Bloom #header{
  background-color: rgba(225, 141, 253, .75);
  text-align: right;
  position: relative;
}
#Bloom .img-container{
  top: -50%;
  left: 5%;
}
.headline{
  width: 100%;
  text-align: right;
  padding: 20px;
  color: white;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 35px;
  font-family: 'Poiret One', cursive;
}
span.headline{
  padding: 100px;
}
#Home .gk-article #events img{
  max-width: 100%;
}
@media (min-width: 1150px){
body.home #gk-content {
    padding-left: auto;
    padding-right: auto;
}
}
@media (max-width: 769px) {
	#heading {
    text-align: center;
    padding: 0;
	}
	.btn-group .ticket {
    display: inline-block;
    padding: 20px;
    white-space: normal;
	}
	#Home h3, #Bloom h3 {
    font-weight: bold;
    font-size: 22px;
	}
	.row-left-col {
    display: inline-block;
    width: 100%;
	}
	#Home .blurb, #Bloom .blurb {
    padding: 20px;
	}
	#bloom.row, #artists.row, #garden.row {
    display: block;
    }
    .row .Image {
    display: block;
    justify-content: center;
    line-height: 300px;
	}
	.ticketInfo .btn-group {
    white-space: normal;
	}
	#Home .blurb, #Bloom .blurb {
    text-align: center !important;
	}
	#Home .button {
    margin: auto;
	}
	.row-right-col, #artists .row-left-col {
    width: 100%;
	}
	.row .Image .title {
    text-align: center;
    width: 100%;
    display: block;
	}
	#artists .button {
    margin: 0;
    width: 100%;
    max-width: none;
	}
	.row .Image .title {
    font-size: 65px;
    }
    #bloom .row-left-col span {
    font-size: 24px;
    color: #333;
	}
	#bloom .row-right-col {
    background: transparent;
    }
    #bloom .Image {
    padding: 20px 0;
	}
	#bloom.row, #artists.row, #garden.row {
		min-height:0;	
	}
}