/* ==========================================================================
	#Media Queries
========================================================================== */

.featured.show-sm { display:none; }

/* Small devices (tablets, 768px and up) */
@media ( max-width: 767px) {

	/* ==========================================================================
		#Base
	========================================================================== */
	h2 { font-size: 23px; text-align: center; }

	/* ==========================================================================
		#Icons
	========================================================================== */
	.icon-subscribe,
	.icon-search,
	.icon-facebook,
	.icon-twitter,
	.icon-linkedin,
	.icon-googleplus,
	.icon-rss,
	.icon-jobs,
	.icon-email { background: url(images/sprite-mobile.png) 0 0 no-repeat; }

	.icon-search{ width: 29px; height: 29px; background-position: -36px -68px; text-indent: -9999px; }
	.icon-search:hover {background-position: -36px -158px;}

	.icon-facebook,
	.icon-twitter,
	.icon-linkedin,
	.icon-rss,
	.icon-googleplus { width: 29px; height: 29px; margin: 0 10px; text-indent: -9999px; }

	.icon-facebook { background-position: -96px -68px; }
	.icon-facebook:hover { background-position: -96px -158px; }
	.icon-twitter { background-position: 0 -98px; }
	.icon-twitter:hover { background-position: 0 -188px; }
	.icon-linkedin { background-position: -30px -98px; }
	.icon-linkedin:hover { background-position: -30px -188px; }
	.icon-rss { background-position: -60px -98px; }
	.icon-googleplus { background-position: -90px -98px; }

	.icon-jobs,
	.icon-email { width: 42px; height: 28px; text-indent: -9999px; }

	.icon-jobs { background-position: 0 -128px; }
	.icon-jobs:hover { background-position: 0 -218px; }
	
	.icon-email { background-position: -43px -128px; }
	.icon-email:hover { background-position: -43px -218px; }

	.icon-plus { display: inline-block; }

	/*tfa adding instagram, not in the sprite*/
	.icon-instagram { background: url(images/GIN-instagram.gray.mobile.png); background-size: 31px 31px; width:29px; height:29px; margin: 0 10px; background-position: -2px -2px; background-repeat: no-repeat; }

	/* ==========================================================================
		#Header
	========================================================================== */
	.header { border-bottom: 0; }
	.header .container { position: relative; height: 72px; }
	.logo { width: 135px; margin-top: 6px; }
	.logo a { height: 67px; background: url(images/sprite-mobile.png) 0 0 no-repeat; }

	.header .socials { display: none; }
	.form-subscribe .field { display: none; }
	
	.header-bar { padding: 29px 46px 0 0; }
	
	.form-subscribe { margin: 0; }
	.search { margin: 0; margin-left: 9px; padding-top:  0; }

	.nav-toggle { display: inline-block; }
	.nav { z-index: 3; position: absolute; top: 29px; right: 10px; margin-top: 0; }
	.nav ul { display: none; position: absolute; top: 35px; right: 0; }
	.nav li { float: none; }
	.nav a { display: block; padding: 5px 20px; background: #606758; color: #fff; }

	/*hide this in the header on small screens; show in footer*/
	.header .icon-subscribe {display:none;}

	/* ==========================================================================
		#Main
	========================================================================== */
	.main { padding: 0 0 300px; }
	.main-head .log-in { top: -7px; font-size: 23px; }
	.pagination { display: none; }

	.sidebar { margin: 0 -10px; }
	.main-head.focus, .main-head.focus h2 { margin-left: -5px; margin-right:  -5px; }
	.main-head.focus h2 { padding: 12px 11px 10px; background: #ef9e1f; color:  #ffffff; margin-top:22px;}
	.main-head.focus h2 a { color:  #ffffff; }
	.main-head.focus .widget-content { display: none; width: 100%; text-align: center; position: relative; z-index: 2; top: 4px; left: 0; width: 100%; padding-bottom: 15px; background: #fff; }

	/*TA, to fix footer overflow, increase padding on main*/
	.main { padding: 28px 0 300px;}

	/* ==========================================================================
		#Widgets
	========================================================================== */
	.widgets { position: relative; }
	.widget-services .icon-arrow,
	.widget-solutions .icon-arrow,
	.widget-communications .icon-arrow,
	.widget-products .icon-arrow { display: none; }

	.widget-services,
	.widget-solutions,
	.widget-communications,
	.widget-products { padding-bottom: 8px; }

	.widget-services ul,
	.widget-solutions ul,
	.widget-communications ul,
	.widget-products ul { font-size: 18px; display: none; }

	.widget-services .widgettitle,
	.widget-solutions .widgettitle,
	.widget-communications .widgettitle,
	.widget-products .widgettitle { padding: 12px 11px 10px; text-align: center; cursor: pointer; }
	
	.widget-filter.focus {display: none;}
	.widget-filter .icon-toggle { display: none; }
	.widget-filter .widgettitle { padding: 9px 7px 5px; text-align: center; cursor: pointer; }
	.widget-filter { float: left; }
	.widget-filter1 { width: 25%; }
	.widget-filter2 { width: 34%; }
	.widget-filter3 { width: 23%; }
	.widget-filter4 { width: 15%; }

	.widget-filter .widget-content { position: relative; z-index: 2; top: 14px; left: 0; width: 100%; padding-bottom: 15px; background: #fff; }
    .widget-filter .checkbox { padding-left: 44px;}

	.widget-filter ~ .widget-filter { margin-left: 3px; }

	/* ==========================================================================
		#Services
	========================================================================== */
	.services { font-size: 21px; }
	.services h3 { text-align: center; }

	.services .more { background-position: right 9px; }
	.services .description { margin-bottom: 20px; }
	.services .latest-work { margin:  0 0 25px; }
	.services .view-projects a { float: none; }
	.services .bx-controls-direction,
	.latest-work.project-search .bx-controls-direction {
		bottom: 185px;
		position: relative;
	}
	.services .bx-controls-direction .bx-prev,
	.latest-work.project-search .bx-prev {
		left: -10px;
	}
	.services .bx-controls-direction .bx-next,
	.latest-work.project-search .bx-next {
		right: -10px;
	}

	/* ==========================================================================
		#Intro
	========================================================================== */
	.intro { padding: 6px 0 7px; }
	.intro h2 { padding-bottom: 11px; font-size: 17px; }
	.intro img { display: none; }
	.intro strong,
	.intro span { font-size: 23px; line-height: 0.91; }
	.intro strong { text-transform: uppercase; }
	.intro .col-md-4 { margin-bottom: 2px; }
	.intro .text { margin: 0 -10px; padding: 15px 10px 10px; }

	/* ==========================================================================
		#Featured
	========================================================================== */
	.featured h2 { margin: 0; }
	.featured-head {margin-top: 10px;}
 	.featured { position: relative; padding-bottom: 10px; }
 	.featured .a-col {margin: 0 10px;}

	.featured .more { position: static; text-transform: uppercase; }
	.featured h4 { font-size: 18px; }
	.featured .text { height: 50px; padding: 15px 6px 0; }

	.bx-prev,
	.bx-next { position: absolute; top: 50%; margin-top: -30px; width: 31px; height: 38px; font-size: 0; line-height: 0; text-indent: -4000px; background-size: contain; background-repeat: no-repeat;}

	.bx-prev { background-image: url(images/arrow_left.png);  left: 0; }
	.bx-next { background-image: url(images/arrow_right.png); right: 0; }
	.bx-pager { font-family: 'Gotham Narrow Bold', sans-serif; color: #a0b94b; text-align: center; }

	.featured.hide-md { display:none; }
 	.featured.show-sm { display:block; }
	
	/* ==========================================================================
		#Featured
	========================================================================== */
	.newsletter-archive td > span, .newsletter-archive th > span {
		padding-left: 0;
	}
	.newsletter-archive td:first-child, .newsletter-archive th:first-child {
		text-align: left;
	}
	.newsletter-archive td, .newsletter-archive th {
		font-size: .9em;
		line-height: 1.2em;
		padding-bottom: 14px;
	}
	
	/* ==========================================================================
	#Search
	========================================================================== */
	
	form#new-search {
		padding-bottom: 20px;
	}
	.work-search > input {
		margin-bottom: 5px;
		height: 28px;
	}
	
	/* ==========================================================================
		#Story
	========================================================================== */
	.story { padding: 0 5px; font-size: 17px; }

	/* ==========================================================================
		#Latest Work / Project Single
	========================================================================== */
	.latest-work { display: none; margin-left:0; }
	.latest-work h4 { font-size: 20px; }
	.latest-work .row { padding-bottom: 0; }
	.latest-work .col-md-4 { margin-bottom: 10px; }
	.latest-work .col-md-4 { padding: 0; margin-left: 10px!important; }
	.latest-work .row > div { clear: none!important; text-align: center; }
	
	.project .image-holder, .project .image-gallery { display: none; }
	.project .image-gallery > div {
		clear: none!important;
		text-align: center;
		margin-bottom: 10px;
		padding: 0; margin-left: 15px!important;
	}
	.project .content > div:first-child {
		position: relative; margin: 0 -10px;
	}
	.project .content .col-md-8 { margin-top: 14px; }
	
	.params {
		margin-bottom: 10px;
	}
	.params span {
		line-height: 1.5em;
	}
	.project .content {
		padding-left: 0;
		margin-top:1.3em;
	}
	.content .services, .content .focus {
		margin-left: -11px;
	}
	/* ==========================================================================
		#Footer
	========================================================================== */
	.footer { border-top-width: 8px; text-align: center; }
	.footer .container { height: 260px; padding-top: 24px; }
	.footer h5 { display: block; padding-bottom: 3px; margin: 0; }
	.footer-logo { display: none; }

	.footer-links,
	.address { float: none; }

	.address { padding: 0 45px; margin: 0; }

	.footer .socials { display: block; padding-bottom: 28px; }

	/*.footer-links { margin-top: 24px; }*/
	table.footer-links td {padding-left: 1px; padding-right: 1px;}
	table.footer-links { float: none; margin: 24px auto 0;}

	.footer .icon-subscribe { display:block; position:static; width: 31px; height: 25px; background: url(images/sprite24.png) -17px 0 no-repeat; }
    .footer .icon-subscribe:hover { background: url(images/sprite24.png) -49px 0 no-repeat; }

	/* ==========================================================================
		#Retina
	========================================================================== */
	@media (-webkit-min-device-pixel-ratio: 2), (min--moz-device-pixel-ratio: 2), (-o-min-device-pixel-ratio: 2/1), (min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 2dppx) {
		
		.icon-subscribe,
		.icon-search,
		.icon-facebook,
		.icon-twitter,
		.icon-linkedin,
		.icon-rss,
		.icon-googleplus,
		.nav-toggle,
		.icon-jobs,
		.icon-email,
		.logo a { background-image: url(images/sprite-mobile@2x.png); background-size: 135px 156px; }

	}

}
