/*
Theme Name: imaginaryoffice
Theme URI: http://imaginaryoffice.com/
Author: Imaginary Office
Author URI: http://imaginaryoffice.com/
Description: built upon BlankSlate version 4.0.3
Version: 1.0
imaginaryoffice WordPress Theme © 2015 Imaginary Office
*/

/* clearfix */
.group:after {
  content: "";
  display: table;
  clear: both;
}

/* Atlas licensed webfonts */

@font-face {
  font-family: 'Atlas Grotesk Web';
  src: url('fonts/AtlasGrotesk-MediumItalic-Web.eot');
  src: url('fonts/AtlasGrotesk-MediumItalic-Web.eot?#iefix') format('embedded-opentype'),
       url('fonts/AtlasGrotesk-MediumItalic-Web.woff2') format('woff2'),
       url('fonts/AtlasGrotesk-MediumItalic-Web.woff') format('woff');
  font-weight:  500;
  font-style:   italic;
  font-stretch: normal;
}

.AtlasGrotesk-MediumItalic-Web {
  font-family: 'Atlas Grotesk Web';
  font-weight:  500;
  font-style:   italic;
  font-stretch: normal;
}

@font-face {
  font-family: 'Atlas Grotesk Web';
  src: url('fonts/AtlasGrotesk-Medium-Web.eot');
  src: url('fonts/AtlasGrotesk-Medium-Web.eot?#iefix') format('embedded-opentype'),
       url('fonts/AtlasGrotesk-Medium-Web.woff2') format('woff2'),
       url('fonts/AtlasGrotesk-Medium-Web.woff') format('woff');
  font-weight:  500;
  font-style:   normal;
  font-stretch: normal;
}

.AtlasGrotesk-Medium-Web {
  font-family: 'Atlas Grotesk Web';
  font-weight:  500;
  font-style:   normal;
  font-stretch: normal;
}

@font-face {
  font-family: 'Atlas Grotesk Web';
  src: url('fonts/AtlasGrotesk-RegularItalic-Web.eot');
  src: url('fonts/AtlasGrotesk-RegularItalic-Web.eot?#iefix') format('embedded-opentype'),
       url('fonts/AtlasGrotesk-RegularItalic-Web.woff2') format('woff2'),
       url('fonts/AtlasGrotesk-RegularItalic-Web.woff') format('woff');
  font-weight:  400;
  font-style:   italic;
  font-stretch: normal;
}

.AtlasGrotesk-RegularItalic-Web {
  font-family: 'Atlas Grotesk Web';
  font-weight:  400;
  font-style:   italic;
  font-stretch: normal;
}

@font-face {
  font-family: 'Atlas Grotesk Web';
  src: url('fonts/AtlasGrotesk-Regular-Web.eot');
  src: url('fonts/AtlasGrotesk-Regular-Web.eot?#iefix') format('embedded-opentype'),
       url('fonts/AtlasGrotesk-Regular-Web.woff2') format('woff2'),
       url('fonts/AtlasGrotesk-Regular-Web.woff') format('woff');
  font-weight:  400;
  font-style:   normal;
  font-stretch: normal;
}

.AtlasGrotesk-Regular-Web {
  font-family: 'Atlas Grotesk Web';
  font-weight:  400;
  font-style:   normal;
  font-stretch: normal;
}

@font-face {
  font-family: 'Atlas Grotesk Web';
  src: url('fonts/AtlasGrotesk-LightItalic-Web.eot');
  src: url('fonts/AtlasGrotesk-LightItalic-Web.eot?#iefix') format('embedded-opentype'),
       url('fonts/AtlasGrotesk-LightItalic-Web.woff2') format('woff2'),
       url('fonts/AtlasGrotesk-LightItalic-Web.woff') format('woff');
  font-weight:  300;
  font-style:   italic;
  font-stretch: normal;
}

.AtlasGrotesk-LightItalic-Web {
  font-family: 'Atlas Grotesk Web';
  font-weight:  300;
  font-style:   italic;
  font-stretch: normal;
}

@font-face {
  font-family: 'Atlas Grotesk Web';
  src: url('fonts/AtlasGrotesk-Light-Web.eot');
  src: url('fonts/AtlasGrotesk-Light-Web.eot?#iefix') format('embedded-opentype'),
       url('fonts/AtlasGrotesk-Light-Web.woff2') format('woff2'),
       url('fonts/AtlasGrotesk-Light-Web.woff') format('woff');
  font-weight:  300;
  font-style:   normal;
  font-stretch: normal;
}

.AtlasGrotesk-Light-Web {
  font-family: 'Atlas Grotesk Web';
  font-weight:  300;
  font-style:   normal;
  font-stretch: normal;
}

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{font-size:100%;font:inherit;font-family: 'Atlas Grotesk Web', sans-serif;padding:0;border:0;margin:0;vertical-align:baseline}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
.clear{clear:both}
.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}


body {
	background: #ffffff;
	-moz-font-feature-settings: "liga", "kern"; 
	-moz-font-feature-settings:"liga=1, kern=1";
	-ms-font-feature-settings:"liga", "kern";
	-o-font-feature-settings:"liga", "kern";
	-webkit-font-feature-settings:"liga", "kern";
	font-feature-settings: "liga", "kern";
}
html {
	font-size:14px;
	margin-top: 0;
	}	
h1, h2, h3, h4, p, ul, li {
	font-family: 'Atlas Grotesk Web', sans-serif;
	font-weight:400;
	color:#000;
	list-style-type:none;
	text-decoration: none;
	text-align:left;
	margin:0;
	padding:0 0 15px 0;
	line-height:1.3;
	}
p, ul, li {
	font-family: 'Atlas Grotesk Web', sans-serif;
	font-weight:300;
	font-size: 1.125rem;
	}	
h1, h2, h3, h4 {
	font-weight:500; 
	}		
h1	{
	font-size:1.375rem;
	}
h2	{
	font-size:1.375rem;
	}
h3	{
	font-size: 1.125rem;
	text-transform: uppercase;
	}
h4, h3.see-more	{
	font-size: 1.125rem;
	text-transform: none;
	}
p {
	padding:0 0 15px 0;
	line-height: 1.625rem;
	}
em {
	font-style:italic;
	}	
strong, strong p{
	font-family: 'Atlas Grotesk Web', sans-serif;
	font-weight:400;
	}	
ol,ul {
	list-style:none
	}							
a,
a:visited,
a:hover,
a:active {
	font-family: 'Atlas Grotesk Web', sans-serif;
	font-weight:300;
	color:#000;
	margin:3px 0;
	padding:0;
	text-align:left;
	text-decoration:underline;
	background-color:none;
	cursor: pointer;
	}
a:hover,
a:active	{
	color:#000;
	text-decoration:none;
	background:yellow;
	}
a:visited {text-decoration:none;}

/* layout structure  ---------------------------------------------- */

#wrapper {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	min-height:100%;
	padding:0;
	margin:0;
	background: #f5f5f5;
	}
#header, #container,
#footer {
	display:block;
	width: calc(100% - 40px);
	max-width: 1200px;
	margin:0 auto;
	height:auto;
	padding: 20px;
	}



#container.home-index {
	max-width: none;
	}
#container.home-index {
	display:block;
	width: calc(100% - 40px); 
	margin:0 auto;
	height:auto;
	padding: 20px;
	}
#container {
	padding-top: 50px;
}
#header { 
	height: 150px;
}
#container {
	overflow:hidden;
}	

/* pages and container ---------------------------------------------- */

.entry-content,
article.post-content,
.page-content {
	margin-bottom: 40px;
	}
.page-content,
.page-content.aboutus-page,
header.home-overview{
	width:100%;
	max-width:1200px;
	height:auto;
	display:block;
	}
.about-capabilities {
	display:inline;
	position:relative;
	float:left;
	width:100%;
	margin-bottom:30px;
	padding:15px 0 0 0;
	}
.header h1 { 
	padding: 0 20px 20px 0;
	}
.about-capabilities ul li {
	padding: 0 0 5px 0;
}
.about-capabilities h2 {
	font-size: 1.25rem; /*20px*/
	column-span:all;
}
.about-capabilities.bios,
.about-capabilities.capabilities-list,
.about-capabilities.recognition-para,
.about-capabilities.clientlist-all {
	-webkit-column-count: 3; /* Chrome, Safari, Opera */
    -moz-column-count: 3; /* Firefox */
    column-count: 3;
	-webkit-column-gap: 20px; /* Chrome, Safari, Opera */
    -moz-column-gap: 20px; /* Firefox */
    column-gap: 20px;
	border-top: solid gray 1px;
}
.capabilities-list p {
	-webkit-column-break-before: always;
	break-before: column;
}
.capabilities-list {
	height: 250px;
}
.about-capabilities.overview-para p {
	font-size:1.25rem;
	line-height:1.3;
	-webkit-column-count: 1; /* Chrome, Safari, Opera */
    -moz-column-count: 1; /* Firefox */
    column-count: 1;
	padding-right:40%;
}
.about-capabilities.overview-para p a,
.about-capabilities.capabilities-list p a {
	font-size:0.75rem;
	color:gray;
	text-transform:uppercase;
	letter-spacing:1px;
}

/* single post */

article.post-content {
	width: 100%;
	max-width:1200px;
	height:auto;
}
section#post-description-container, section#post-images-container {
	position:relative;
	float:left;
}
section#post-description-container {
	width:28%;
	max-width:300px;
	margin:0 7% 0 0;
}
section#post-images-container {
	/* width:780px; */
	width: 65%;
}
img,
.wp-caption,
.wp-caption-text,
#post-images p img,
#post-images p
{
	width:100%;
	max-width:780px;
	height:auto;
	}
#post-images img.website-browser-first { 
	border-style: solid none none none ;
	border-top-width: 1em;
	border-radius: 0.5em 0.5em 0 0;
	border-color: #dddddd;
	width:100%;
}
#post-images img.dropshadow { 
	box-shadow: 2px 2px 4px 0 #ccc;
	border-left: solid thin #ddd;
}	
#post-images p img {
	margin:0 0 40px 0;
	padding:0;
	} 
#post-images img:first-child, #post-images p img:first-child {
    margin-top:0px;
}
.wp-caption {
	margin:0 0 40px 0;
}
.wp-caption-text, section#post-images-container p {
	padding:15px 0 0 0;
	font-family: 'Atlas Grotesk Web', sans-serif;
	font-weight: 300;
	color:#868686;
	font-size: 14px;
	font-size:0.875rem;
	font-style:italic;
	line-height:1.3;
	}	
/* The img is inside the caption: .wp-caption img */

h1.repeat-client-name { 
	color: #999999;
	font-weight: 500;
	text-transform: uppercase;
	font-size: 12px;
	font-size: .75rem;
	letter-spacing: 1px;
	}
.archive-meta p {
	padding: 0 8% 15px 0;
	}	
footer.entry-footer { 
	padding: 10px 0 10px 0; 
	width:100%;
	max-width:100%;
	}
.see-more-links { 
	width:100%;
	max-width:100%;
	height:auto;
	}
.see-more-links h4,
ul.tag-links {
	display:block;
}
ul.tag-links li {
	display:inline;
	line-height:1.2;
	}
.see-more-links h4,
.tag-links a {
	font-size: 14px;
	font-size:0.875rem;
	}	
.tag-links a {
	color: #ec008c;
	text-decoration:none;
	}

/* Browse nav ---------------------------------------------- */

#client-dropdown {
	display: none;
	position:relative;
	top:0;
	background-color:#5F5F5F;
	list-style: none;
	width: 100%;
	margin: 0 auto;
	/* padding: 20px 20px 0 20px; */
}	
#client-dropdown-link-mobile {
	display:none;
}
#results-page-browse-lists, #results-container, #header-results {
	width:100%;
	max-width:1160px;
	height:auto;
	display:block;
	overflow:hidden;
}
#results-page-browse-lists {
	margin:0 auto;	
}
#results-page-browse-lists h4, #results-page-browse-lists li, #results-page-browse-lists a  {
	font-size:1rem;
	line-height:1.4rem;
	 padding: 5px 3px 5px 3px;
	color:#fff;
	text-decoration:none;
	-webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
	margin-bottom: 3px;
	text-indent:0;
}
#results-page-browse-lists h4 {
	color: #f87394;
	letter-spacing: 1px;
	font-size: .75rem;
	text-transform: uppercase;
	margin-left: 3px;
}
#results-page-browse-lists a:hover {
	color:#000;
	-webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
}
.results-list.featured-client-list, .results-list.filter-list {
	/* height:475px; */
	position:relative;
	float:left;
	padding:20px;
}
.results-list.featured-client-list {
	columns: 2;
	  -webkit-columns: 2;
	  -moz-columns:2; 
	  -webkit-column-gap: 20px; /* Chrome, Safari, Opera */
	  -moz-column-gap: 20px; /* Firefox */
	  column-gap: 20px;
	width:66%;
	max-width:700px;
	-webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
}
.results-list.filter-list {
	width:33%;
	max-width:350px;
}
.results-list.featured-client-list h4 {
	-webkit-column-span: all; /* Chrome, Safari, Opera */
    column-span: all;
	
}

/* Results and Home  ---------------------------------------------- */

#results-container ul li,
#results-container ul li.result-thumb,
li.result-thumb {
	position:relative;
	/* display:inline;
	float:left;*/
	width: 100%;
	height:auto;
	overflow:hidden;
	padding:10px 0 30px 0;
	-webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
	
}
#featured-thumbs-gallery,
#results-container{
	display:block;
	width:100%;
	height:auto;
	overflow:hidden;
	columns: 3;
	-webkit-column-count: 3; /* Chrome, Safari, Opera */
    -moz-column-count: 3; /* Firefox */
    column-count: 3;
	-webkit-column-gap: 60px; /* Chrome, Safari, Opera */
    -moz-column-gap: 60px; /* Firefox */
    column-gap: 60px;
	}
#results-container {
	-webkit-column-gap: 40px; 
    -moz-column-gap: 40px; 
    column-gap: 40px;
	}
	
#featured-thumbs-gallery img, #results-container img {
	cursor: pointer;
	}

.featured-thumb, .thumb-image {
	display:inline-block;
	/* float:left; */
	clear:none;
	width:100%;
	/* max-width:420px;*/
	height:auto;
	margin:0 0 40px 0;
	padding: 0; 
	overflow:hidden;
	column-span:1;
	-webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
	text-decoration:none;
	line-height:0;
	}
.featured-thumb.book {
	width: 103%;
	margin-left: -2%;
	}
.featured-thumb p, .featured-thumb p a, 
.featured-thumb p img, .featured-thumb img,
.thumb-image img { 
	width:100%;
	max-width:600px;
	height:auto;
	margin:0;
	padding:0;
	text-decoration:none;
	vertical-align:top;
}
.featured-thumb p a:hover {
	background-color: transparent;
}
.website-tablet, .website-browser, .video,
.website-tablet.landscape,
.website-tablet.portrait {
	margin:0 0 40px 0;
}

.website-tablet {
	border-style: solid;
	border-width: 3.75em 1.25em;
	border-radius: 1.25em;
	border-color: #dddddd;
	/* background-color: #dddddd; */
	width:calc(100% - 2.5em);
	}
.website-browser {
	border-style: solid none none none ;
	border-width: 1.25em;
	border-radius: 0.5em 0.5em 0 0;
	border-color: #dddddd;
	/* background-color: #dddddd; */
	width:100%;
}

.website-tablet.landscape {
	max-height:350px;
	border-width: 0.5em 1.5em;
	width:calc(100% - 3em);
	}

/* img height is ratio of image height to width -- safari load fix */

.home-image-1 {
	position: relative;
  padding-bottom: 134.266666666667%; /* ratio of image height to width */
  height: 0;
  overflow: hidden;}
  
 .home-image-2 {
	position: relative;
  padding-bottom: 141.46%; /* ratio of image height to width */
  height: 0;
  overflow: hidden;}
 
  .home-image-3 {
  position: relative;
  padding-bottom: 146.3%; /* ratio of image height to width */
  height: 0;
  overflow: hidden;}
 
  .home-image-4 {
  position: relative;
  padding-bottom: 75%; /* ratio of image height to width */
  height: 0;
  overflow: hidden;}
  
.home-image-5 {
  position: relative;
  padding-bottom: 74.666%; /* ratio of image height to width */
  height: 0;
  overflow: hidden;}
  
 .home-image-6 {
  position: relative;
  padding-bottom: 100%; /* ratio of image height to width */
  height: 0;
  overflow: hidden;}
  
  .home-image-7 {
  position: relative;
  padding-bottom: 133.733333333333%; /* ratio of image height to width */
  height: 0;
  overflow: hidden;}
  
  .home-image-8 {
  position: relative;
  padding-bottom: 133.8%; /* ratio of image height to width */
  height: 0;
  overflow: hidden;}
  
   .home-image-9 {
  position: relative;
  padding-bottom: 74.533333333333%; /* ratio of image height to width */
  height: 0;
  overflow: hidden;}
 
   .home-image-10 {
  position: relative;
  padding-bottom: 158.666666666667%; /* ratio of image height to width */
  height: 0;
  overflow: hidden;}
 
   .home-image-11 {
  position: relative;
  padding-bottom: 140%; /* ratio of image height to width */
  height: 0;
  overflow: hidden;}
  
    .home-image-12 {
  position: relative;
  padding-bottom: 74.666666666667%; /* ratio of image height to width */
  height: 0;
  overflow: hidden;}
  
     .home-image-13 {
  position: relative;
  padding-bottom: 75.066%; /* ratio of image height to width */
  height: 0;
  overflow: hidden;}
  
      .home-image-14 {
  position: relative;
  padding-bottom: 161.6%; /* ratio of image height to width */
  height: 0;
  overflow: hidden;}
  
      .home-image-15 {
  position: relative;
  padding-bottom: 144.666666666667%; /* ratio of image height to width */
  height: 0;
  overflow: hidden;}

	
.featured-thumb.website-tablet.landscape img {
	width:calc(100%);
	}
.featured-thumb p a:hover, .featured-thumb p a:active,
.featured-thumb a:hover, .featured-thumb a:active{
	background-color:none;
}
.result-thumb h2, .result-thumb h3 {
	display:block;
	z-index:auto;
	width:90%;
	padding: 5px 0;
	text-align:center;
	font-size:1rem;
	font-weight: 400;
	text-transform:none;
	text-align:left;
	height:auto;
	color: #555;
}
.result-thumb h2 {
	text-transform:uppercase;
	letter-spacing:1px;
	color:#999;
	font-size:0.75rem;
	padding: 0;
}
.result-thumb a {
	color:#000;
	text-decoration:none;
}	
.result-thumb a:hover, .result-thumb a:active {
	color:#000;
	text-decoration:none;
	background-color: transparent;
}	
#container.not-found {
	height:100%;
	}
.entry-content.not-found {
	 height:auto;
	 }
.entry-content.search-no-results, .entry-title.search-no-results {
	column-span:all;
	font-size:1.125rem;
	font-weight:normal;
}

/* footer ---------------------------------------*/

#footer-text,
#footer ul,
#footer ul li,
.footer-search-container, .footer-search-container p, .searchform div,
.searchform div p, 
div.search-form, div.search-form input, form#search-form.searchform {
	display:inline-block;
	padding:0;
	font-size:0.875rem;
	clear:none;
	}
#footer ul {
	margin: 0 10px 0 0;
	}
#footer-text a,
.contact a {
	text-decoration:none;
	color:#696969;
	margin:0;
	padding:5px;
	}
.footer-search-container {
	float:right;
	width:auto;
	overflow:hidden;
}
form#search-form.searchform, div.search-form {
	float:right;
	width:auto;
}
p.search-toggle-open, 
p.search-toggle-close {
	display:inline;
	clear:none;
	cursor:pointer;
	float:left;
	padding:2px 8px 0 0;
}
#footer ul li, p.search-toggle-open, 
p.search-toggle-close {
	line-height:1;
	height:22px;
	vertical-align:baseline;
}
input#s {
	float:left;
	margin:-2px 0 0 0;
	width:200px;
	height:24px;
	padding:0;
	border-bottom-color:none;
	border-top-color:none;
	border-right-color:none;
	border-left-color:none;
	border:none;
}
input#searchsubmit,
div.search-form,
p.search-toggle-close,
#footer.responsive { 
	display:none;
	border:0;
}



/* header ---------------------------------------*/

#branding, ul.topnav-list {
	position:relative;
	float:left;
	width:50%;
	max-width:500px;
}
#branding {
	width: 200px;
	height: 90px;
	background-image:url(images/logo-text.png);
	background-position: right 40px;
	background-repeat: no-repeat;
	background-size: 70%;
	color:transparent;
}	
#logo-circle {
	/*background-image:url(images/logo-circle-yellow.png);*/
	background-image:url("images/logo-circle-yellow.png"), url("images/logo-circle-pink.png");
	position: absolute;
	width: 50px;
	height: 50px;
	background-position: left top;
	background-repeat: no-repeat;
	background-size: 100%;
	margin: 0;
	padding: 0;
	opacity: .7;
	z-index: 11;
	background-blend-mode: multiply;
	-webkit-animation: rotation1 1s ease-out, rotation2 60s infinite linear;
	-moz-animation:rotation1 1s ease-out, rotation2 60s infinite linear;
	-ms-animation:rotation1 1s ease-out, rotation2 60s infinite linear;
	-o-animation:rotation1 1s ease-out, rotation2 60s infinite linear;
	animation:rotation1 1s ease-out, rotation2 60s infinite linear;
	-webkit-animation-delay: 0s, 1s;
	-moz-animation-delay: 0s, 1s;
	-o-animation-delay: 0s, 1s;
	animation-delay: 0s, 1s;
	}
#logo-circle-2 {
	z-index: 10;
	position: absolute;
	background-image:url(images/logo-circle-pink.png);
	width: 50px;
	height: 50px;
	background-position: left top;
	background-repeat: no-repeat;
	background-size: 100%;
	margin: 0;
	opacity: 1;
	padding: 0;
	background-blend-mode: multiply;
	-webkit-animation: rotation3 1s ease-out, rotation2 60s infinite linear;
	-moz-animation:rotation3 1s ease-out, rotation4 60s infinite linear;
	-ms-animation:rotation31 1s ease-out, rotation4 60s infinite linear;
	-o-animation:rotation3 1s ease-out, rotation4 60s infinite linear;
	animation:rotation3 1s ease-out, rotation4 60s infinite linear;
	-webkit-animation-delay: 0s, 1s;
	-moz-animation-delay: 0s, 1s;
	-o-animation-delay: 0s, 1s;
	animation-delay: 0s, 1s;
}


@-webkit-keyframes rotation1 {
		from {
				-webkit-transform: rotate(0deg);
		}
		to {
				-webkit-transform: rotate(359deg);
		}
}
@-webkit-keyframes rotation2 {
		from {
				-webkit-transform: rotate(0deg);
		}
		to {
				-webkit-transform: rotate(359deg);
		}
}

@-webkit-keyframes rotation3 {
		from {
				-webkit-transform: rotate(0deg);
		}
		to {
				-webkit-transform: rotate(-359deg);
		}
}
@-webkit-keyframes rotation4 {
		from {
				-webkit-transform: rotate(0deg);
		}
		to {
				-webkit-transform: rotate(-359deg);
		}
}

a#branding {
	text-decoration: none;
	}
.screen-reader-text, a.screen-reader-text skip-link, .offscreen { 
	text-indent: -9999px;
	position:absolute;
	height:0;
	}
ul.topnav-list {
	float:right;
	height:auto;
	}
ul.topnav-list li {
	position: relative;
	float:right;
	clear:none;
	display:inline;
	margin:0;
	padding: 0 0 0 20px;
	text-transform: uppercase;
	letter-spacing:1px;
	font-size: 0.75rem;
	color:gray;
	}
ul.topnav-list li a {
	text-decoration:none;
	}


/* MEDIA QUERIES --------------------------------------------------- */				

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

section#post-description-container {
    width: 100%;
    max-width: 780px;
    margin: 0 7% 0 0;
}
section#post-images-container {
    width: 100%;
    max-width: none;
}
#post-images p, #post-images img {
	display: block;
}
#client-dropdown {
	margin: 0;
	padding: 0;
}	
.results-list.featured-client-list {
	max-width:623px;
}
.results-list.filter-list {
	max-width:311px;
}
.about-capabilities.overview-para p {
	padding-right:30%;
}
.about-capabilities.bios, .about-capabilities.capabilities-list, .about-capabilities.recognition-para, .about-capabilities.clientlist-all {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
	column-gap: 40px;
}
.capabilities-list {
	height: auto;
}
	
}

@media screen and (max-width: 768px)  { 
html {
	font-size:14px;
	}
#header,
#container, 
#footer,
#single-post-content {
	display:block;
	width:100%;
	max-width:94%;
	margin:0;
	padding:20px 3%;
	}	
#header,
#footer {
	overflow:hidden;
	}
#featured-thumbs-gallery,
#results-container,
.about-capabilities.bios,
.about-capabilities.capabilities-list,
.about-capabilities.recognition-para,
.about-capabilities.clientlist-all	{
	-webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
	-webkit-column-gap: 40px; /* Chrome, Safari, Opera */
    -moz-column-gap: 40px; /* Firefox */
    column-gap: 40px;
	}
.about-capabilities.recognition-para {
	-webkit-column-count: 1; /* Chrome, Safari, Opera */
    -moz-column-count: 1; /* Firefox */
    column-count: 1;
	-webkit-column-gap: 0; /* Chrome, Safari, Opera */
    -moz-column-gap: 0; /* Firefox */
    column-gap: 0;
	}	
.about-capabilities.overview-para p {
	padding-right:0;
}
.results-list.featured-client-list { 
    width: 55%;
}
#results-page-browse-lists ul.client-dropdown ul li a	{	
	overflow:hidden;
	padding:0;
	}
img,
.wp-caption {
	max-width:720px;
	}

}


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


#branding {
	background-image: none;
	width: 30%;
	float: left;
	padding: 0;
}

ul.topnav-list {
	max-width: 210px;
	float: right;
}

ul.topnav-list li {
	float: right;
	padding:0 0 10px 20px;
}

ul.topnav-list {
	width: 90%;
	padding: 0;
}

#header {
	height: 50px;
}

#header,
#featured-thumbs-gallery,
#results-container	
	{
	width:100%;
		}
#header{
	padding: 20px 3% 40px 3%;	
	}	
#branding {
	display:block;
	float:left;
	max-width:414px;
	margin:-14px 0 0 0;
}

#featured-thumbs-gallery,
#results-container,
.about-capabilities.bios,
.about-capabilities.capabilities-list,
.about-capabilities.recognition-para,
.about-capabilities.clientlist-all,
.about-capabilities.overview-para p	
	{
	-webkit-column-count: 1; /* Chrome, Safari, Opera */
    -moz-column-count: 1; /* Firefox */
    column-count: 1;
	-webkit-column-gap: 20px; /* Chrome, Safari, Opera */
    -moz-column-gap: 20px; /* Firefox */
    column-gap: 20px;
	}	
img,
.wp-caption {
	max-width:389px;
	}

.results-list.featured-client-list {
    columns: 1;
    -webkit-columns: 1;
    -moz-columns: 1;
    -webkit-column-gap: 20px;
    -moz-column-gap: 20px;
    column-gap: 20px;
    width: 100%;
    max-width: 700px;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
}

.results-list.filter-list, .results-list.featured-client-list {
	width: 100%;
	padding: 0;
}

#results-page-browse-lists {
	margin:0 auto;
	padding: 14px 0 0 14px;
    width: calc(100% - 14px);
	}
.footer-search-container, form#search-form.searchform, div.search-form {
	float:left;
}	
#footer ul {
	display:block;	
	clear:right;
	}
	
}

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

img, .wp-caption {
	max-width:355px;
	}
}
	
@media screen and (max-width: 320px){ 

img, .wp-caption {
	max-width:300px;
	}
}

@media screen and (min-width: 1200px){
	#header.home {
		max-width: none;
	}
}

@media screen and (min-width: 1920px){ 

#container {
	overflow:visible;
	}
#featured-thumbs-gallery {
	columns: 4;
	-webkit-column-count: 4; /* Chrome, Safari, Opera */
    -moz-column-count: 4; /* Firefox */
    column-count: 4;
	-webkit-column-gap: 60px; /* Chrome, Safari, Opera */
    -moz-column-gap: 60px; /* Firefox */
    column-gap: 60px;
	}	
#footer {
	bottom:0;
	}
}