@media (max-width: 1024px) {
	
	/* ==========================================================================
   General
   ========================================================================== */
	.intro-screen h2{font-size: 6.1vw;}
}



@media (max-width: 960px) {
	/* ==========================================================================
   Partners
   ========================================================================== */

	.partners > div:nth-child(3),
	.partners > div:nth-child(7),
	.partners > div:nth-child(11),
	.partners > div:nth-child(15),
	.partners > div:nth-child(19),
	.partners > div:nth-child(23),
	.partners > div:nth-child(27)
	
	
	
	
	 {
		border-left: 2px solid transparent
	}
	/* ==========================================================================
   Same Height
   ========================================================================== */

	.same-height h4 {
		font-size: 16px
	}
	.same-height h4:first-child {
		margin-bottom: 20px;
		font-size: 24px
	}
	.same-height > .white-bg > div {
		padding: 35px
	}
	/* ==========================================================================
   Sticky Image disabled at < 960px
   ========================================================================== */

	.sticky-outer-wrap {
		height: auto!important;
		padding-top: 80px
	}
	.sticky-screen-wrap.width60,
	.sticky-screen-wrap {
		position: static;
		width: 100%
	}
	.sticky-screen {
		position: static!important
	}
	.sticky-slide-wrapper,
	.sticky-slide,
	.sticky-slide > div {
		display: block;
		width: 100%!important
	}
	.sticky-slide > .spacer {
		display: none
	}
	.sticky-slide p,
	.sticky-slide h2,
	.sticky-slide h4 {
		text-align: center
	}
}
@media (max-width: 767px) {
	/* ==========================================================================
   General
   ========================================================================== */

	h4 {
		font-size: 24px;
		margin-bottom: 20px
	}
	.half h2,
	h2,
	h3 {
/* 		font-size: 24px */
	}
	#grid,
	.row {
		margin-left: 0;
		margin-right: 0
	}

	/* ==========================================================================
   Top menu
   ========================================================================== */

	.top-menu {
		height: 70px;
		overflow: hidden
	}
	.top-menu-toggle {
		top: 15px;
		right: 15px;
		width: 40px;
		height: 40px
	}

	.top-menu-toggle:after {
		height: 39px;
		width: 39px;
	}



	.logo {
		width: 120px;
		left: 15px;
		top: 15px
	}
	.top-menu-toggle span.f {
		top: 15px;
		left: 8px
	}
	.top-menu-toggle span.s {
		top: 20px;
		left: 8px
	}

/* 	.top-menu-toggle:hover span.f {top: 14px;}
	.top-menu-toggle:hover span.s {top: 21px;} */

	.active .top-menu-toggle span.f {
		top: 18px
	}
	.active .top-menu-toggle span.s {
		top: 18px
	}

	.active .top-menu-toggle:hover span.f {top: 18px;}
	.active .top-menu-toggle:hover span.s {top: 18px;}
	
	.intro-screen > div > a{    margin-left: -18px; width: 36px;}
	/* ==========================================================================
   Intro - Hero Image
   ========================================================================== */

	.intro-screen > div {
		padding: 20px
	}
	/* ==========================================================================
   List Items
   ========================================================================== */

	.list-item a> > div > span {
		padding: 25px 25px 40px
	}
	.list-item.text h3 {
		padding: 25px 15px
	}
	.list-item h4 {
		margin-bottom: 10px
	}
	/* ==========================================================================
   Content
   ========================================================================== */

	.content {
		padding-top: 80px
	}
	.section {
		padding-top: 30px;
		padding-bottom: 30px
	}
	/* ==========================================================================
   Same Height
   ========================================================================== */

	.same-height > div {
		display: block;
		height: auto;
		float: left;
		background: transparent;    padding: 0 35px;
	}
	.same-height.lg > div > div {
		padding: 40px 30px
	}
	/* ==========================================================================
   Contact Map
   ========================================================================== */

	.map {
		position: static;
		height: 234px;
		padding: 0!important
	}
	.directions {
		font-size: 16px;
		bottom: 25px
	}
	.section.contact-map{  padding-bottom: 0;  padding-top: 0;}
	/* ==========================================================================
   Contact
   ========================================================================== */

	.vertical-container{
		display: -webkit-box;
	    display: -moz-box;
	    display: box;
	    
	    -webkit-box-orient: vertical;
	    -moz-box-orient: vertical;
	    box-orient: vertical;
	}
	.blockA {
	    -webkit-box-ordinal-group: 2;
	    -moz-box-ordinal-group: 2;
	    box-ordinal-group: 2;
	}
	
	.vertical-container	.mobile-padding-vertical-0{
		padding-top:0px;
		padding-bottom: 0px;
	}
	
	.vertical-container .mobile-margin-bottom-0{
		margin-bottom: 0px;
	}
	#google-map{
		margin-bottom: 0px;
		height: 75vh;
	}
	/* ==========================================================================
   History Group
   ========================================================================== */

	.owl-item {
		text-align: center;
		padding: 15px 0
	}
	.owl-item .history-item {
		display: inline-block;
		width: 260px
	}
	.owl-item .history-item > div {
		padding: 20px 10px
	}
	.owl-item .history-item span {
		opacity: 1!important;
		left: 0;
		right: 0
	}
	.owl-item .history-item h4,
	.owl-item .history-item p {
		color: #fff!important
	}
	/* ==========================================================================
   Features
   ========================================================================== */

	.owl-item .feature-item {
		display: inline-block;
		width: 260px
	}
	/* ==========================================================================
   People
   ========================================================================== */

	.people > div {
		margin-bottom: 55px
	}
	.people h4 {
		margin-top: 25px;
		margin-bottom: 20px
	}
	/* ==========================================================================
   Footer
   ========================================================================== */

	.social-icons {
		text-align: center
	}

	.btn-social {
		text-align: center;
	}

	.copyright {
		margin-top: 30px;
		text-align: center
	}
}
@media (min-width: 961px) {
	/* ==========================================================================
   Top menu
   ========================================================================== */

	.navigation li a {
		font-size: 46px
	}
}
@media (min-width: 768px) {
	/* ==========================================================================
   List Items
   ========================================================================== */

	.margin-top-spacer {
		margin-top: 200px
	}
}
@media screen and (max-width: 768px) {
	/* ==========================================================================
   Salvattore Data-Grid
   ========================================================================== */

	#grid[data-columns]::before {
		content: '1 .column.size-1of1';
		opacity: 0;
		visibility: hidden;
	}

	/* ==========================================================================
   Top menu
   ========================================================================== */

	.navigation li a {
	  font-size: 66px;
	}


/* ==========================================================================
   List Items
   ========================================================================== */

	.list-item h3 {
	  font-size: 21px
	}


	.list-item > a> div > span {
		padding: 30px 30px;
	}

	.list-item h4 {
		font-size: 15px;
	}


	/* ==========================================================================
   Flexbox for swaping order on projects
   ========================================================================== */
	.section.text-left-imac-right .row, .section.mobile-right-text-left .row {
/*
		display: flex;
		flex-direction : column-reverse;
*/
	  display: -webkit-box;
	  display: -moz-box;
	  display: -ms-flexbox;
	  display: -webkit-flex;
	  display: flex; 
	  -webkit-flex-flow: row wrap;
	}

	.section.text-left-imac-right .row > div , .section.mobile-right-text-left .row > div{
		width: 100%;
		float: left;
		
	}
	
	.section.text-left-imac-right .text, .section.text-left-imac-right .col-sm-3, .section.mobile-right-text-left .col-sm-3 {
		order:2;
	}
	.section.text-left-imac-right .mac, .section.text-left-imac-right .col-sm-7, .section.mobile-right-text-left .col-sm-7 {
		order:1;	
	}
	

}


@media screen and (min-width: 768px) {
	/* ==========================================================================
   Salvattore Data-Grid
   ========================================================================== */

	#grid[data-columns]::before {
		content: '2 .column.size-1of2';
		opacity: 0;
		visibility: hidden;
	}
	
	#grid, .row{    padding-left: 20px;
    padding-right: 20px;margin: auto;}
    
    .cta-v2 h5{    
	    font-size: 39px;
	    line-height: 39px;
	    margin: 0 0 30px 0;}
}


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

	/* ==========================================================================
   Top menu
   ========================================================================== */

	.navigation li a {
	  font-size: 46px;
	}
	.half h2, h2, h3{
		font-size: 24px;
	}
	.cta-v2 h5{
		font-size: 30px;
		margin: 0 0 30px 0;
		line-height: 36px;
	}
}

@media screen and (max-width: 320px) {
	.active .navigation{
		top:54%;
	}
	.navigation li a {
	  font-size: 27px;
	  padding: 5px 0px;
	}
	.navigation li a.smallmenu{
		font-size: 18px !important;;
	}
}
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {

	/* ==========================================================================
   Top menu
   ========================================================================== */

	.navigation li a {
	  font-size: 56px;
	}
	


}

/*  V large screen  */
@media only screen and (min-width : 1280px) {
	.intro-screen h2 {
		font-size: 91px;
	}
		
}



/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
	.intro-screen h2 {
		font-size: 4.5vw;
	}


}

/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
	.content {
		padding-top: 30px;
	}
}


/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
	.intro-screen h2 {
		font-size: 7.1vw;
	}

	.intro-screen.static h2 {
		font-size: 8.2vw;
	}

	.section.project-overview h3 br {
		display: none;
	}

	.content {
		padding-top: 60px;
	}

	.trans-bg-white-text h5 {
		font-size: 20px;
		margin-bottom: 0;
	}

	.trans-bg-white-text > div > div {
		margin-bottom: 0;
	}

	.section.solution h6 {
		font-size: 20px;
	}

	.section.relationship {
		padding-top: 50px;
	}

	.section.relationship br {
		display: none;
	}

	.section.about-intro br {
		display: none;
	}

	h3:last-child {
		padding-bottom: 0;
		margin-bottom: 0;
	}
}
/* fixing font issue when text goes outside homepage boxes */
@media only screen and (max-width : 1024px){
	.list-item h3 {
		font-size: 21px;
	}	
	.list-item h4 {
		font-size: 15px;
	}
}


.section.footer, .section.full-bg-img{border-bottom:none;}
.section.contact-map { padding-bottom: 0;}