﻿/*
@import url('small.css') screen and (min-width: 768px);
@import url('medium.css') screen and (min-width: 980px);
@import url('large.css') screen and (min-width: 1200px);
@import url('huge.css') screen and (min-width: 1500px);
*/
@media screen and (max-width: 500px){
	#connect, #top-nav {
	    width: 49%;
	    display: inline-block;
	    margin: 0 0;
	    height: auto;
	}

	#connect{
	    text-align: center;
	}

	#sm-icons{
		white-space:nowrap;
		display: block;
		width: 100%;
	}

	#top-nav ul{
		line-height: 1.1rem;
	}
}
@media screen and (min-width: 500px) and (max-width: 767px){
	#connect, #top-nav {
	    width: 49%;
	    display: inline-block;
	    margin: 0 0;
	    height: auto;
	}
	#connect{
	    text-align: center;
	}
}
@media screen and (min-width: 768px) {
	#site {
		height: 40px;
	}
		#site h1 {
			font-size: 24px;
			text-align: left;
			padding-left: 15px;
		}
	#connect {
		text-align: right;
		height: 40px;
	}
		#connect > div {
			padding-right: 15px;
		}
	#top-nav {
		display: block;
		height: auto;
	}
		#topnav {
			margin-top: 14px;
			margin-right: 15px;		
		}
	#logo {
		text-align: left
	}
		#logo a {
			padding-left: 15px;
		}
	#main-nav.navbar {
		font-size: 12px;
	}
		#main-nav .nav > li > a {
			padding-right: 5px;
			padding-left: 5px;
		}
		#main-nav.navbar .nav > li.active .indicator,
		#main-nav.navbar .nav > li.parent-active .indicator {
			display: block;
		}
		#main-nav.navbar .nav > li.active.open .indicator {
			display: none
		}
	#search-form {
		text-align: right;
		margin-bottom: 15px;
		padding-right: 15px;
	}
	#main-callouts .main-callout .callout-teaser {
		height: 30%;
	}
	#content {
		font-size: 15px;
	}
		#content .case-study img {
			float: left;
			margin: 0 8px 0 0;
			text-align: left;
			border-right: 5px solid #FFF;
			z-index: 99;
			max-width: 200px;
		}
		#content .case-study .case-study-teaser {
		/*	padding: 5px;*/
			font-size: 11px;
		}
		#content .case-study h4 {
			font-size: 13px;
			margin-bottom: 3px;
		}
		#content .case-study a.more {
			text-align: right;
			padding-right: 8px;
			line-height: 21px;
			height: 21px;
		}
		#content #map-canvas {
			height: 300px;
		}
	#left-nav {
		margin-top: 38px;
	}
	#sidebar {
		margin-top: 38px;
	}
		#home #sidebar {
			padding-top: 15px;
		}
		#sidebar .callout {
			height: 305px;
		}
	#ft {
		font-size: 13px;
	}
}
@media screen and (min-width: 980px) {
	#site h1 {
		font-size: 26px;
	}
	#main-nav.navbar {
		font-size: 13px;
	}
		#main-nav .nav > li > a {
			padding-right: 12px;
			padding-left: 12px;
		}
	#left-nav-menu.nav > li > a {
		font-size: 12px;
	}
	#main-callouts .main-callout .callout-teaser {
		height: 35%;
	}
	#content {
		font-size: 16px;
	}
		#content .alignleft,
		#content img.alignleft {
			display: block;
			float: left;
			margin-left: 0;
			margin-right: 10px;
			margin-top: 0px;
			margin-bottom: 10px;
			max-width: 50%;
			text-align: left;
		}
		#content .alignright,
		#content img.alignright {
			display: block;
			float: right;
			margin-left: 10px;
			margin-right: 0;
			margin-top: 0px;
			margin-bottom: 10px;
			max-width: 50%;
			text-align: left;	
		}
		#content #map-canvas {
			height: 350px;
		}
	#sidebar .callout {
		height: auto;
	}
	#ft {
		font-size: 14px;
	}
}
@media screen and (min-width: 1200px) {
	#site h1 {
		font-size: 30px;
		padding-left: 0;
	}
	#connect > div {
		padding-right: 0;
	}
	#logo {
		right: 0;
	}
		#logo a {
			padding-left: 0;
		}
		#logo img {
			margin: 41px 0 0;
			width: 175px;
		}
	#top-nav {
		left: 0;
	}
		#topnav {
			margin-top: 7px;
		}
	#main-nav.navbar {
		font-size: 14px;
	}
		#main-nav .nav > li > a {
			padding-right: 9px;
			padding-left: 9px;
		}
	#left-nav-menu.nav > li > a {
		font-size: 13px;
	}
	#main-callouts .main-callout .callout-teaser {
		height: 30%;
	}
	#content {
		font-size: 17px;
	}
		#content .page-hdr {
			margin: 0 -1.5% 15px -1.5%;
			width: 103%;
		}
		#content .case-study img {
			max-width: 300px;
		}
		#content .case-study .case-study-teaser {
			font-size: 13px;
		}
		#content .case-study h4 {
			font-size: 16px;
		}
		#content #map-canvas {
			height: 400px;
		}
	#sidebar .tile .service-inner {
		min-height: 150px;
	}
		#sidebar .tile .service-inner h4 {
			font-size: 13px;
		}	
}
@media screen and (min-width: 1500px) {
	#logo img {
		margin-top: 39px;
		width: auto;
	}
	#main-nav.navbar {
		font-size: 16px;
	}
		#main-nav .nav > li > a {
			padding-right: 13px;
			padding-left: 13px;
		}
	#main-callouts .main-callout .callout-teaser {
		height: 24%;
	}
	#left-nav-menu.nav > li > a {
		font-size: 14px;
	}
	#content .case-study img {
		max-width: 350px;
	}
	#content .case-study a.more {
		line-height: 23px;
		height: 23px;
	}
	#content #map-canvas {
		height: 500px;
	}
	#sidebar .tile .service-inner h4 {
		font-size: 14px;
	}
	#sidebar .callout img {
		float: left;
		margin: 0 8px 0 0;
		text-align: left;
		border-right: 5px solid #FFF;
		z-index: 99;
		max-width: 200px;
	}
	#sidebar .callout .callout-teaser {
		padding: 5px 5px 0 5px;
		font-size: 12px;
		height: 108px;
	}
	#sidebar .callout h4 {
		font-size: 14px;
		margin-bottom: 3px;
	}
	#sidebar .callout a.more {
		text-align: right;
		padding-right: 8px;
		line-height: 23px;
		height: 23px;
	}	
}