@media (min-width: 767px){
	::-webkit-scrollbar {width: 8px; height: 8px;}
	::-webkit-scrollbar-thumb {background: #333;}
	::-webkit-scrollbar-track {background: #ddd;}
}
a:hover, a:focus, a:link {outline: 0; outline: none;}
* {box-sizing: border-box; outline: none; outline: 0;}
html {height: auto; width: auto; overflow: auto; font-family: 'Lato', sans-serif; letter-spacing: 0.03em;}
body, #wrapper {height: auto; width: auto; overflow: visible;}
body {font-size: 1em; line-height: 1.35em; color: #545454;}
html.noscroll {overflow: visible; height: 100%;}
html.noscroll body {overflow: hidden;}

h1,h2,h3,h4,h5,h6 {margin: 0; padding: 0; font-size: 1em; line-height: 1em;}

a {color: #2a2a2a; text-decoration: none;}
p {padding-bottom: 1.5em;}
strong {font-weight: bold;}
.important, .req {color: #AD0000;}

.padding {padding: 20px;}

.hidden {display: none !important;}
.readonly {position: relative; height: 1px; width: 1px; overflow: hidden; text-indent: 9999em; margin-top: -1px; opacity: 0;}

img.landscape, video.landscape {height: 100% !important; width: auto !important;}
img.portrait, video.portrait {width: 100% !important; height: auto !important;}

.spacer {height: 3em;}

/* form fields */
input[type="text"], input[type="email"], input[type="tel"], input[type="address"], input[type="password"], textarea {border: 1px solid #ddd; box-shadow: none; padding: 0.35em; background: #fff;}
input[type="text"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="address"]:focus, input[type="password"]:focus, textarea:focus {border: 1px solid #000;}
textarea {resize: none;}
textarea.resize-vertical {resize: vertical;}
textarea.resize-horizontal {resize: horizontal;}
input[type="text"], input[type="email"], input[type="tel"], input[type="address"], input[type="password"] {height: 2.5em; width: 100%;}
input[type="button"],
input[type="submit"],
button,
.button {display: inline-block; border-radius: 2px; padding: 1em 2em; font-size: 10px; font-weight: bold; line-height: 1em; text-align: center; line-height: 1em; border: 0; -webkit-appearance: none; color: #fff; text-transform: uppercase; background: #444; letter-spacing: 0.05em; text-decoration: none;}
input[type="button"]:hover,
input[type="submit"]:hover,
button:hover,
.button:hover,
input[type="button"]:focus,
input[type="submit"]:focus,
button:focus,
.button:focus {background-color: #000;}
textarea {resize: vertical; width: 100%;}
label, .label {display: block; padding-bottom: 1em;}
label > input[type="checkbox"], label > input[type="radio"] {display: inline !important; width: auto;}
label > input[type="checkbox"], label > input[type="radio"] {visibility: hidden;}
label > span, .label, .input > label {position: relative; text-transform: uppercase; font-size: 10px; letter-spacing: 0.05em; font-weight: bold; color: #454545; padding-bottom: 0.5em;}
.message {font-size: 10px; line-height: 1.35em;}
label > input[type="checkbox"] + span, label > input[type="radio"] + span {display: inline; padding-left: 0.5em; font-weight: normal;}
.form {border: 1px solid #ededed; padding: 2em; max-width: 500px; margin: 0 auto;}

label > input[type="checkbox"] + span:before {content: ''; display: block; position: absolute; top: 0; left: 0; margin-left: -14px; height: 12px; width: 12px; background-image: url(../png/checkbox%402x.png); background-size: contain; background-position: top left; background-repeat: no-repeat;}
label > input[type="checkbox"]:checked + span:before {background-image: url(../png/checkbox-checked%402x.png);}
label > input[type="radio"] + span:before {content: ''; display: block; position: absolute; top: 0; left: 0; margin-left: -14px; height: 15px; width: 15px; background-image: url(../png/radio.png); background-position: top left; background-repeat: no-repeat;}
label > input[type="radio"]:checked + span:before {background-position: bottom left;}
.input {padding-bottom: 1em;}
.input > label {padding-bottom: 0px;}

/* general styling */
.section-headline, .section .content h2 {padding: 1em 0 2em 0; font-size: 1.725em; line-height: 1.3em; text-transform: uppercase; letter-spacing: 0.25em; font-weight: 300; text-align: center;}
.section-title {font-size: 1.625em; letter-spacing: 0.05em; color: #404040; font-weight: bold; text-transform: uppercase;}
.section .content .section-subheadline {position: relative; padding: 2.25em 0; font-size: 1.375em; line-height: 1.1em; letter-spacing: 0.25em; text-transform: uppercase; font-weight: 300; text-align: center; overflow: hidden; color: #2e2e2e;}
.section .content .section-subheadline:before {content: ''; display: block; position: absolute; top: 50%; width: 100%; left: -50%; height: 1px; background: #c4c4c4;}
.section .content .section-subheadline h2,
.section .content .section-subheadline h3 {z-index: 1; font-size: 1em; position: relative; display: inline-block; padding: 0 1em; background: #fff;}
.section-view-more {position: relative; overflow: hidden; padding: 2em 0; font-size: 0.9375em; letter-spacing: 0.25em; text-transform: uppercase; text-align: center;}
.section-view-more:before {content: ''; display: block; position: absolute; top: 50%; width: 100%; right: -50%; height: 1px; background: #c4c4c4;}
.section-view-more a {z-index: 1; position: relative; display: inline-block; padding: 0 1em; color: #545454; background: #fff; text-decoration: none;}
.section-view-more a:hover {color: #000;}

#advanced-search .col:nth-child(1) {width: 65%; flex: auto; padding-right: 20px;}
#advanced-search .col:nth-child(2) {width: 35%; flex: auto; padding-left: 20px;}
#advanced-search .col:nth-child(2) h4 {padding-top: 1em;}
#advanced-search .col:nth-child(2) h4:first-child {padding-top: 0;}
#advanced-search .checkbox {display: block;}
#advanced-search .radio {line-height: 16px;}


.row {display: flex; flex-direction: row;}
.row > .col {flex-direction: column; flex: 1;}
.text-center {text-align: center;}
.text-right {text-align: right;}
.align-center {align-items: center;}
.align-right {align-items: flex-end;}

.dropdown {position: relative;}
.dropdown > ul {display: none; position: absolute; left: 0; top: auto; width: auto; background: #fff; padding: 1em;}
.dropdown:hover > ul {display: block;}
.dropdown > ul li {white-space: nowrap; padding: 0.25em 0; margin: 0;}

/* header */
.header {position: relative; height: 130px; padding: 20px; background: #fff;}
.header a {color: #545454; text-decoration: none;}
.header a:hover {color: #2e2e2e; text-decoration: underline;}
.header .logo {display: block; width: 92px; height: 66px; float: left; margin-top: 10px;}
.header .logo svg, .header .logo img {width: 100%; height: 100%;}

.top-nav {text-transform: uppercase; letter-spacing: 1px;}
.top-nav ul {list-style: none;}
.top-nav .link-cart {padding-left: 20px; background: url(../png/cart.png) no-repeat left center;}
@media (min-width: 1024px){
	.top-nav {position: absolute; top: 10px; right: 20px; font-size: 10px;}
	.top-nav ul li {display: inline-block; vertical-align: top; margin-left: 1em;}
	.top-nav ul li:first-child {margin-left: 0;}
}

.main-nav {letter-spacing: 1px; text-transform: uppercase;}
.main-nav a, .main-nav a:hover {text-decoration: none;}
.main-nav ul {list-style: none;}
@media (min-width: 1024px) {
	.main-nav {padding: 37px 0 0 0; margin-left: 150px; font-size: 13px; letter-spacing: 3px; text-transform: uppercase;}
	.main-nav ul {list-style: none;}
	.main-nav li {display: inline-block; vertical-align: top; margin-left: 14px;}
	.main-nav li:first-child {margin-left: 0;}
}
/* section and content */
.section {position: relative;}
.section .content {margin: 0 auto;}
.section.page .content {padding: 20px; font-weight: 300;}
.section.page .content, .section-grid {max-width: 1040px; margin: 0 auto;}
.section-grid {padding: 0 20px;}
.section .leadin {max-width: 700px; margin: 0 auto; padding: 3em 0; text-align: center; text-transform: uppercase; letter-spacing: 0.15em; font-weight: 300;}
.section .leadin a {font-weight: normal;}

.sign-in .section-title {padding-bottom: 0.75em;}
.forgotpassword {padding: 20px 0 70px 0; text-transform: uppercase; letter-spacing: 0.5em; font-size: 11px;}
.forgotpassword a {text-decoration: none;}
.forgotpassword a:hover {text-decoration: underline;}

#forgotPassword {padding-top: 24px;}

/* hero blocks */
.hero {min-height: 200px; padding-top: 25%; position: relative; overflow: hidden; background: #eee;}
.hero-large {min-height: 400px; padding-top: 45%;}
.hero-full {padding-top: 45%; max-height: 80vh;}
.hero-text {position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; padding: 1em; justify-content: flex-end; text-align: center; text-transform: uppercase; font-size: 2.5em; line-height: 1.15em; color: #fff; letter-spacing: 0.25em; text-shadow: 0px 1px 12px rgba(0,0,0,0.4);}
.hero-image {position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; background: #111;}
.hero-image img, .hero-image video {object-fit: cover; width: 100%; height: 100%;}
.hero-image .slideshow_video {position: relative; height: 100%; width: 100%;}
.hero-image .video-js {height: 100% !important; width: 100% !important;}
.hero-image .vjs-poster {background-size: cover;}

.h_slideshow {position: relative; width: 100%; height: calc(100vh - 160px); opacity: 0;
	-webkit-transition: opacity 0.2s ease-in-out;
	-moz-transition: opacity 0.2s ease-in-out;
	transition: opacity 0.2s ease-in-out;
}
.h_slideshow.show {opacity: 1;}
.h_slideshow .slideshow {position: relative; width: 100%; height: 100%;}
.slideshow_image {width: 100%; height: 100%; overflow: hidden;}
.h_slideshow .video_clip {height: 100%; width: 100%; position: relative;}
.h_slideshow .video_clip video[poster] {background-size: auto;}
.h_slideshow .video_clip video.portrait {width: 100% !important;}
.h_slideshow .video_clip video.landscape {height: 100% !important;}


.ss_pager {display: block; position: absolute; margin-top: -4em; width: 100%; z-index: 50; padding: 1em 0 2em 0; text-align: center;}
.ss_pager a {display: inline-block; overflow: hidden; height: 12px; width: 12px; border-radius: 6px; margin: 0 0.25em; text-indent: -99em;  background-color: rgba(0,0,0,0.5);
	-webkit-transition: background 0.15s ease-in-out;
	-moz-transition: background 0.15s ease-in-out;
	-ms-transition: background 0.15s ease-in-out;
	transition: background 0.15s ease-in-out;
}
.ss_pager a.activeSlide {background-color: #fff;}

/* tabbar */
.tabbar {float: right; display: flex; flex-direction: row; justify-content: center; align-items: center; font-size: 12px;}
.tabbar label {padding-right: 1em;}
.tabbar a {display: block; line-height: 2em; padding: 0 1em; text-decoration: none; background-color: #eee; box-shadow: 0px 0px 0px 1px #ccc;}
.tabbar a:first-child {border-top-left-radius: 4px; border-bottom-left-radius: 4px;}
.tabbar a:last-child {border-top-right-radius: 4px; border-bottom-right-radius: 4px;}
.tabbar a:hover {background-color: #f6f6f6;}
.tabbar a.sel, .tabbar a.sel:hover {background-color: #fff; color: #2a2a2a;}
.page .tabbar a {font-weight: normal;}

/* masonry */

.toolbar {display: flex; width: 100%; justify-content: center; padding: 16px 0;}
.toolbar > * {display: inline-block;}
.toolbar .show-details {color: #545454; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase;}
.toolbar .show-details.sel {color: #000;}

#masonry, ul.masonry {padding: 0;}
.masonry.detail {padding: 0 20px;}
.masonry .m_item .m_overlay {display: flex; position: absolute; z-index: 1; top: 0; left: 0; height: 100%; width: 100%; margin: 0; padding: 1em; opacity: 1; visibility: visible; align-items: center; justify-content: center; text-transform: uppercase; text-decoration: none; text-align: center; color: #fff; font-size: 0.875em; line-height: 2.25em; letter-spacing: 0.65em; font-weight: 700; background: rgba(0,0,0,0.15);
	transition: background 0.15s ease-in-out;
}
.masonry .m_item .m_overlay h4 {padding-left: 0.65em; line-height: inherit;}
.masonry .m_item:hover .m_overlay {background: rgba(0,0,0,0.55);}
#masonry .m_item .m_item_image, .masonry .m_item .m_item_image {position: relative; margin: 0; display: block;}
.masonry .m_item .m_item_image img, .masonry .m_item .m_item_image video {display: block;}
.masonry .m_item .m_item_image video.landscape {height: 100%; width: auto;}
.masonry .m_item .m_item_image video.portrait {height: auto; width: 100%;}
.masonry.assets_cropped .m_item_image {background: #111111;}

.masonry .m_item.assettype2 .m_item_image:before,
.masonry .m_item.assettype4 .m_item_image:before {content: ''; position: absolute; top: 50%; left: 50%; margin-left: 4px; height: 32px; width: 32px; border-width: 16px 0px 16px 28px; border-style: solid; border-color: transparent transparent transparent #ffffff; box-sizing: border-box; transform: translate(-50%, -50%);}

#masonry.has-hover .m_item:hover {z-index: 1;}
#masonry.has-hover .m_item:not(.view-more) a {display: block; transform: translate(0,0); box-shadow: 0px 4px 32px rgba(0,0,0,0); transition: all 0.25s ease-in-out 0s; text-decoration: none;}
#masonry.has-hover .m_item:not(.view-more):hover a {transform: translate(0,-2em); box-shadow: 0px 4px 32px rgba(0,0,0,0.45); transition: all 0.25s ease-in-out 0.5s;}
#masonry.has-hover .m_item:not(.view-more) .m_overlay {opacity: 0; position: relative; display: block; top: auto; bottom: auto; left: auto; right: auto; height: auto; margin: 0; padding: 1em; color: #545454; font-size: 11px; letter-spacing: 0.3em; font-weight: normal; text-align: left; background: #fff; transition: opacity 0.25s ease-in-out 0s;}
#masonry.has-hover .m_item:not(.view-more):hover .m_overlay {opacity: 1; transition: opacity 0.25s ease-in-out 0.5s;}

#masonry.show-details .m_overlay {position: static; opacity: 1; display: block; visibility: visible; margin: 0; padding: 0.5em 0; color: #2a2a2a; font-size: 10px; letter-spacing: 0.3em; font-weight: normal; text-align: left; background: none;}
#masonry.show-details .m_item {margin-bottom: 5em !important;}

.masonry.detail .m_overlay {display: none;}
.masonry.justified .m_item .m_item_image {margin: 0;}
.masonry.justified:after {content: ''; display: block; clear: both;}

.masonry.type-wide .m_overlay {align-items: flex-end; font-size: 1.45em; letter-spacing: 0.3em; justify-content: flex-end;}

#custom-shoots .leadin {padding-bottom: 0;}
#instafeed {max-width: 835px; margin: 0 auto;}

.m_item.view-more {background-color: #e6e6e6;}
.m_item.view-more .m_text {position: absolute; top: 0; left: 0; display: flex; justify-content: center; align-items: center; text-align: center; height: 100%; width: 100%; font-size: 1.75em; line-height: 1.5em; font-weight: 300; text-decoration: none; text-align: center; text-transform: uppercase; letter-spacing: 0.15em; color: #2a2a2a;}

/* album detail page */
.album-name {padding-bottom: 0 !important;}
.album-description {padding: 0 !important; font-size: 1.375em; line-height: 1.1em; text-transform: uppercase; letter-spacing: 0.25em; font-weight: 300; text-align: center;}
.album-description p {padding: 0;}
.album-type {text-align: center; text-transform: uppercase; letter-spacing: 0.2em;}
.album-meta {text-align: center; padding: 2em 0; text-transform: uppercase; letter-spacing: 0.2em;}
.album-meta a {display: inline-block; vertical-align: middle; padding: 0 1em; text-decoration: none;}

/* contact page */
.page.contact {text-align: center;}
.offices {justify-content: center;}
.offices .office {position: relative; width: 50%; padding-top: 30%; margin: 1em; font-weight: normal; flex: unset;}
.offices .office .office-text {position: absolute; top: 0; left: 0; z-index: 1; display: flex; height: 100%; min-width: 50%; padding: 1em; flex-direction: column; justify-content: center; text-align: left; background: rgba(255,255,255,0.75);}
.offices .office .office-image {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.offices .office .office-image img {object-fit: cover; width: 100%; height: 100%;}
.offices .office h3 {text-transform: uppercase; padding-bottom: 1em; font-size: 1.5em; letter-spacing: 0.25em; color: #2e2e2e;}
.offices .office p {letter-spacing: 0.25em; font-size: 0.625em; line-height: 1.5em; color: #2d2d2d;}
.contact-body {font-weight: 300;}

/* footer */
.footer {padding: 60px 20px; font-size: 0.7em; letter-spacing: 4px; color: #545454; line-height: 2.25em; text-transform: uppercase;}
.home .footer {background-color: #fafafa;}
.footer .content {max-width: 800px; margin: 0 auto;}
.footer a {color: #545454; text-decoration: none;}
.footer a:hover {color: #2e2e2e;}

.footer .social-links {text-align: center; font-size: 3.5em;}
.footer .social-links li {display: inline-block; vertical-align: top; margin: 0 0.75em;}
.footer .footer-hashtag {padding: 2em 0 4em 0; text-align: center; font-size: 1.15em; letter-spacing: 0.65em;}

.footer .row {max-width: 650px; margin: 0 auto;}


/* search */
.searchbar {position: absolute; top: 40px; right: 20px; bottom: 30px; width: 300px;}
.searchbar .input {border-bottom: 1px solid #000; padding-bottom: 0;}
.searchbar input[type="text"] {height: 38px; width: 100%; padding: 0 25px 0 10px; border: 0; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; background: #fff; box-shadow: none;}
.search-options {padding-top: 4px;}
.checkbox {display: inline-block; margin-left: 1em; vertical-align: top; font-size: 10px; text-transform: uppercase;}
.checkbox:first-child {margin-left: 0;}
.checkbox label {color: #666; padding-bottom: 0.5em;}
.checkbox input {background: #fff;}
.searchbar .search-submit {position: absolute; right: 0; top: 12px; overflow: hidden; -webkit-transform: scaleX(-1); transform: scaleX(-1); background: transparent; border-radius: 0; padding: 0; font-size: 1em; color: inherit;}
.searchbar .search-submit:hover {text-decoration: none; color: #CC0000;}

.advanced-search {text-align: right; text-transform: uppercase; font-size: 10px; letter-spacing: 1px;}
.advanced-search a {color: #666;}

#change-size a {display: inline-block; height: 16px; width: 16px; margin-right: 16px; background-size: contain; background-repeat: no-repeat; background-position: center center; opacity: 0.35;}
#change-size a:hover {opacity: 1;}
#change-size a.sel {opacity: 1;}
#change-size .change-small {background-image: url(../png/small.png);}
#change-size .change-medium {background-image: url(../png/medium.png);}
#change-size .change-large {background-image: url(../png/large.png);}

.search-breadcrumb {display: flex; flex-direction: row; justify-content: flex-start; align-items: center; text-align: left;}
.search-breadcrumb > div {width: 80%;}
.search-breadcrumb > div:nth-child(2) {width: 20%;}
.search-breadcrumb .album-meta {text-align: left;}
.search-breadcrumb #change-size {text-align: right; justify-content: flex-end;}

/* search results */


/* pricing and information page */
.page.pricing h3 {font-size: 1.5em; font-weight: 700; letter-spacing: 0.35em; text-transform: uppercase; margin-bottom: 1.5em; color: #666;}
.page.pricing h4 {display: inline-block; position: relative; margin-bottom: 1em; font-size: 1.35em; line-height: 1.35em; text-transform: uppercase; letter-spacing: 0.35em; color: #666;}
.page.pricing h4:before {content: ''; display: block; position: absolute; bottom: -0.25em; width: 100%; border-bottom: 1px solid #666;}
.page.pricing h4:after {content: ''; display: block; clear: both;}
.page.pricing h5 {text-transform: uppercase; letter-spacing: 0.35em;}

.pricing-table {width: 100%; border: 0; border-spacing: 0; margin-bottom: 1em;}
.pricing-table tr {display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 20px;}
.pricing-table td {font-size: inherit; text-align: center; text-transform: uppercase; color: #fff; line-height: 1.3em; background-color: #223E4D;}
.pricing-table.royaltyfree td, .pricing-table.editorial td {background-color: #376077;}
.pricing-table td figure {display: block; padding-top: 100%; overflow: hidden; position: relative;}
.pricing-table td figure img {display: block; top: 0; left: 0; position: absolute; width: 100%; height: 100%; object-fit: cover;}
.pricing-table td p {display: block; padding: 12px; letter-spacing: 0.05em; font-weight: 300;}
.pricing-table td small {font-size: 0.5em; font-weight: normal;}

.page a {font-weight: normal; text-decoration: none;}
.page a:hover {color: #666;}

/* video player css markup */
.video-js {
	font-size: 10px;
	color: #000;
	width: auto;
	height: auto;
	padding-top: 0 !important;
	background: #fff;
}
.video-js, .vjs-tech {left: auto !important; top: auto !important; position: relative !important;}
.vjs-default-skin .vjs-big-play-button {
	line-height: 2em;
	height: 2em;
	width: 2em;
	left: 50%;
	top: 50%;
	border: 0px;
	margin: -1em 0 0 -1em;
	border-radius: 2em;
}
.vjs-has-started.vjs-paused .vjs-big-play-button {display: block;}
.video-js .vjs-big-play-button,
.video-js .vjs-menu-button .vjs-menu-content {
	background-color: #fff;
	background-color: rgba(255, 255, 255, 0.5);
}
.video-js .vjs-control-bar {
	background-color: #fff;
	background-color: rgba(255, 255, 255, 0.8);
}
.video-js .vjs-big-play-button:focus {background-color: #ffffff; background-color: rgba(255,255,255,0.5);}
.video-js .vjs-big-play-button {color: #fff; background-color: #000; background-color: rgba(0,0,0,0.1);}
.video-js:hover .vjs-big-play-button {background-color: #000; background-color: rgba(0,0,0,0.3);}

/* Slider - used for Volume bar and Progress bar */
.video-js .vjs-slider {
	background-color: #fff;
	background-color: rgba(255, 255, 255, 0.5);
}

/* The load progress bar also has internal divs that represent
   smaller disconnected loaded time ranges */
.video-js .vjs-load-progress div {
	background: ligthen(#000000, 50%);
	background: rgba(0, 0, 0, 0.75);
}
.vjs-menu li:focus, .vjs-menu li:hover {color: #fff; background: #000;}
.vjs-fullscreen {background: #000;}
.vjs-menu li:focus, .vjs-menu li:hover {color: #fff; background: #000;}

.video-js.vjs-fluid, .video-js.vjs-16-9, .video-js.vjs-4-3 {height: auto;}

/* Modals */
.modal {opacity: 0; visibility: hidden; z-index: -1; position: fixed; top: 0; left: 0; height: 100%; width: 100%; background: #091d21; background: rgba(9,29,33,0.5);}
.modal.show {z-index: 500; opacity: 1; visibility: visible;}
.modal-wrapper {max-width: 700px; width: 100%; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fff; box-shadow: 0px 10px 64px rgba(0,0,0,0.3);}
.modal-small .modal-wrapper {max-width: 420px;}
.modal-content {margin: 32px 26px 32px 32px; position: relative; height: calc(100vh - 12em); max-height: 640px;}
#contact_overlay .modal-content {max-height: 440px;}
.modal-small .modal-content {height: auto;}
.modal-close {position: absolute; z-index: 1; right: 0.5em; top: 0.5em; height: 36px; width: 36px; font-size: 24px; color: #545454; line-height: 36px; text-align: center; cursor: pointer;}
.modal-close:focus {color: #000;}
.modal-header {font-size: 1.5em; text-transform: uppercase; letter-spacing: 0.1em;}
.modal-body {overflow: auto; position: absolute; top: 3em; bottom: 0; width: 100%; padding-right: 2em; -webkit-overflow-scrolling: touch; font-size: 14px; line-height: 1.35em; color: #000;}
.modal-small .modal-body {position: relative; top: auto; overflow: visible;}
.modal-content h3 {color: #000; font-size: 1em; letter-spacing: 0.1em; text-transform: uppercase; font-family: 300;}
.modal-body ol {list-style-type: decimal;}

.modal.height-auto .modal-content {height: auto; max-height: none;}
.modal.height-auto .modal-body {position: static; margin-top: 1em;}


.menu-icon {display: none; position: absolute; top: 16px; left: 12px; height: 32px; width: 32px; cursor: pointer;}
.menu-icon span {position: absolute; top: 8px; display: block; height: 2px; width: 100%; background: #222; opacity: 1;
	transition: all 0.15s ease-in-out;
}
.menu-icon span:nth-child(2) {position: absolute; top: 15px; display: block; height: 2px; width: 100%; background: #222;}
.menu-icon span:nth-child(3) {position: absolute; top: 22px; display: block; height: 2px; width: 100%; background: #222;}

.show-menu .menu-icon span:nth-child(1), .show-menu .menu-icon span:nth-child(3) {top: 16px;}
.show-menu .menu-icon span:nth-child(1) {transform: rotate(45deg);}
.show-menu .menu-icon span:nth-child(2) {opacity: 0;}
.show-menu .menu-icon span:nth-child(3) {transform: rotate(-45deg);}

.search-icon {display: none; cursor: pointer; height: 32px; width: 32px; position: absolute; text-align: center; right: 12px; top: 16px; font-size: 22px; line-height: 30px;}

/* medium screens */
@media (max-width: 1230px){
	.searchbar {width: 20%;}
	.main-nav {margin-left: 120px; letter-spacing: 2px;}
}
@media (max-width: 1150px){
	.main-nav > ul > li {margin-left: 8px;}
}
/* tablet small screens */
@media (max-width: 1024px){
	body {padding-top: 60px;}
	.menu-icon, .search-icon {display: block;}
	.header {position: fixed; z-index: 30; top: 0; left: 0; height: 60px; width: 100%; padding: 0;}
	.header .logo {position: absolute; top: 10px; left: 50%; height: 42px; width: 60px; margin: 0; text-align: center; transform: translateX(-50%);}
	.nav {position: fixed; top: 60px; left: 0; right: 0; bottom: 0; overflow: auto; visibility: hidden; opacity: 0; background: #fff; transform: scale(1.25);
		transition: all 0.15s ease-in-out;
	}
	.show-menu .nav {visibility: visible; opacity: 1; transform: scale(1);}
	.nav-inner {display: flex; min-height: 100%; width: 100%; padding: 12px; flex-direction: column; justify-content: center; align-items: center; text-align: center;}
	.main-nav {padding: 0; margin-left: 0px;}
	.main-nav ul li, .top-nav ul li {display: block; padding: 0.5em 0; margin-left: 0;}
	.top-nav {padding-bottom: 1em; margin-bottom: 1em;}
	.top-nav:after {content: ''; position: relative; top: 1em; display: block; height: 1px; width: 3em; left: 50%; transform: translateX(-50%); background: #222;}
	.searchbar {position: absolute; top: 60px; left: 0; right: 0; bottom: auto; width: 100%; background: #fff; visibility: hidden; opacity: 0;
		transition: all 0.15s ease-in-out;
	}
	.show-search .searchbar {opacity: 1; visibility: visible;}
	.searchbar .row {padding: 0 12px;}
	.searchbar .search-submit {top: 12px; right: 12px;}
	.searchbar .search-options {padding-top: 8px;}
}
/* mobile */
@media (max-width: 768px){
	.h_slideshow {height: 65vw;}
	.offices, .offices .office {display: block; width: 100%;}
	.offices .office {margin: 1em 0;}
	.pricing-table tr {grid-template-columns: repeat(2, 1fr);}
	.footer .row {display: block; width: 100%; max-width: none;}
	.footer .col {display: block; width: 100%; text-align: center;}
}

@media (max-width: 560px) {
	body {font-size: 0.75em;}
	.nav {font-size: 1.5em;}
	.section.page .content {padding: 1em;}
	.section-grid {padding: 0;}
	.tabbar {float: none; margin-bottom: 1em;}
	.offices .office {padding-top: 0;}
	.offices .office .office-text, .offices .office .office-image {position: static;}
	.footer {padding: 40px 12px;}
	.footer .social-links li {margin: 0 0.75em;}
}
