/* CSS Document */
#myVideo {

  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
}

#logo img {
opacity:0;
}

#headerwrapper.stick #logo img {
opacity:1;
}

#sfeerwrapper {
height:100vh;
background-image:none;
overflow:hidden;
}

#slideshow { position:relative; overflow:hidden; width:100%; height:100% } /* change width and height to suit */
#slideshow div { position:absolute; z-index:2; width:105%; height:105%; top:-2.5%; left:-2.5%; background-position:center; background-repeat:no-repeat; background-size:cover; opacity:0;
	-webkit-transition:opacity 3s, -webkit-transform 8s; -ms-transition:opacity 3s, -ms-transform 8s; transition:opacity 3s, transform 8s 
	}
#slideshow div { -webkit-transform-origin:bottom left; -ms-transform-origin:bottom left; transform-origin:bottom left }
#slideshow :nth-child(2n+1) { -webkit-transform-origin:top right; -ms-transform-origin:top right; transform-origin:top right }
#slideshow :nth-child(3n+1) { -webkit-transform-origin:top left; -ms-transform-origin:top left; transform-origin:top left }
#slideshow :nth-child(4n+1) { -webkit-transform-origin:bottom right; -ms-transform-origin:bottom right; transform-origin:bottom right }
#slideshow .fx:first-child + div ~ div, #slideshow .fx1 { z-index:1 }
#slideshow .fx, #slideshow .fx1 { -webkit-transform:scale(1.05) translate(2%); -ms-transform:scale(1.05) translate(2%); transform:scale(1.05) translate(2%); opacity:1 }

.mx_buttons.slider {
position:absolute;
top:90px;
left:20px;
z-index:5;
}


#sfeertext-home {
width:100%;
  position: absolute;
  top: 50%;
 -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
text-align:center;
z-index:5;
}

#sfeertext-home img {
width:100%;
max-width:400px;
height:auto;
margin-bottom:20px;
z-index:5;
}

#sfeertext-home i {
font-size:75px;
color:#FFFFFF;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.9);
 animation: bounce 2s infinite;
 -webkit-animation: bounce 2s infinite;
 -moz-animation: bounce 2s infinite;
 -o-animation: bounce 2s infinite;
 z-index:5;
}
 
@-webkit-keyframes bounce {
 0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);} 
 40% {-webkit-transform: translateY(-20px);}
 60% {-webkit-transform: translateY(-15px);}
}
 
@-moz-keyframes bounce {
 0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0);}
 40% {-moz-transform: translateY(-20px);}
 60% {-moz-transform: translateY(-15px);}
}
 
@-o-keyframes bounce {
 0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0);}
 40% {-o-transform: translateY(-20px);}
 60% {-o-transform: translateY(-15px);}
}
@keyframes bounce {
 0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
 40% {transform: translateY(-20px);}
 60% {transform: translateY(-15px);}
}

#titlewrapper {
width:100%;
height:auto;
}

#title {
width:100%;
max-width:1240px;
margin: 0 auto;
padding:50px 30px;
text-align:center;
}

#aboutwrapper {
width:100%;
background-color:#F5F5F5;
}

#about {
width:100%;
max-width:1240px;
margin: 0 auto;
padding:0 0 0 30px;
}

#about-text {
float:left;
width:55%;
padding:50px 30px 20px 0;
}

#about-image {
float:left;
width:27.5%;
background-position:top center;
background-size:cover;
}

#about-payoff {
float:left;
width:17.5%;
background-color:#2E2E2E;
position: relative;
padding:15px;
text-align:center;
}

#about-payoff .inner {
border: solid 1px #FFFFFF;
height:100%;
}

#about-payoff .inner span{
width:100%;
left:0;
position:absolute;
top: 50%;
transform: translateY(-50%);
text-transform:uppercase;
font-weight: 300;
color:#FFFFFF;
font-size:40px;
line-height:100%;
}

#portfoliowrapper {
width:100%;
height:auto;
}

.homegrid-sizer,
.homegrid-item { width: 25%; }

.homegrid-item {
position:relative;
}

.homegrid-overlay {
opacity:0;
position:absolute;
top:0;
left:0;
height:100%;
width:100%;
transition: all 0.7s ease;
background: rgba(142,122,63,1);
background: -moz-linear-gradient(top, rgba(142,122,63,1) 0%, rgba(58,58,60,0.76) 68%, rgba(58,58,60,0.65) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(142,122,63,1)), color-stop(68%, rgba(58,58,60,0.76)), color-stop(100%, rgba(58,58,60,0.65)));
background: -webkit-linear-gradient(top, rgba(142,122,63,1) 0%, rgba(58,58,60,0.76) 68%, rgba(58,58,60,0.65) 100%);
background: -o-linear-gradient(top, rgba(142,122,63,1) 0%, rgba(58,58,60,0.76) 68%, rgba(58,58,60,0.65) 100%);
background: -ms-linear-gradient(top, rgba(142,122,63,1) 0%, rgba(58,58,60,0.76) 68%, rgba(58,58,60,0.65) 100%);
background: linear-gradient(to bottom, rgba(142,122,63,1) 0%, rgba(58,58,60,0.76) 68%, rgba(58,58,60,0.65) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8E7A3F', endColorstr='#3A3A3C', GradientType=0 );
}

.homegrid-item:hover .homegrid-overlay {
opacity:1;
}

.homegrid-overlay-text {
  position: absolute;
  width:100%;
  top: 50%;
  transform: translateY(-50%);
  text-align:center;
  color:#FFFFFF;
  padding:10px;
}

.homegrid-overlay-text h2 {
line-height:100%;
margin-bottom:10px;
}

.homegrid-overlay-text p {
margin-bottom:0;
}

.homegrid-item img{
width:100%;
height:auto;
display:block;
}

#blogwrapper {
width:100%;
height:auto;
}

#blog {
width:100%;
max-width:1240px;
margin: 0 auto;
padding:50px 30px;
text-align:center;
}

#reviewswrapper {
width:100%;
background-color: #272727;
}

#reviews {
width:100%;
max-width:1240px;
margin: 0 auto;
padding:0 30px 0 0;
}

#reviews-payoff {
float:left;
width:17.5%;
background-color:#3A3A3C;
position: relative;
padding:15px;
text-align:center;
}

#reviews-text {
float:left;
width:82.5%;
padding:50px 0 50px 50px;
color:#FFFFFF;
}

#reviews-text h3 {
color:#FFFFFF;
}


font-weight:normal;
font-size:30px;
margin-bottom:0;
}

#reviews-payoff .inner {
border: solid 1px #FFFFFF;
height:100%;
}

#reviews-payoff .inner span{
width:100%;
left:0;
position:absolute;
top: 50%;
transform: translateY(-50%);
color:#FFFFFF;

text-transform:uppercase;
font-weight: 300;
color:#FFFFFF;
font-size:46px;
line-height:100%;
}

@media screen and (max-width: 1023px) {

.homegrid-sizer,
.homegrid-item { width: 50%; }

#reviews-payoff {
width:25%;
}

#reviews-text {
float:left;
width:75%;
}

} /* end mediaquery */

@media screen and (max-width: 890px) {
#about {
padding:0;
}

#about-text {
float:left;
width:100%;
padding:50px 30px 20px 30px;
}

#about-image {
float:left;
width:55%;
height:50vw;
background-position:top center;
background-size:cover;
}

#about-payoff {
float:left;
width:45%;
}

#reviews-payoff {
width:27%;
}

#reviews-text {
width:73%;
}

} /* end mediaquery */


@media screen and (max-width: 700px) {


#sfeertext-home {
padding: 7vw 25% 0 0;
}

#sfeer h3 {
font-size:40px;
}

#reviews {
padding:0;
}

#reviews-payoff {
width:100%;
height:120px;
}

#reviews-text {
float:left;
width:100%;
padding: 50px 30px 50px 30px;
}

} /* end mediaquery */

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

#sfeertext-home {
padding: 7vw 0 0 0;
}

.homegrid-sizer,
.homegrid-item { width: 100%; }

} /* end mediaquery */