body {
	background-color: #000000;
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
	color: #ffffff;
	text-align: center;
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Anton', sans-serif;
	/*text-transform: uppercase;*/
	letter-spacing: .03rem;
}

p {
	line-height: 1.7;
	margin-bottom: 0rem;
}

.gb-em {
	color: #ffcc00;
}

.gb-sub {
	font-size: 2rem;
}

.gb-commentary .gb-commentary-container .gb-credit {
	font-size: .7rem;
	letter-spacing: .04rem;
}

br {
	padding-bottom: 10px;
}

.gb-br-rev {
	margin-top: -4rem;
}

.gb-br-rev-x2 {
	margin-top: -7rem;
}

a:hover, a :focus, a:active { 
	color: #ffcc00;
	text-decoration: none;
	cursor: pointer;
}

a { 
	color: #ffffff;
}

.gb-link a {
	color: #0066ff;
}


/* NAVBAR ---------------------------------------------------------------- */
.gb-navbar {
	background-color: #000000;
	width: 100%;
}

.overlay {
    height: 0%;
    width: 100%;
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    /*background-color: rgb(255,204,0);
    background-color: rgba(255,204,0, 1);*/
    background-color: #000000;
    overflow-y: hidden;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

.overlay .gb-brand {
	max-width: 70px;
	padding: none;
}

.navbar-brand, #gb-menu-brand{
	position: absolute;
	top: 0;
	left: 0;
	padding: 1.2rem;
	z-index: 1002;
}

.overlay .closebtn {
    position: absolute;
    top: 0;
    right: 0;
    padding: none;
    font-family: 'Roboto', sans-serif;
    font-size: 30px;
}

#gb-hamburger {
	font-size: 30px;
	cursor: pointer;
	float: right;
	color: #ffffff;
	padding: .7rem 1.2rem .8rem 1.2rem;	
}

#gb-menu-hamburger{
	font-size: 30px;
	cursor: pointer;
	float: right;
	color: #ffffff;
	z-index: 1001;
	padding: .7rem 1.2rem 1rem 1.2rem;	
}

.overlay-content {
    position: relative;
    /*top: 25%;*/
    width: 100%;
    text-align: center;
    top: 50%;
 	-webkit-transform: translateY(-50%);
 	transform: translateY(-50%);
}

.overlay-content hr {
	width: 20%;
	border-top: 1px solid #ffffff;
}

.overlay-content a {
    padding: 8px;
    text-decoration: none;
    font-size: 30px;
    font-family: 'Anton', sans-serif;
    letter-spacing: .03rem;
    color: #ffffff;
    display: block;
    /*-webkit-transition: 0.3s;*/
    /*transition: 0.3s;*/
}

.overlay a:hover, .overlay a:focus {
    color: #ffcc00;
}

.gb-menu-active {
	color: #ffcc00;
	border-bottom: 1px solid #ffcc00;
	padding-bottom: 3px;
}

@media screen and (max-height: 450px) {
  .overlay {overflow-y: auto;}
  .overlay a {font-size: 20px}
  .overlay .closebtn {
    font-size: 40px;
    /*top: 15px;
    right: 35px;*/
  }
}

/* HOMEPAGE CAROUSEL ---------------------------------------------------------------- */

.gb-jumbotron {
	background-color: #000000;
	margin-bottom: 0rem;
	text-align: center;
	/*padding: 5rem 2rem 2rem 1.2rem;*/
	padding: 1.5rem;
	height: 100vh;
}

.gb-jumbotron-container {
	/*padding: 70px 0px 0px 0px;*/
	position: relative;
 	top: 50%;
 	-webkit-transform: translateY(-50%);
 	transform: translateY(-50%);
 	/*padding-right: 2rem;*/
	margin-left: auto;
	margin-right: auto;
	max-width: 550px;
}

.gb-jumbotron h1, .gb-jumbotron h2, .gb-jumbotron h3 {
	line-height: 1.1;
	margin-left: auto;
	margin-right: auto;
}

.gb-jumbotron h1 {
	font-size: 4.1rem;
}
.gb-jumbotron h2 {
	font-size: 3rem;
	/*letter-spacing: .06rem;*/
}
.gb-jumbotron h3 {
	font-size: 1.5rem;
}

.gb-jumbotron p {
	max-width: 425px;
	font-size: 1.1rem;
	margin-left: auto;
	margin-right: auto;
}
.gb-jumbotron-btn {
	-webkit-transition: 0.2s ease;
 	transition: 0.2s ease;
	margin-top: 2.5rem;
}

body .gb-jumbotron-container .gb-jumbotron-btn {
	width: auto;
}

.gb-jumbotron-btn a {
	font-family: 'Anton', sans-serif;
	font-size: 1.2rem;
	letter-spacing: .07rem;
	padding: 1.2rem 1.8rem;
	color: #ffffff;
	border: 2px solid #ffffff;
    border-radius: 10px;
    
}

.gb-jumbotron-alt .gb-jumbotron-btn a, .gb-commentary-alt .gb-jumbotron-btn a {
	letter-spacing: .05rem;
	color: #000000;
	border-color: #000000;
}

.gb-jumbotron-btn:hover, .gb-jumbotron-btn:focus{
	/*color: #000000;
	border-color: #ffffff;
	background-color: #ffffff;*/
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}

/*.gb-jumbotron-alt .gb-jumbotron-btn a:hover, .gb-jumbotron-alt .gb-jumbotron-btn a:focus,
.gb-commentary-alt .gb-jumbotron-btn a:hover,  .gb-commentary-alt .gb-jumbotron-btn a:focus {
	color: #ffffff;
	border-color: #000000;
	background-color: #000000;
}*/

/* FOOTER ----------------------------------------------------------------------- */

.gb-footer .gb-jumbotron p {
	max-width: 550px;
}

.gb-footer .gb-jumbotron-alt {
	color: #000000;
	background-color: #ffffff;
	/*height: 50vh;*/
}

.gb-contact-social {
	font-size: 36px;
	padding: 1rem;
}

.gb-cs-footer .gb-jumbotron {
	height: auto;
	padding: 4rem 1.2rem;
}

/*.gb-cs-footer .gb-jumbotron-btn {
	margin-top: 0;
}*/



/* IMAGE GRID ----------------------------------------------------------------------- */
.imageGrid {
	margin: auto;
	background-color: #000000;
}

.imageGrid a {
	text-decoration: none;
}

.row{
	margin: auto;
}

.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    position: relative;
    min-height: 1px;
    padding-right: 0px;
    padding-left: 0px;
}

.card {
	color: #ffffff;
	background-color: #000000;
	border: none;
    border-radius: 0px;
    overflow: hidden;
}

.card-img-top {
	border: none;
    border-radius: 0px;
}

.card:hover .card-body, .card:focus .card-body, .card:hover .card-header, .card:focus .card-header {
	background-color: #ffffff;
	color: #000000;
	cursor: pointer;
}

.card-body {
	z-index: 2;
	background-color: #000000;
	padding: 20px 20px 20px 20px;
	text-align: center;
}

.card-header {
	position: absolute;
	bottom: 50px;
	z-index: 3;
	background-color: #000000;
	padding: 20px 20px 0px 20px;
	border: none;
}

.card-title{
	margin-top: .25rem;
}

.card img {
 	-webkit-transition: 0.6s ease;
 	transition: 0.6s ease;
}

.card:hover img {
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
}

.gb-menu-grid {
	margin-top: -1rem;
	/*padding-bottom: 4rem;*/
	background-color: #000000;
	/*color: #ffffff;*/
}

.gb-cs-grid {
	/*margin-top: -7rem;*/
	padding: 0 1.2rem 4rem 1.2rem;
	background-color: #ffffff;
	color: #000000;
}

.gb-cs-grid-alt {
	color: #ffffff;
	background-color: #000000;
}

.gb-cs-grid-rev {
	margin-top: -4rem;
}

.gb-menu-grid h1, .gb-cs-grid h1 {
	max-width: 550px;
	text-align: center;
	padding-left: 1.2rem;
	padding-right: 1.2rem;
	margin-left: auto;
	margin-right: auto;
}

body .gb-cs-grid .card {
	/*border-radius: 10px;*/
	background-color: #f2f2f2;
}
body .gb-cs-grid-alt .card {
	/*border-radius: 10px;*/
	background-color: #181818;
}

body .gb-cs-grid .card img {
	margin-top: 2.4rem;
	margin-left: auto;
	margin-right: auto;
	width: 70%;
}

.gb-cs-grid .card:hover, .gb-cs-grid .card:focus {
	cursor: pointer;
}

.gb-cs-grid .card {
	height: 375px;
	overflow: hidden;
	margin: 1.2rem;
	background-color: #ffffff;
	color: #000000;
}

body .gb-cs-grid .card .card-body {
	background-color: #f2f2f2;
	color: #000000;
	/*border-top: 1px solid #eeeeee;*/
	text-align: center;
	position: absolute;
	z-index: 2;
	bottom: 0px;
	left: 0px;
	width: 100%;
}

body .gb-cs-grid-alt .card .card-body {
	background-color: #181818;
	color: #ffffff;
}

.gb-hyundai-res-row {
	padding-top: 3.5rem;
}

/* The Modal */
.modal {
	display: none;
	position: fixed;
	z-index: 900;
	padding: 5rem 1.2rem;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: #ffffff;
}

/* Modal Content */
.modal-content {
	position: relative;
	background-color: #ffffff;
	margin: auto;
	padding: 1.2rem;
	width: 90%;
	/*max-width: 1200px;*/
	border: none;
}

.modal-max-300 {
	max-width: 300px;
}

.modal-max-350 {
	max-width: 350px;
}

.modal-max-400 {
	max-width: 400px;
}

.modal-max-500 {
	max-width: 500px;
}

.modal-max-600 {
	max-width: 600px;
}

.modal-max-700 {
	max-width: 700px;
}

.modal-max-800 {
	max-width: 800px;
}

.modal-max-900 {
	max-width: 900px;
}

.modal-max-1000 {
	max-width: 1000px;
}

.modal-max-1100 {
	max-width: 1100px;
}

.modal-max-1200 {
	max-width: 1200px;
}

.modal-max-1300 {
	max-width: 1300px;
}

.modal-max-1400 {
	max-width: 1400px;
}

.modal-max-1500 {
	max-width: 1500px;
}

.modal-max-1600 {
	max-width: 1600px;
}

.modal-max-1700 {
	max-width: 1700px;
}

.modal-max-1800 {
	max-width: 1800px;
}

.modal-max-1900 {
	max-width: 1900px;
}

.modal-max-2000 {
	max-width: 2000px;
}

.modal p {
	padding-top: 3.5rem;
	font-size: 1.2rem;
	text-align: center;
	color: #000000;
}

.modal:hover, .modal:focus {
  cursor: pointer;
}

.mySlides {
  display: none;
}

#myModal a, #myModal h1 {
	color: #000000;
}

.gb-hyundai-modal img {
	max-width: 1000px;
}

.gb-hyundai-modal .gb-hyundai-modal-sm img {
	max-width: 626px;
}

/* VIDEO GRID ----------------------------------------------------------------------- */

.gb-no-hero {
	padding-top: 5rem;
}

.gb-col {
	margin-right: auto;
	margin-left: auto;
	padding: 1.2rem;
}

.gb-video-grid {
	text-align: center;
	background-color: #ffffff;
	color: #000000;
	padding-left: 1.2rem;
	padding-right: 1.2rem;
	margin-top: -2rem;
}

.gb-video-grid .gb-video-grid-container {
	max-width: 1000px;
	margin-right: auto;
	margin-left: auto;
}

/*.gb-video-grid .row .card {
	border: 1px solid #000000;
}*/

.gb-video-grid .row .card, .gb-video-grid .row .card-body {
	background-color: #ffffff;
	color: #000000;
}

.gb-video-grid video {
	/*padding: 1.2rem;*/
	margin-right: auto;
	margin-left: auto;
	/*border: 1px solid #000000;*/
}

/* COMMENTARY ----------------------------------------------------------------------- */

.gb-commentary-container h1, .gb-commentary-container h2, .gb-commentary-container h3 {
	text-align: center;
}

.gb-commentary-container p {
	text-align: left;
}

.gb-commentary-container .gb-sign-off {
	text-align: center;
}

.gb-commentary-alt {
	background-color: #ffffff;
	color: #000000;
}

.gb-commentary-container {
	position: relative;
	padding: 3.5rem 1.2rem;
	margin-left: auto;
	margin-right: auto;
	max-width: 800px;
}

.gb-commentary h2 {
	font-size: 2rem;
	letter-spacing: .06rem;
}

/* VIDEOS ----------------------------------------------------------------------- */

.gb-jumbotron-video {
	/*background-color: #ffcc00;*/
	height: 100%;
}

.gb-jumbotron-video .gb-commentary-container {
	max-width: none;
	margin-right: auto;
	margin-left: auto;
	padding-top: 7rem;
	padding-bottom: 7rem;
	/*background-color: #ffcc00;*/
}

.gb-jumbotron-video .gb-commentary-container p {
	max-width: 700px;
	font-size: 1rem;
	line-height: 1.7rem;
	margin-right: auto;
	margin-left: auto;
}


.gb-jumbotron-video .gb-credit {
	padding-top: 1rem;
	font-size: .8rem;
	letter-spacing: .02rem;
}

@media (min-width: 1000px) {
	.gb-video-masthead {
		width: 970px;
		height: 250px;
	}
}

@media (max-width: 640px) {
	/*#gb-hero-functionality h1, #gb-hero-canon h1 {*/
	body .gb-hero h1 {
		font-size: 3.5rem;
	}
	body .gb-hero h2 {
		font-size: 2.5rem;
	}
	body #gb-hero-animation {
		background-image: url(images/img_full_jane_blonde.jpg);
	}

	body #gb-hero-amazon-echo {
		background-image: url(images/img_full_amazon_echo_mob.jpg);
	}

	body #gb-hero-basf-cleaner-air {
		background-image: url(images/img_full_basf_cleaner_air_mob.jpg);
	}

	body .gb-hero .gb-jumbotron-container {
		/*margin-top: -1rem;*/
	}
	/*body #gb-hero-welcome {
		background-image: url(images/img_full_welcome_mob.jpg);
	}*/
}

@media (max-width: 620px) {
	body #gb-hero-welcome {
		background-image: url(images/img_full_welcome_mob.jpg);
	}
}

#gb-hero-welcome {
	background-image: url(images/img_full_welcome.jpg);
	/*background-image: url(images/gallery_tile.jpg);
	background-size: auto;
	background-repeat: repeat;*/
}

#gb-hero-contact {
	background-image: url(images/img_full_contact.jpg);
}

#gb-hero-about {
	background-image: url(images/img_full_me.jpg);
}

#gb-hero-design{
	background-image: url(images/img_full_amazon_black_friday.jpg);
}

#gb-hero-animation {
	background-image: url(images/img_full_jane_blonde_menu.jpg);
}

#gb-hero-functionality {
	background-image: url(images/img_full_edf.jpg);
}

#gb-hero-case_studies {
	background-image: url(images/img_full_canon_yt.jpg);
}

#gb-hero-canon {
	background-image: url(images/img_full_canon_yt.jpg);
}

#gb-hero-basf-banners {
	background-image: url(images/img_full_basf_banners.jpg);
}

#gb-hero-basf-cms {
	background-image: url(images/img_full_basf_cms.jpg);
}

#gb-hero-basf-cleaner-air {
	background-image: url(images/img_full_basf_cleaner_air.jpg);
}

#gb-hero-hyundai-santa-fe {
	background-image: url(images/img_full_santa_fe.jpg);
}

#gb-hero-amazon-black-friday {
	background-image: url(images/img_full_amazon_black_friday.jpg);
}

#gb-hero-amazon-echo {
	background-image: url(images/img_full_amazon_echo.jpg);
}

#gb-hero-vauxhall-mokka {
	background-image: url(images/img_full_mokka.jpg);
}

#gb-hero-celtra {
	background-image: url(images/img_full_celtra.jpg);
}

.gb-hero .gb-jumbotron-container {
	margin-top: 2rem;
	padding: 4rem 1.2rem;
}

.gb-hero {
	background-size: cover;
	background-position: center;
}

.gb-hero p {
	font-size: 1.2rem;
	max-width: 500px;
}

/*#gb-hero-contact p {
	max-width: 550px;
}*/

.gb-hero-darken {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-color: rgba(0,0,0,.4);
}

#gb-hero-about .gb-hero-darken, #gb-hero-celtra .gb-hero-darken {
	background-color: rgba(0,0,0,.3);
}

/*#gb-hero-contact .gb-hero-darken {
	background-color: rgba(0,0,0,.5);
}
*/
#gb-hero-functionality .gb-hero-darken, #gb-hero-design .gb-hero-darken {
	background-color: rgba(0,0,0,.15);
}

#gb-hero-functionality h1 {
	margin-top: -2rem;
}

#gb-hero-canon .gb-hero-darken {
	background-color: rgba(0,0,0,.4);
}

#gb-hero-amazon-echo .gb-hero-darken {
	background-color: rgba(0,0,0,0);
}

.gb-testamonial i {
	font-size: 2rem;
	padding: 1rem;
}

.gb-testimonial {
	max-width: 700px;
}