/*
Theme Name: BrandX
Theme URI: http://underscores.me/
Author: Karl O Brien
Author URI: http://www.brandx.ie
Description: BrandX Website
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: brandx
Tags:

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

BrandX is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
	## Posts and pages
	## Comments
# Infinite scroll
# Media
	## Captions
	## Galleries
# Theme Specific Styles
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/

h1 { 
    display: block;
    font-size: 2em;
    margin-top: 0.67em;
    margin-bottom: 0.67em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold;
}

h2 {
    display: block;
    font-size: 1.5em;
    margin-top: 0.83em;
    margin-bottom: 0.83em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold;
}

h3 { 
    display: block;
    font-size: 1.17em;
    margin-top: 1em;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold;
}

h4 { 
    display: block;
    font-size: 1em;
    margin-top: 1.33em;
    margin-bottom: 1.33em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold;
}

h5 { 
    display: block;
    font-size: .83em;
    margin-top: 1.67em;
    margin-bottom: 1.67em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold;
}

h6 { 
    display: block;
    font-size: .67em;
    margin-top: 2.33em;
    margin-bottom: 2.33em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold;
}





/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/


/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
	display: block;
}

@media screen and (min-width: 37.5em) {
	.menu-toggle {
		display: none;
	}
	.main-navigation ul {
		display: block;
	}
}

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
	margin: 0 0 1.5em;
	overflow: hidden;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	float: left;
	width: 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	float: right;
	text-align: right;
	width: 50%;
}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
	word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
	outline: 0;
}

.site-header .sprite-phone{
	margin:24px 40px 0 0;
}

.site-header .sprite-email{
	margin-right:40px;
	margin-top:32px;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.5em;
}

.alignright {
	display: inline;
	float: right;
	margin-left: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
	content: "";
	display: table;
	table-layout: fixed;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
	clear: both;
}

/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/
.widget {
	margin: 0 0 1.5em;
}

/* Make sure select elements fit in widgets. */
.widget select {
	max-width: 100%;
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
.sticky {
	display: block;
}

.hentry {
	margin: 0 0 1.5em;
}

.byline,
.updated:not(.published) {
	display: none;
}

.single .byline,
.group-blog .byline {
	display: inline;
}

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation, /* Older / Newer Posts Navigation (always hidden) */
.infinite-scroll.neverending .site-footer { /* Theme Footer (when set to scrolling) */
	display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
	margin-bottom: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	vertical-align: top;
	width: 100%;
}

.gallery-columns-2 .gallery-item {
	max-width: 50%;
}

.gallery-columns-3 .gallery-item {
	max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
	max-width: 25%;
}

.gallery-columns-5 .gallery-item {
	max-width: 20%;
}

.gallery-columns-6 .gallery-item {
	max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
	max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
	max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
	max-width: 11.11%;
}

.gallery-caption {
	display: block;
}


/* 	---------------------------------
	# Theme specific Styles
	--------------------------------- */


/* COLOUR REFERENCES

Blue:		#53B6B2
Lime:		#D3D95B
Gray:  		#333333
Red:		#EB2E49
*/



/* ==== GENERAL ==== */

body {
	
	font-family: 'Tenso', Helvetica, sans-serif;
	font-size: 16px;
	overflow-x:hidden;
}

.lime-text {
	color: #D3D95B;
}
.lime-heading {
	color: #D3D95B;
	font-size: 40px;
	line-height: 40px;
	font-weight: normal;
	text-align: left:
	
}
.logged-in .navbar-fixed-top {
	top: 32px;
}

.we-are-text {
	font-family: 'tenso', Helvetica, sans-serif;
	position: absolute;
	left: 60px;
	color: #fff;
	font-weight: bold;
	font-size: 38px;
	line-height: 42px;
	top: 50%;
  transform: translateY(-50%);
}

@media screen and (min-width : 992px) {
	.we-are-text {
		font-family: 'tenso', Helvetica, sans-serif;
		position: absolute;
		left: 350px;
		color: #fff;
		font-weight: bold;
		font-size: 72px;
		line-height: 72px;
	}
}

@media screen and (min-width : 1400px) {
	.we-are-text {
		font-size: 100px;
		line-height: 100px;
	}
}



/* ========= CONTAINER
   ================================ */
   
.container-fluid {
	padding: 0 0;
}

@media screen and (min-width : 1024px) {
	.inner-container {
		margin: 50px 75px 0 250px;
	}
}

/* ========= HEADER / NAVBAR
   ================================ */


.navbar {
	background: rgba(51, 51, 51, 0.9);
	padding: 0px 15px;
} 

.navbar-nav>li>a {
	font-family: 'tenso', Helvetica, sans-serif;
	font-weight: normal;
	font-size: 18px;
}    

@media screen and (min-width : 992px) {
	.navbar-nav>li>a {
		padding-top: 40px;	
	}    
}


.navbar-inverse .navbar-nav>li>a {
	color: #fff;
	padding-right: 40px;
}

.navbar-default .navbar-nav>li>a {
	color: #fff;
	padding-right: 40px;
}

.navbar-default .navbar-nav>li>a:hover {
	color: #fff;
}

.nav-icon-chat {
	padding-top: -10px !important;
}

.nav-icon-email {
	padding-top: -10px !important;
}

.navbar-brand{
	height:auto !important;
}

.navbar-collapse{
	background: rgba(51, 51, 51, 0.9);
	text-align:center;
}

@media screen and (min-width : 992px) {
	.navbar-collapse{
		background: none;
	}
}


/* ======== FOOTER
   ================================== */

#footer {
	background-color: #333;
	padding: 50px;
}

.footer-text {
	color: #fff;
	padding-top: 25px;
}

.footer-social ul{
	padding-top:30px;
}

.footer-social li{
	margin-bottom:15px;
}

@media screen and (min-width : 992px) {
	.footer-social {
		padding-top: 100px;
		padding-left: 100px;
	}
	.footer-social ul{
		padding:0;
	}

	.footer-social ul{
		text-align:right;
	}
	
	.footer-social li{
		margin-bottom:0;
	}
}


.sprite-phone {
	background: url('assets/img/social_footer.png') no-repeat 0 0;
	width: 52px;
	height: 52px;
	
}

.sprite-email {
	background: url('assets/img/social_footer.png') no-repeat -91px -7px;
	width: 54px;
	height: 38px;
}

.sprite-twitter {
	background: url('assets/img/social_footer.png') no-repeat -184px -4px;
	width: 64px;
	height: 44px;
}

.sprite-facebook {
	background: url('assets/img/social_footer.png') no-repeat -273px -1px;
	width: 25px;
	height: 50px;
}

.sprite-instagram {
	background: url('assets/img/social_footer.png') no-repeat -346px -2px;
	width: 45px;
	height: 46px;
}

.sprite-google {
	background: url('assets/img/social_footer.png') no-repeat -431px -3px;
	width: 46px;
	height: 46px;
}

.footer-social li {
	display: inline-block;
	margin-right: 35px;
	
	
}




/* ========= SECTIONS
   ================================ */
   
#hero {
	background: url('assets/img/bg-hero.png') no-repeat;
	background-size:cover;
	min-height: 800px;
	position: relative;
	width: 100%;
	padding-left: 0px;
	margin-left: 0px;
	color: black;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizelegibility;
	overflow:hidden
}

@media screen and (min-width : 992px) {
	#hero{
		background:none;
	}
}

.scroll-icon {
	position:absolute
}

/* ================================= */


#collab {
	background: url('assets/img/bg-we-are-collaborators.png') no-repeat;
	background-size:cover;
	min-height: 800px;
	position: relative;
	width: 100%;
	padding-left: 0px;
	margin-left: 0px;
	color: black;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizelegibility;
	overflow:hidden
}
   
@media screen and (min-width : 992px) {
	#collab{
		background:none;
	}
}   
   
.collab-text {
	font-family: 'tenso', Helvetica, sans-serif;
	position: absolute;
	left: 15px;
	color: #fff;
	font-weight: bold;
	font-size: 38px;
	line-height: 42px;
	top: 55%;
  transform: translateY(-50%);
}

@media screen and (min-width : 992px) {
	.collab-text {
		font-family: 'tenso', Helvetica, sans-serif;
		position: absolute;
		left: 350px;
		color: #fff;
		font-size: 72px;
		line-height: 72px;	
	}
}

@media screen and (min-width : 992px) {
	.collab-text {
		font-size: 100px;
		line-height: 100px;	
	}
}


/* ================================= */


#partners {
	background: url('assets/img/bg-we-are-partners.png') no-repeat;
	background-size:cover;
	min-height: 800px;
	position: relative;
	width: 100%;
	padding-left: 0px;
	margin-left: 0px;
	color: black;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizelegibility;
	overflow: hidden;
}

@media screen and (min-width : 992px) {
	#partners{
		background:none;
	}
}   

.partners-text {
	position: absolute;
	top: 220px;
	left: 15px;
	color: #fff;
	font-weight: bold;
	font-size: 38px;
	line-height: 42px;
	top: 55%;
  transform: translateY(-50%);		
}

@media screen and (min-width : 992px) {
	.partners-text {
		position: absolute;
		left: 350px;
		color: #fff;
		font-size: 72px;
		line-height: 72px;
	}
}



@media screen and (min-width : 992px) {
	.partners-text {
		font-size: 100px;
		line-height: 100px;
	}
}

/* =================================== */

#creative {
	background: url('assets/img/bg-we-are-creative.png') no-repeat;
	background-size:cover;
	min-height: 800px;
	position: relative;
	width: 100%;
	padding-left: 0px;
	margin-left: 0px;
	color: black;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizelegibility;
	overflow:hidden
}

@media screen and (min-width : 992px) {
	#creative {
		background:none;
	}
}
   
.creative-text {
	position: absolute;
	left: 15px;
	color: #000;
	font-weight: bold;
	font-size: 38px;
	line-height: 42px;
	top: 55%;
  transform: translateY(-50%);				
}

@media screen and (min-width : 992px) {
	.creative-text {
		position: absolute;
		left:auto;
		right: 150px;
		color: #fff;
		font-size: 72px;
		line-height: 72px;
			
	}
}

@media screen and (min-width : 1400px) {
	.creative-text {
		font-size: 100px;
		line-height: 100px;
			
	}
}

/* =================================== */


#section-5 {
	position: relative;
	padding-top:0;
}

@media screen and (min-width : 992px) {
	#section-5 {
		position: relative;
		padding-top:100px;
	}
}

.section-text {
	font-family: 'tenso', Helvetica, sans-serif;
	color: #333;
	text-align: center;
	font-weight: normal;
	font-size: 40px;
	line-height: 48px;
	margin: 150px 0;

}

.home-services {
	font-family: 'tenso', Helvetica, sans-serif;
	color: #fff;
	text-align: left;
	padding: 45px 15px;
	font-weight: normal;
	
}

.home-services-indent {
	padding:15px;
}

@media screen and (min-width : 992px) {
	.home-services {
		padding: 180px 100px 0px 100px;
	}
	.home-services-indent {
		padding: 15px 150px 0 35px;
	}

}



/* =================================== */


@media screen and (min-width : 992px) {
	#service-blocks {
		position: absolute;
		bottom:0;
		left:0;
		width:100%;
	}
}

.section-text-white {
	
	color: #fff;
	text-align: left;
	font-weight: normal;
	font-size: 40px;
	line-height: 40px;
	/*padding: 0px 75px 0px 75px;*/
    

}



/* =================================== */



#identities {
	background: url('assets/img/bg-section-5.png') no-repeat;
	background-size:cover;
	min-height: 800px;
	position: relative;
	width: 100%;
	padding-left: 0px;
	margin-left: 0px;
	color: black;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizelegibility;
	overflow:hidden;
	position:relative;
}

#identities svg{
	position:absolute;
	top:0;
	left:50%;
	margin-left:-480px;
} 
   
@media screen and (min-width : 1024px) {
	#identities {
		background-attachment:fixed;
	}
}   
   
.identities-text {
	font-family: 'tenso', Helvetica, sans-serif;
	position: absolute;
	bottom: 55px;
	left: 0;
	width: 100%;
	color: #fff;
	text-align: center;
	font-weight: normal;
	font-size: 40px;
	line-height: 40px;
	
		
}

.centered-image {
	display: block;
	margin-left:auto;
	margin-right:auto;
	margin-top: ;
	
}

/* ================================= */


#websites {
	background: url('assets/img/bg-section-6.png') no-repeat;
	background-size:cover;
	min-height: 800px;
	position: relative;
	width: 100%;
	padding-left: 0px;
	margin-left: 0px;
	color: black;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizelegibility;
	overflow:hidden
}
   
@media screen and (min-width : 1024px) {
	#websites {
		background-attachment:fixed;
	}
}   
   
.websites-text{
	font-family: 'tenso', Helvetica, sans-serif;
	position: absolute;
	bottom: 55px;
	left: 0;
	width: 100%;
	color: #fff;
	text-align: center;
	font-weight: normal;
	font-size: 40px;
	line-height: 40px;
}   
   
@media screen and (min-width : 992px) {
	.websites-text {
		font-family: 'tenso', Helvetica, sans-serif;
		left:auto;
		right: 30px;
		top: 50%;
		margin-top:-28px;
		width:auto;
	}
}

/* ================================= */

#digital {
	background: url('assets/img/bg-section-8.png') no-repeat;
	background-position:top;
	background-size:cover;
	min-height: 800px;
	position: relative;
	width: 100%;
	padding-left: 0px;
	margin-left: 0px;
	color: black;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizelegibility;
	overflow:hidden
}
 
@media screen and (min-width : 1024px) {
	#digital {
		background-attachment:fixed;
	}
}  
   
.digital-text {
	font-family: 'tenso', Helvetica, sans-serif;
	position: absolute;
	bottom: 55px;
	left: 0;
	width: 100%;
	color: #fff;
	text-align: center;
	font-weight: normal;
	font-size: 40px;
	line-height: 40px;
}

@media screen and (min-width : 992px) {
	.digital-text {
		left: 30px;
		top: 50%;
		width:auto;
		margin-top:-80px;
	}
}

.s8-left-triangle{
	top:50%;
	left:0;
	margin-top:-392px;
	position:absolute;
}


/* ================================= */

/* ======== TRIANGLES
   ================================== */
   
.s1-top-triangle {
	position: absolute;
	left: 0;
}
	

.s1-bottom-triangle {
	position: absolute;
	right: 0;
	left: auto;
	bottom: 0;
		
}

.s2-right-triangle {
	position: absolute;
	top: 140px;	
	right:0;
	bottom: 0;
}

.s3-top-triangle {
	position: absolute;
	left: 0;
}
	

.s3-bottom-triangle {
	position: absolute;
	right: 50px;
	left: auto;
	bottom: 0;
		
}

.s4-top-triangle {
	position: absolute;
	right: 0;
	left: auto;
		
}

.s4-bottom-triangle {
	position: absolute;
	bottom:0;
	
				
}

.s6-bottom-triangle {
	position: absolute;
	bottom:0;
	left:50%;
	margin-left:-392px;
}

.s7-right-triangle {
	position: absolute;
	left: auto;
	right: 0;
	top:50%;
	margin-top:-392px;
}

.s8-right-triangle {
	position: absolute;
	left: 0;
	right: auto;
}

/* ======== SERVICE BLOCK
   ================================== */
   
#branding-block {
	position: relative;
}

.branding-block {
	background-color: #53B6B2;
	
}
.web-block {
	background-color: #D3D95B;
	
}
.marketing-block {
	background-color: #333333;
	
}

.row.match-my-cols {
    overflow: hidden; 
}

.row.match-my-cols [class*="col-"]{
    margin-bottom: -99999px;
    padding-bottom: 99999px;
}

.center-icon{
	position:absolute;
	top: 80px;
	left:0;
	width:100%;
	text-align:center;
	padding-top: 25px;
}

.block-text-white {
	color: #fff;
	text-align: center;
	font-weight: normal;
	font-size: 40px;
	line-height: 40px;
	padding: 190px 75px 100px 75px;
}

/* ======== SECTION 10 JOURNEY
   ================================== */

#journey {
	position: relative;
	margin: 0px 15px;
}

@media screen and (min-width : 992px) {
	#journey {
		position: relative;
		margin: 0px 160px;
	}
}

.journey-text {
	font-family: 'tenso', Helvetica, sans-serif;
	color: #333;
	text-align: center;
	font-weight: normal;
	font-size: 40px;
	line-height: 40px;
	margin: 150px 0 25px 0;
}

.journey-down-arrow {
	display: block;
    margin-left: auto;
    margin-right: auto;	
    padding-bottom: 15px;
}

.journey-heading-left {
	font-family: 'tenso', Helvetica, sans-serif;
	color: #333;
	font-size: 24px;
	line-height: 24px;
}

.journey-heading-center {
	font-family: 'tenso', Helvetica, sans-serif;
	color: #333;
	font-size: 24px;
	line-height: 24px;
}

.journey-heading-right {
	font-family: 'tenso', Helvetica, sans-serif;
	color: #333;
	font-size: 24px;
	line-height: 24px;
}

.journey-brand {
	background: url('assets/img/journey-brand.png') no-repeat center top;
	min-height: 150px;
	padding-bottom:45px;
	padding-top:120px;
	text-align:center;
}

@media screen and (min-width : 992px) {
	.journey-brand {
		background: url('assets/img/journey-brand.png') no-repeat top left;
		min-height: 150px;
		padding-top:0;
		padding-bottom:0;
		padding-left: 110px;
		text-align:left;
	}
}

.journey-digital {
	background: url('assets/img/journey-digital.png') no-repeat top center;
	text-align: center;
	padding-top: 100px;
	padding-bottom:45px;
}

@media screen and (min-width : 992px) {
	.journey-digital {
		background: url('assets/img/journey-digital.png') no-repeat top right;
		text-align: right;
		padding-right: 180px;
		padding-bottom:45px;
		padding-top:0;
	}
}

.journey-channel {
	background: url('assets/img/journey-channel.png') no-repeat center top;
	min-height: 150px;
	padding-bottom:45px;
	padding-top: 170px;
	text-align:center;
}

@media screen and (min-width : 992px) {
	.journey-channel {
		background: url('assets/img/journey-channel.png') no-repeat left center;
		min-height: 150px;
		padding-left: 180px;
		padding-top:40px;
		text-align:left;
	}
}

.journey-website {
	background: url('assets/img/journey-website.png') no-repeat center top;
	text-align: center;
	padding-bottom:45px;
	padding-top: 110px;
}

@media screen and (min-width : 992px) {
	.journey-website {
		background: url('assets/img/journey-website.png') no-repeat;
		background-position:top right; 
		text-align: right;
		padding-right: 180px;
		padding-top:0;
	}
}

.journey-crm {
	background: url('assets/img/journey-crm.png') no-repeat center top;
	min-height: 150px;
	padding-bottom:45px;
	padding-top:120px;
	text-align:center;
}

@media screen and (min-width : 992px) {
	.journey-crm {
		background: url('assets/img/journey-crm.png') no-repeat top left;
		min-height: 150px;
		padding-top:0;
		padding-left: 150px;
		text-align:left;
	}
}

.journey-tracking {
	background: url('assets/img/journey-tracking.png') no-repeat;
	background-position: center top; 
	text-align: center;
	padding-top: 100px;
	padding-bottom: 25px;
}
/* ======== SECTION 11
   ================================== */
   
.blue-block {
	position: relative;
	background-color: #53B6B2;
	
}
.lime-block {
	background-color: #D3D95B;
	
}

.grey-block {
	background-color: #333333;
	
}
.red-block {
	background-color: #EB2E49;
}

.img-full{
	width:100%;
	height:auto;
}

.no-gutter > [class*='col-'] {
    padding-right:0;
    padding-left:0;
}

.center-vertical{
    top: 50%;
    transform: translateY(-50%);
    width:100%;
}






/* ======== SECTION 12 BRAND NAMES
   ================================== */
   
.brand-image {
	display: block;
    margin-left: auto;
    margin-right: auto;	
	padding-bottom: 50px;	
}

/* ================================== . STUDY PAGE ============================= */




#case-header {
	margin: 150px 0 25px 0;
}

.case-heading-lime {
	font-family: 'tenso', Helvetica, sans-serif;
	color: #D3D95B;
	text-align: left;
	font-weight: normal;
	font-size: 40px;
	line-height: 40px;
	padding-top: 0px;

}

.case-services {
	font-family: 'tenso', Helvetica, sans-serif;
	color: #fff;
	text-align: left;
	padding: 130px 75px 0px 150px;
	font-weight: normal;
	
}
.case-heading {
	font-size: 40px;
	line-height: 40px;
	padding-bottom: 10px;
	
}
.case-text {
	font-size: 18px;
	line-height: 24px;
}

.e-flow{
	background-color: #CBE8EC;
	align-content: center;
	padding: 50px 0;
}

.center-horizontially {
	margin-left: auto;
	margin-right: auto;
	display: block;
}

.case-contact{
	font-family: 'tenso', Helvetica, sans-serif;
	background-color: #EB2E49;
	color: #fff;
	text-align: center;
	font-size: 28px;
	line-height: 28px;
	padding: 150px 75px 150px 75px;
	
}

.case-contact-text {
	padding: 15px 0 15px 0;
}

.landing-hero {
	padding-left: 75px;
}

#landing-header {
	
	margin: 105px 0 0px 0;
	
}

.landing-question {
	padding-left: 275px;
}

.landing-contact{
	font-family: 'tenso', Helvetica, sans-serif;
	background-color: #EB2E49;
	color: #fff;
	text-align: left;
	font-size: 28px;
	line-height: 28px;
	padding: 75px 75px 150px 75px;
	
}

.landing-contact-text {
	padding: 15px 0 15px 0;
}
.landing-stats {
	font-family: 'tenso', Helvetica, sans-serif;
	color: #fff;
	text-align: left;
	padding: 130px 75px 25px 80px;
	font-weight: normal;
	
}

/* ================================== BRAND IDENTITY PROCESS PAGE ============================= */




#branding-identity {
	padding-top: 150px;
}
.identity-header {
	padding-top: 250px;
}

.page-title-green {
	font-size: 40px;
	line-height: 40px;
	padding: 25px 0 0 0px;
	color: #D3D95B;
}


/* ================================== PORTFOLIO PAGE 
============================= */


.portfolio-header {
	
		
}

.portfolio-menu {
	margin-top: 250px;
	
}

.portfolio-menu ul {
	list-style-type: none;
    margin: 0;
    padding: 0;
    text-align: center;
    
}
.portfolio-menu li {
    display: inline;
    padding-right: 50px;
    padding-left: 50px;
    font-size: 40px;
    
}

.portfolio-menu li:hover {
     color: #D3D95B;
    
}

/* ================================== Solutions & Services PAGE ============================= */

.solutions-page-header {
	padding: 250px 0 0 0;
}

@media screen and (min-width : 992px) {
	.solutions-page-header {
		padding: 250px 0 50px 0;
	}
}

.page-title {
	font-size: 40px;
	line-height: 40px;
	padding: 25px 0 0px 0px;
	color: #333;
}

.indentity-icon{
	margin-top:45px;
}

@media screen and (min-width : 992px) {
	.indentity-icon{
		margin-top: 150px;
	}
}

.solutions-icons {
	padding: 0 0 15px 0;
	display:block;
	margin:auto;
}

@media screen and (min-width : 992px) {
	.solutions-icons {
		margin:0;
	}
}

.solutions-brand {
	background-color: #D3D95B;
	padding: 45px 45px 15px;
}

@media screen and (min-width : 992px) {
	.solutions-brand {
		padding: 125px 0 75px 250px;
		min-height: 480px;
	}
}


.services-brand {
	background-color: #D3D95B;
	padding: 0 45px 45px;	
}

@media screen and (min-width : 992px) {
	.services-brand {
		background-color: rgba(211, 217, 91, 0.5);
		padding: 155px 0 75px 250px;		
		min-height: 480px;
	}
}

.solutions-web {
	background-color: #53B6B2;
	padding: 45px 45px 15px;
}

@media screen and (min-width : 992px) {
	.solutions-web {
		min-height: 480px;
		padding: 125px 0 75px 250px;
	}
}

.services-web {
	background-color: #53B6B2;
	padding: 0 45px 45px;	
}

@media screen and (min-width : 992px) {
	.services-web {
		background-color: rgba(83, 182, 178, 0.5);
		min-height: 480px;
		padding: 155px 0 75px 250px;
	}
}

.solutions-digital {
	background-color: #CBE8EC;
	padding: 45px 45px 15px;	
}

@media screen and (min-width : 992px) {
	.solutions-digital {
		min-height: 480px;
		padding: 125px 0 75px 250px;
	}
}

.services-digital {
	background-color: #CBE8EC;
	padding: 0 45px 45px;
}

@media screen and (min-width : 992px) {
	.services-digital {
		background-color: rgba(203, 232, 236, 0.5);
		min-height: 480px;
		padding: 155px 0 75px 250px;
	}
}

.solutions-channel {
	background-color: #DDE6A6;
	padding: 45px 45px 15px;
}

@media screen and (min-width : 992px) {
	.solutions-channel {
		background-color: #DDE6A6;
		min-height: 480px;
		padding: 125px 0 75px 250px;
	}
}

.services-channel {
	background-color: #DDE6A6;
	padding: 0 45px 45px;
}

@media screen and (min-width : 992px) {
	.services-channel {
		background-color: rgba(221, 230, 166, 0.5);
		min-height: 480px;
		padding: 155px 0 75px 250px;
		
	}
}

.solutions-crm {
	background-color: #EB2E49;
	padding: 45px 45px 15px;
}

@media screen and (min-width : 992px) {
	.solutions-crm {
		min-height: 480px;
		padding: 125px 0 75px 250px;	
	}
}

.services-crm {
	background-color: #EB2E49;
	padding: 0 45px 45px;
}

@media screen and (min-width : 992px) {
	.services-crm {
		background-color: rgba(235, 46, 73, 0.5);
		min-height: 480px;
		padding: 155px 0 75px 250px;
	}
}

.solutions-tracking {
	background-color: #53B6B2;
	padding: 45px 45px 15px;
}

@media screen and (min-width : 992px) {
	.solutions-tracking {
		min-height: 480px;
		padding: 125px 0 75px 250px;	
	}
}

.services-tracking {
	background-color: #53B6B2;
	padding: 0 45px 45px;
}

@media screen and (min-width : 992px) {
	.services-tracking {
		background-color: rgba(83, 182, 178, 0.5);
		min-height: 480px;
		padding: 155px 0 75px 250px;
	}
}

.solutions-graphic {
	background-color: #D3D95B;
	padding: 45px 45px 15px;
}

@media screen and (min-width : 992px) {
	.solutions-graphic {
		background-color: #D3D95B;
		min-height: 480px;
		padding: 125px 0 75px 250px;	
	}
}

.services-graphic {
	background-color: #D3D95B;
	padding: 0 45px 45px;
}

@media screen and (min-width : 992px) {
	.services-graphic {
		background-color: rgba(211, 217, 91, 0.5);
		min-height: 480px;
		padding: 155px 0 75px 250px;
	}
}



/* ==== MEDIA QUERIES ==== */

@media screen and (max-width : 768px) {
	.case-services {
		padding: 75px 75px 75px 75px;
	}
	
	.case-contact-input {
		margin: 5px 0 5px 0;
	}

	.inner-container {
		margin: 50px 75px 0px 75px;	
	}
	#hero {
		min-height: 600px;
	}
	
}

.nf-field-container{
	clear:none !important;
}

@media screen and (min-width : 1024px) {
	nf-field{
		display:inline-block;
	}
}

#nf-field-11{
	border:0;
	background:none;
}

#nf-field-8-wrap,
#nf-field-9-wrap,
#nf-field-10-wrap{
	color:#000;
	margin:0 5px;
}

#nf-field-11-wrap{
	position:relative;
	top:10px;
	margin-left:10px;
}

/* ================================== DD PAGE ============================= */

.dd-button {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
}


/* ============================================= IMG HOVER ==== */


/* ============================================= BG Images ==== */
.elevate-content{
	position:relative;
	z-index:100;
}

.bg-images{
    margin:0;
    padding:0;
    list-style-type:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
}

.bg-images li{
    position:fixed;
    top:0;
    left:0;
    width:100%;
}

.bg-images li:nth-of-type(1){
    z-index:10 !important;
}

.bg-images li:nth-of-type(2){
    z-index:9;
}

.bg-images li:nth-of-type(3){
    z-index:8;
}



/*--------------------------------------------------------------
## Sidebar Contact
--------------------------------------------------------------*/
.side-fixed-contact{
	background:url(assets/img/side-contact-bg.png) no-repeat;
	font-family:'tenso', Helvetica, sans-serif;
	position:fixed;
	right:-352px;
	top:20%;
	padding:140px 30px 80px 140px;
	z-index:200;
	width:352px;
	height:471px;
    -webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
}


	.side-fixed-contact{
		top:40%;
	}


.side-contact-visible{
	right:0;
}


.side-fixed-contact-heading{
	color:#FFF;
	font-size:28px;
	line-height:32px;
	margin-bottom:10px;
	text-align:right;
}

.side-fixed-contact input[type=text],
.side-fixed-contact input[type=email]{
	border:0;
	padding:6px;
	margin-bottom:15px;
	width:100%;
}

.side-fixed-contact input[type=email]{
	margin-bottom:5px;
}

.side-fixed-contact input[type=button]{
	background:none;
	border:0;
	color:#FFF;
	font-size:32px;
	font-family:'tenso', Helvetica, sans-serif;
	padding:0;
	text-transform:uppercase;
	float:right;
}

.side-fixed-contact-cta{
	background:url(assets/img/side-contact-bg.png) no-repeat center left;
	border:0;
	color:#FFF;
	font-family:'tenso', Helvetica, sans-serif;
	font-size:18px;
	line-height:20px;
	position:fixed;
	text-transform:uppercase;
	right:-300px;
	padding-right:35px;
	text-align:right;
	top:80%;
	width:120px;
	height:120px;
	z-index:200;
    -webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
}

.side-fixed-contact-cta-visible{
	right:-30px;
}

.side-fixed-contact-heading-close{
	background:none;
	border:0;
	position:absolute;
	top:35px;
	right:15px;
	color:#FFF;
	font-family:'tenso', Helvetica, sans-serif;
	font-size:18px;
}

.side-fixed-contact .nf-form-title,
.side-fixed-contact .nf-before-form-content{
	display:none;
}

.side-fixed-contact nf-field{
	width:100%;
}

.nf-field-container, #ninja_forms_required_items{
	margin-bottom:0 !important;
}

.side-fixed-contact .nf-response-msg{
	color:#FFF;
	text-align:right;
}

.nf-field-label {
	color: #fff;
	
}

/*--------------------------------------------------------------
## Helpers
--------------------------------------------------------------*/

.relative{
	position:relative;
}

.light-bg{
	background:#FFF;
}

@media screen and (min-width : 1024px) {
	.cover{
		background-size:cover;
	}
}

@media screen and (max-width : 991px) {
	.page-template-page-home .row{
		margin:0;
	}
}

.nf-error-msg {
	color: #fff !important;
	font-size: .5em !important;
	
}
/*--------------------------------------------------------------
## Landing Page
--------------------------------------------------------------*/
.landing-stats h2 {
	font-size:3em; 
	color: #333;
}

.eye-block {
	background:url('assets/img/BX-eye-720x480.png') no-repeat fixed;
	background-size:cover;
	min-height: 950px;
	position: relative;
	width: 100%;
	padding-left: 0px;	
	margin-left: 0px;
	color: black;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizelegibility;
	overflow:hidden
}