html,
body {
    height: 100%;
}

/* navbar padding */
body {
	margin-top: 50px;
}

.header-background {
	width: 100%;
    height: 100%;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	background-image:
	linear-gradient(
      rgba(0, 0, 0, 0.5),
      rgba(0, 0, 0, 0.5)
    ),
	url(../img/gp_bg.jpg);
    text-align: center;
    color: #fff;
    position: center;
}

.header-affiliates {
	position: absolute;
	bottom: 0;
	left: 0;
	margin:5px;
}

.scroll-down {
  opacity: 1;
  -webkit-transition: all .5s ease-in 3s;
  transition: all .5s ease-in 3s;
}

.scroll-down {
  position: absolute;
  bottom: 30px;
  left: 50%;
  margin-left: -16px;
  display: block;
  width: 32px;
  height: 32px;
  border: 2px solid #FFF;
  background-size: 14px auto;
  border-radius: 50%;
  z-index: 2;
  -webkit-animation: bounce 2s infinite 2s;
  animation: bounce 2s infinite 2s;
  -webkit-transition: all .2s ease-in;
  transition: all .2s ease-in;
}

.scroll-down:before {
    position: absolute;
    top: calc(50% - 8px);
    left: calc(50% - 6px);
    transform: rotate(-45deg);
    display: block;
    width: 12px;
    height: 12px;
    content: "";
    border: 2px solid white;
    border-width: 0px 0 2px 2px;
}

.fab {
	padding: 5px;
	font-size: 32px;
	text-align: center;
	text-decoration: none;
}

.fab:hover {
	opacity: 0.7;
	color:white;
	text-decoration: none;
}

.fa-facebook-f {
	background: #3B5998;
	color: white;
}

.fa-twitter {
	background: #55ACEE;
	color: white;
}

.fa-linkedin-in {
	background: #007bb5;
	color: white;
}

.header-social {
	position: absolute;
	bottom: 0;
	right: 0;
	margin:5px;
}

@keyframes bounce {
  0%,
  100%,
  20%,
  50%,
  80% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    transform: translateY(-10px);
  }
  60% {
    -webkit-transform: translateY(-5px);
    -ms-transform: translateY(-5px);
    transform: translateY(-5px);
  }
}

.h2 {
    font-family: 'Bitter', sans-serif;
    font-size: 30px;
    margin-bottom: 20px;
    padding-top: 45px;
    text-transform: uppercase;
    color: #323232;
    letter-spacing: 5px;
}

.headline {
	position: absolute;
	top: 50%;
	left:50%;
	transform: translate(-50%,-50%);
}

.headline h1 {
	font-size: 5.5rem;
}

.nav-pills > li > a {
    background-color: #f3f3f3 !important;
	width: 100% !important;
	color: #969696 !important;
	border-radius:0 !important;
	padding: 10px !important;
	font-size: 15px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 2px;
}

.nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover {
    color: #fff !important;
    background-color: #15b86e !important;
}

.nav-pills > li > a:hover {
	background-color: #15b86e !important;
    color: #fff !important;
}

.navbar {
    background-color: rgba(255, 255, 255, 1);
    z-index: 200;
    border: solid #dcdcdc;
    border-width: 0 0 1px;
}

.navbar li a, .navbar .navbar-brand {
    color: #7a7a7a !important;
}

.navbar-nav li a:hover, .navbar-nav li.active a {
    color: #15b86e !important;
    background-color: transparent !important;
}

.navbar-default .navbar-toggle {
	border-color: transparent;
    color: #7a7a7a !important;
}

.navbar-inverse .navbar-toggle .icon-bar {
	background-color: #15b86e;
}

/* 
.navbar-brand {
	padding: 0px;
}
.navbar-brand>img {
	height: 100%;
	padding: 15px;
	width: auto;
}
*/

/* navbar button icon */'

.navbar-default .navbar-toggle .icon-bar {
    background-color: black !important;
}

.navbar-toggle .icon-bar:nth-of-type(2) {
	  top: 1px;
}

.navbar-toggle .icon-bar:nth-of-type(3) {
  	top: 2px;
}

.navbar-toggle .icon-bar {
	  position: relative;
	  transition: all 500ms ease-in-out;
}

.navbar-toggle.active .icon-bar:nth-of-type(1) {
	  top: 6px;
	  transform: rotate(45deg);
}

.navbar-toggle.active .icon-bar:nth-of-type(2) {
	  background-color: transparent;
}

.navbar-toggle.active .icon-bar:nth-of-type(3) {
	  top: -6px;
	  transform: rotate(-45deg);
}

.btn.sharp {
	border-radius:0;
	background: #00b86e !important;
	display: inline-block;
	padding: 10px 30px;
	color: #fff !important;
	text-transform: uppercase;
	text-decoration: none;
	transition: all 0.2s ease;
	-webkit-transition: all 0.2s ease;
	text-decoration: none;
}

.btn.sharp:hover {
	background: #00a663 !important;
	cursor: pointer;
	text-decoration: none;
}

.spacer {
    margin-top: 25px;
	margin-bottom: 25px;
}

/* carousel reviews slider */
.carousel-control.right, .carousel-control.left {
	background-image: none;
	color: #15b86e;
}
.carousel-indicators li {
	border-color: #15b86e;
}
.carousel-indicators li.active {
	background-color: #15b86e;
}

.slideanim {
	visibility:hidden;
}
.slide {
	animation-name: slide;
	-webkit-animation-name: slide;
	animation-duration: 1s;
	-webkit-animation-duration: 1s;
	visibility: visible;
}
.carousel-indicators li {
	visibility: hidden; 
}

@keyframes slide {
	0% {
		opacity: 0;
		transform: translateY(70%);
	} 
	100% {
		opacity: 1;
		transform: translateY(0%);
	}
}
@-webkit-keyframes slide {
	0% {
		opacity: 0;
		-webkit-transform: translateY(70%);
	} 
	100% {
		opacity: 1;
		-webkit-transform: translateY(0%);
	}
}

/* Team Members */
.team-members {
    width: 100%;
    cursor: pointer;
    overflow: hidden;
    position: relative;
    margin-bottom: 35px;
}

.team-members .team-avatar {
    position: relative;
}

.team-members .team-avatar:after {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: " ";
    position: absolute;
    background: rgba(129, 129, 129, 0.1);
    transition-duration: 300ms;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.7, 1, 0.7, 1);
}

.team-members .team-avatar img {
    display: block;
    margin: 0 auto;
    text-align: center;
}

.team-members .team-desc {
    left: auto;
    bottom: 0;
    width: 100%;
    padding: 0 20px;
    position: absolute;
    opacity: 0;
    color: #fff;
    -webkit-transform: translate3d(0, 10%, 0);
    transform: translate3d(0, 10%, 0);
    -webkit-transition: opacity 0.3s;
    -moz-transition: opacity 0.3s;
    -ms-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s;
}

.team-members .team-desc h4 {
    font-size: 22px;
    font-weight: 600;
    margin: 0 0 10px;
    color: #fff;
}

.team-members .team-desc span {
    display: block;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    color: #fff;
}

.team-members:hover .team-avatar:after {
    background: rgba(47, 60, 72, 0.8);
    transition-duration: 300ms;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.7, 1, 0.7, 1);
}

.team-members:hover .team-desc {
    -webkit-transform: translate3d(0, -5%, 0);
    transform: translate3d(0, -5%, 0);
    -webkit-transform: translate3d(0, -10%, 0);
    transform: translate3d(0, -10%, 0);
}

.team-members:hover .team-desc {
    opacity: 1;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -ms-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
}

.card {
    font-size: 1em;
    overflow: hidden;
    padding: 0;
    border: none;
    border-radius: .28571429rem;
    box-shadow: 0 1px 3px 0 #d4d4d5, 0 0 0 1px #d4d4d5;
	margin-top:15px;
	margin-bottom:15px;
}

.card-block {
    font-size: 1em;
    position: relative;
    margin: 0;
    padding: 1em;
    border: none;
    border-top: 1px solid rgba(34, 36, 38, .1);
    box-shadow: none;
}

.card-title {
    font-size: 1.28571429em;
    font-weight: 700;
    line-height: 1.2857em;
}

.card-text {
    clear: both;
    margin-top: .5em;
    color: rgba(0, 0, 0, .68);
}

footer {
	margin-top: 12.5px;
	margin-bottom: 12.5px;
}

@media(max-width:1200px) {
	.headline h1 {
		font-size: 140px;
	}

	.headline h2 {
		font-size: 63px;
	}

	.spacer {
		margin-top: 50px;
	}
}

@media(max-width:991px) {
	.headline h1 {
		font-size: 105px;
	}

	.headline h2 {
		font-size: 50px;
	}

	.spacer {
		margin-top: 40px;
	}
}

@media(max-width:768px) {
	.container {
		margin: 0 15px;
	}

	.spacer {
		margin-top: 40px;
	}
}

@media(max-width:668px) {
	.headline h1 {
		font-size: 70px;
	}

	.headline h2 {
		font-size: 32px;
	}

	.spacer {
		margin-top: 30px;
	}
}

@media(max-width:640px) {
	.headline {
		padding: 75px 0 25px 0;
	}

	.headline h1 {
		font-size: 60px;
	}

	.headline h2 {
		font-size: 30px;
	}
}

@media(max-width:375px) {
	.spacer {
		margin-top: 10px;
	}
}