body{
overflow-x: hidden;
}
.full-width-container {
width: 95%;
max-width: 100%;
clear: both;
margin: 0 auto;
}
.gutters{
padding: 15vh 0 20vh 0;
}
.sm-gutters{
padding: 5vh 0 5vh 0;
}
#me-wrapper{
  height: 80vh;
position:relative;
  background:#444;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
color:#fff;
text-align:center;
font-size:150%;
z-index:-999;
}
#intro p{
font-size:120%;
}
#me{
position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index:-9;
  }
.me{
border-top: 2px solid white;
border-bottom: 2px solid white;
padding:20px;
display:inline-block;
}
#services{
background:#eeefeb;
}
.service{
text-align:center;
color:#fff;
height:270px;
padding:75px 15px 15px 15px;
cursor:pointer;
}
.service-sounds{
text-align:center;
color:#fff;
height:270px;
cursor:pointer;
}
.colour-change-3x {
-webkit-animation: colour-change-3x 1100ms infinite both;
animation: colour-change-3x 1100ms infinite both;
}

@-webkit-keyframes colour-change-3x {
  0% {
    background: #fff;
  }
  50% {
    background: #b22cff;
  }
  100% {
    background: #ff904f;
  }
}
@keyframes colour-change-3x {
  0% {
    background: #19dcea;
  }
  50% {
    background: #b22cff;
  }
  100% {
    background: #ff904f;
  }
}

.hidden{
position:absolute;
left: -9999px;
top:-9999px;
opacity:0;
transform:translatex(-5vw);
-webkit-transition: 2s;
-moz-transition: 2s;
-ms-transition: 2s;
-o-transition: 2s;
transition:translate 2s;
}

.show{
opacity:1;
-webkit-transition: 2s;
-moz-transition: 2s;
-ms-transition: 2s;
-o-transition: 2s;
transition:all 2s;
height:auto;
transform:translatex(0vw);
top: 0px;
left: 0px;
}
.embed-container{ 
position: relative; 
padding-bottom: 56.25%; 
height: 0; 
overflow: hidden; 
max-width: 100%; 
} .embed-container iframe, .embed-container object, .embed-container embed { 
position: absolute; 
top: 0; 
left: 0;
width: 100%; 
height: 100%; 
}

.embed-container img {
    width: 100%;
    top: -16.84%;
    left: 0;
    opacity: 0.7;
}
.embed-container .play-button {
    width: 90px;
    height: 60px;
    background-color: #333;
    box-shadow: 0 0 30px rgba( 0,0,0,0.6 );
    z-index: 1;
    opacity: 0.8;
    border-radius: 6px;
}
.embed-container .play-button:before {
    content: "";
    border-style: solid;
    border-width: 15px 0 15px 26.0px;
    border-color: transparent transparent transparent #fff;
}
.embed-container img,
.embed-container .play-button {
    cursor: pointer;
}
.embed-container img,
.embed-container iframe,
.embed-container .play-button,
.embed-container .play-button:before {
    position: absolute;
}
.embed-container .play-button,
.embed-container .play-button:before {
    top: 50%;
    left: 50%;
    transform: translate3d( -50%, -50%, 0 );
}
#foot{
background:#777;
height:20vw;
}
@media only screen and (max-width : 880px) {
h4{
font-size:2.3rem;
}
}