/**
 *	Theme Name: Mariart Design Studio Custom Theme
 *	Author: Mariart Design Studio
 *	Author URI: https://www.mariart.com.au
 *	Description: This is our very own custom-made website theme. Come and see us and we can build you your own custom-designed and built website.
 *	Version: 2019
 *	Text Domain: mariart
 */

/*  ********************************************************************************  **
**  ********************************************************************************  **
 
	Website Colours:
	
		Text and Dark Blue:			#343E46		rgb(52, 62, 70)
		Light Grey Text:			#9B9EA3		rgb(155, 158, 163)
		Green:						#A9AD00		rgb(169, 173, 0)
		Light Grey:					#F1F3F2		rgb(241, 243, 242)
		
**  ********************************************************************************  **
**  ********************************************************************************  */




/*  ********************************************************************************  **
 
	Standard HTML Elements
 
**  ********************************************************************************  */
 
body {
	margin: 0;
	padding: 0;
}




/*  ********************************************************************************  **
 
 	Page Containers
 
**  ********************************************************************************  */
 
 /*  **********  Content Blocks  **********  */
 
 #masthead,
 #colophon,
 #services-footer,
.content-block {
 	margin: 0;
	padding: 80px 100px;
}
.content-block-casestudy-image
{
 	margin: 0;
	padding: 25px;
}

#masthead > .wrap,
#colophon > .wrap,
#services-footer > .wrap,
.content-block > .wrap {
	display: block;
	position: relative;
	max-width: 1800px;
	margin: 0 auto;
	padding: 0;
}
.content-block.narrow > .wrap {
	max-width: 1200px;
}
.content-block.service_single {
	padding: 50px 100px 20px 100px;
}

/*  **********  Content Blocks Updates  **********  */

#masthead {
	padding-top: 0;
	padding-bottom: 0;
}
#colophon,
#services-footer {
	padding-top: 30px;
	padding-bottom: 30px;
}
#casestudy-content-container.content-block {
	padding-top: 0;
	padding-bottom: 0;
}
.single-casestudy .content-block > .wrap,
#casestudy-gallery.content-block > .wrap {
	max-width: 1100px;
}
.content-block.slider-block {
	/* padding-left: 0;
	pad ding-right: 0; */
	background: #343E46;
}

/*  **********  Special Cases  **********  */

.content-block > .wrap > h1:first-child,
.content-block > .wrap > h2:first-child,
.content-block > .wrap > p:first-child,
.content-column > .wrap > h1:first-child,
.content-column > .wrap > h2:first-child,
.content-column > .wrap > p:first-child {
	margin-top: 0;
}







.bordered {
	box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
}




/*  **********  Dual Background Blocks  **********  */

.content-block-dual-background {
	width: 100%;
	margin: 0;
	padding: 0;
	display: table;
}
.content-block-dual-background > .row {
	display: table-row;
}
.content-block-dual-background > .row > .cell {
	display: table-cell;
	width: 50%;
}
.content-block-dual-background > .row > .cell > .wrap {
	width: 100%;
	max-width: 1000px;
	padding: 80px 100px;
	margin: 0 0 0 auto;
	box-sizing: border-box;
}
.content-block-dual-background > .row > .cell.right > .wrap {
	margin: 0 auto 0 0;
}
.content-block-dual-background > .row > .cell.left > .wrap {
	padding: 80px 100px;
}



/*  **********  Columns  **********  */

.content-column {
	float: left;
	width: 47.5%;
	width: calc((100% - 100px) / 2);
}
.content-column.position-right {
	float: right;
	padding-right: 0px !important;
}
.content-column.size-third {
	width: 30%;
	width: calc((100% - 200px) / 3);
	padding-right: 100px;
}
.content-column.size-twothirds {
	width: 65%;
	width: calc(((100% - 200px) / 3 * 2) + 100px);
}
h6,
.leadin {
	font-size: 18px;
	line-height: 36px;
	font-weight: bold;
}
h6 {
	margin-bottom: 20px;
}
.content-column.size-third img {
	margin-bottom: 30px;
	height: 67px;
	width: 67px;
}

h1 {
	font-size: 32px;
	line-height: 50px;
}




/*  ********************************************************************************  **
 
	Header
 
**  ********************************************************************************  */

body {
	padding-top: 90px;
}
body > * {
	position: relative;
	z-index: 0;
}

#masthead {
	box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
	height: 90px;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 99;
	background: #FFFFFF;
	transition: height 0.2s;
}
/*  **********  Modify position for logged in users  *********  */
body.logged-in #masthead {
	top: 32px;
}




/*  **********  Logo  **********  */

#mariart-header-logo {
	height: 65px;
	padding: 10px 0;
	width: auto;
	display: inline-block;
	transition: height 0.2s;
}





/*  ********************************************************************************  **
 
	Main Menu
 
**  ********************************************************************************  */

#mobile-menu {
	display: none;
}

#primary-menu {
	position: absolute;
	top: 0;
	right: 0;
}

.sf-menu {
	margin: 0;
	padding: 0;
}
.sf-menu li {
	margin: 0;
	padding: 0;
	background: none;
	border: none;
}
.sf-menu a {
	color: #343E46;
	text-transform: uppercase;
	background: #FFFFFF;
	letter-spacing: 0.15em;
}




/*  **********  First Level  **********  */

.sf-menu > li > a {
	line-height: 90px;
	margin: 0;
	padding: 0 20px;
	border: none;
	border-left: 1px solid #FFFFFF;
	font-weight: bold;
	font-size: 13px;
	transition: line-height 0.2s;
}
.sf-menu > li > a:hover,
.sf-menu > li.sfHover > a,
.sf-menu > li.current-menu-item > a,
.sf-menu > li.current-menu-parent > a,
.sf-menu > li.current-menu-ancestor > a {
	color: #A9AD00;
}
.sf-menu > li > a:hover,
.sf-menu > li.sfHover > a {
	line-height: 90px;
	margin: 0;
	padding: 0 20px;
	border-left: 1px solid #A9AD00;
	color: #A9AD00;
}




/*  **********  Sub Levels  **********  */
.sf-menu ul {
	box-shadow: none;
	background: #FFFFFF;
	border-left: 1px solid #A9AD00;
	padding: 10px 0;
}
.sf-menu ul li {
	background: none;
}
.sf-menu ul li a {
	background: rgba(255, 255, 255, 0.9);
	padding: 8px 17px;
	font-size: 13px;
}
.sf-menu ul li a:hover,
.sf-menu ul li.sfHover > a,
.sf-menu ul li.current-menu-item > a,
.sf-menu ul li.current-menu-parent > a,
.sf-menu ul li.current-menu-ancestor > a {
	background: #FFFFFF;
	color: #A9AD00;
}




/*  ********************************************************************************  **
 
	"Sticky" header changes
 
**  ********************************************************************************  */

#masthead.sticky {
	height: 70px;
}
#masthead.sticky #mariart-header-logo {
	height: 45px;
}
#masthead.sticky .sf-menu > li > a {
	line-height: 70px;
}





/*  ********************************************************************************  **
 
	Footer
 
**  ********************************************************************************  */

#colophon {
	border-top: 1px solid #F1F3F2;
	background: #FFFFFF;
}

#footer-links,
#footer-links li {
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: center;
}
#footer-links li {
	display: inline-block;
	margin: 0 30px;
	text-transform: uppercase;
	letter-spacing:0.14em;
	font-size:11px;
}
#footer-links li a {
	color: #343E46;
	text-decoration: none;
}
#footer-links li a:hover {
	text-decoration: underline;
}




#services-footer {
	background: #343E46;
}
#services-footer > .wrap {
	text-align: center;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	flex-wrap: wrap;
}
#services-footer a {
	display: inline-block;
	margin: 5px 10px;
	color: #FFFFFF;
	text-decoration: none;
	text-transform: uppercase;
}
#services-footer a:hover {
	color: #A9AD00;
}





/*  ********************************************************************************  **
 
	Services
 
**  ********************************************************************************  */

#services-contact,
#services-seo-content {
	text-align: center;
}
#services-contact {
	color: #FFFFFF;
	background: #A9AD00;
}
#services-contact.special {
	color: #343E46;
	background: #F1F3F2;
}
#our-story-content {
	background: #FFFFFF;
}

#blocks-special .cell.right {
	color: #FFFFFF;
}


#services-show-more-container {
	margin-top: 50px;
}


#service-testimonial {
	background: #343E46;
	color: #FFFFFF;
}
#service-testimonial h2 {
	border-top: 1px solid #A9AD00;
	padding-top: 40px;
	margin-bottom: 30px;
}

#service-testimonial p {
	font-size: 16px;
}
#service-testimonial p.services-test-name {
	font-size: 14px;
}

.service-test-gallery,
.service-test-gallery li {
	margin: 0;
	padding: 0;
	list-style: none;
}
.service-test-gallery li {
	float: left;
	width: 47.5%;
	width: calc((100% - 20px) / 2);
}
.service-test-gallery li:last-child {
	float: right;
}
.service-test-gallery li img {
	display: block;
	width: 100%;
	height: auto;
}

.narrow-service-testimonial {
	text-align: center;
	max-width: 1100px;
	margin: 0 auto;
}


#service-news {
	background: #A9AD00;
	color: #FFFFFF;
}
#service-news img,
.cell.left img {
	width: 100%;
	height: auto;
	display: block;
}.cell.left img {
	margin-top: 60px;
}
#service-news h2 a,
.cell.left h2 a {
	color: #FFFFFF;
	text-decoration: none;
}
.cell.left h2,
.cell.right h2 {
	margin: 40px 0 20px 0;
}
.cell.left h2 a {
	color: #343E46;
}
.feature .service_single h2,
p.service-heading {
	margin-bottom: 20px;
}
.feature .service_single h1,
#page-breadcrumb h1,
.home .content-column.position-left h1,
h1.small-grey {
	font-size: 14px;
	line-height: 32px;
	font-weight: normal;
	margin: 0;
	font-family: "brown", "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	color: #C2C5C7;
	text-transform: uppercase;
}

.single-services .cell.right .gform_wrapper ul.gform_fields li.gfield {
	padding-top: 0;
}
.single-services .hs-button,
.single-services .cell.right .gform_wrapper .gform_footer input.button {
	background-color: transparent;
	border-color: #FFFFFF;
	color: #FFFFFF;
}

.single-services .cell.right .more-link {
	background: none;
}

body.single-services .cell.right .gform_wrapper ul li.gfield {
	margin-top: 8px;
}
body.single-services .cell.right .gform_wrapper .top_label div.ginput_container {
	margin-top: 0px !important;
}
.single-services .cell.right .gform_wrapper .field_sublabel_below .ginput_complex.ginput_container label,
.single-services .cell.right .gform_wrapper .field_sublabel_below div[class*="gfield_time_"].ginput_container label {
	margin: 1px 0 0 1px;
}
.single-services .cell.right  .gform_wrapper input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]) {
	line-height: 20px;
}

.single-services .cell.right p {
	margin-top: 15px;
}
.single-services .cell.right p.feature {
	margin-top: 30px;
	font-weight: bold;
}
.single-services .cell.right h3 {
	font-size: 21px;
	line-height: 40px;
	font-family: "brown", "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
}

.single-services .cell.right li {
	margin-left: 0;
	padding-left: 14px;
	background: url("assets/images/shared/list_dot.png") left top 12px no-repeat;
	list-style: none;
	background-size: 5px 5px;
}
.single-services .cell.right .gform_wrapper li {
	padding-left: 0;
}
.single-services .cell.right ul {
	margin-left: 0;
	padding-left: 0;
}




.service-casestudy-image {
	position: relative;
	padding-left: 40px;
	padding-bottom: 31px;
}
.service-casestudy-image img {
	position: relative;
	z-index: 0;
	display: block;
}
.service-casestudy-image .more-link-container {
	position: absolute;
	left: 0;
	bottom: 0;
}




.hs-form-field input,
.hs-form-field textarea {
	width: calc(100% - 10px) !important;
}
.hs-form-field input[type=checkbox],
.hs-form-field input[type=radio] {
	width: auto !important;
}



/*  ********************************************************************************  **
 
	Team Page
 
**  ********************************************************************************  */

.team-display {
	background: #F1F3F2;
}

.team-person-container {
	float: left;
	width: 47.5%;
	width: calc((100% - 80px) / 2);
	margin-top: 120px;
	clear: both;
	position: relative;
	background: #FFFFFF;
}
.team-person-container:nth-child(2n) {
	float: right;
	clear: none;
}
.team-person-container:first-child,
.team-person-container:nth-child(2) {
	margin-top: 0;
}

.team-person-container .image-container {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 350px;
	background-size: cover;
	background-position: top 80px center;
	background-repeat: no-repeat;
}
.bio-name-container {
	background: #343E46;
	padding: 20px;
}
.bio-name-container p {
	color: #FFFFFF;
	margin: 0;
	text-align: center;
}
.bio-name-container p.name {
	font-size: 18px;
	line-height: 29px;
	font-weight: bold;
}
.bio-name-container p.position {
	font-weight: 16px;
	line-height: 29px;
	color: #A9AD00;
}

.bio-container {
	margin-left: 350px;
	padding: 80px 50px 50px 50px;
	position: relative;
	background: #FFFFFF;
}
.bio-links-container {
	position: absolute;
	top: -30px;
	left: 50px;
}
.bio-links-container a {
	background: #FFFFFF;
	border: 1px solid #A9AD00;
	margin: 0 5px 0 0;
	padding: 0 25px;
	font-size: 13px;
	font-weight: bold;
	line-height: 58px;
	color: #343E46;
	text-decoration: none;
	display: inline-block;
	text-transform: uppercase;
	letter-spacing: 0.15em;
}
.bio-links-container a.active {
	background: #A9AD00;
	color: #FFFFFF;
}




.bio-data-table {
	width: 100%;
	border-collapse: collapse;
}
.bio-data-table tr {
	vertical-align: top;
}
.bio-data-table th,
.bio-data-table td {
	text-align: left;
	border-bottom: 1px solid #A9AD00;
	padding: 15px 0;
}
.bio-data-table th,
.bio-data-table td span {
	font-weight: bold;
}




.bio-area.fun {
	display: none;
}




/*  ********************************************************************************  **
 
	Case Study Page
 
**  ********************************************************************************  */

h1.casestudy-title {
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 10px 30px;
  margin: 0;
  background: rgba(255,255,255, 0.8);
  text-align: center;
  max-width: 400px;
  display: inline-block;
  font-size: 50px;
  line-height: 80px;
}
h1.casestudy-title span {
	border: none;
	padding: 0;
}



.gallery-item-container {
	width: auto;
	margin: 0 0 50px 0;
}
.gallery-item-container.image.position-half-left,
.gallery-item-container.image.position-half-right {
	width: 47.5%;
	width: calc((100% - 50px) / 2);
	float: left;
}
.gallery-item-container.image.position-third-left,
.gallery-item-container.image.position-third-right {
	width: 33%;
	width: calc((100% - 50px) / 3);
	float: left;
}
.gallery-item-container.image.position-twothirds-left,
.gallery-item-container.image.position-twothirds-right {
	width: 65%;
	width: calc((100% - 50px) / 3 * 2);
	float: left;
}
.gallery-item-container.image.position-half-right,
.gallery-item-container.image.position-third-right,
.gallery-item-container.image.position-twothirds-right {
	float: right;
	clear: none;
}
.gallery-item-container img {
	width: 100%;
	height: auto;
	display: block;
}


#casestudy-content-block {
	display: table;
	border-collapse: collapse;
	width: 100%;
}
#casestudy-content-block > .wrap {
	display: table-row;
	vertical-align: top;
}

.casestudy-content-left,
.casestudy-content-right {
	display: table-cell;
}
.casestudy-content-right {
	width: 360px;
}
.casestudy-content-left > .wrap,
.casestudy-content-right > .wrap {
	padding: 100px;
}
.casestudy-content-left > .wrap {
	padding-bottom: 0;
	padding-left: 0;
}
.casestudy-content-right > .wrap {
	padding-right: 0;
}
.casestudy-content-right > .wrap h2 {
	margin-bottom: 30px;
}

#casestudy-content-container {
	position: relative;
}
#casestudy-content-container > .wrap {
	position: relative;
	z-index: 1;
}
.casestudy-content-block-underlay {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	width: 33%;
	z-index: 0;
}
.casestudy-testimonial-divider {
	height: 1px;
	background: #A9AD00;
	padding: 0;
	margin: 50px 0 30px 0;
}
.casesudy-testimonial {
	font-size: 17px;
	line-height: 30px;
	margin: 0 0 20px 0;
}
.casesudy-testimonial-name {
	font-size: 18px;
	line-height: 36px;
	margin: 0;
}
.casestudy-testimonial-company {
	font-size: 14px;
	line-height: 26px;
	margin: 0;
}





/*  ********************************************************************************  **
 
	Services List Page
 
**  ********************************************************************************  */

#services-list.content-block {
	padding-top: 0;
}

.services-list-item {
	float: left;
	width: 22.75%;
	width: calc((100% - 150px) / 4);
	margin: 50px 0 0 3%;
	margin-left: calc(50px);
	text-align: center;
	position: relative;
}
.services-list-item:nth-child(4n + 1) {
	margin-left: 0;
	clear: left;
}

.services-list-item img {
	display: block;
	margin: 0 auto;
	width: auto;
	height: 120px;
}




.service-overview-panel,
.service-detail-panel {
	margin: 0;
	padding: 0;
	position: relative;
	background: #F1F3F2;
	border-bottom: 5px solid #A9AD00;
	z-index: 0;
	box-sizing: border-box;
}
.service-overview-panel > .wrap,
.service-detail-panel > .wrap {
	padding: 30px;
}
.service-overview-panel {
	background: #A9AD00;
	border-top: none;
	border-bottom: none;
	z-index: 1;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 100%;
	overflow: hidden;
}
.service-overview-panel.visible {
	border-top: 5px solid #F1F3F2;
}
.service-overview-panel > .wrap {
	padding-top: 90px;
}
.service-detail-panel > .wrap {
	padding-bottom: 90px;
}

.services-list-item .arrow {
	position: absolute;
	bottom: 0;
	left: calc(50% - 30px);
	width: 60px;
	height: 60px;
	background: #A9AD00;
	background-image: url("assets/images/services/arrow_up.png");
	background-position: center;
	background-size: 20px 17px;
	background-repeat: no-repeat;
	cursor: pointer;
}
.services-list-item .service-overview-panel .arrow {
	bottom: auto;
	top: 0;
	background-color: #F1F3F2;
	background-image: url("assets/images/services/arrow_down.png");
}




.service-title a {
	color: #343E46;
	text-decoration: none;
	font-size: 18px;
	line-height: 29px;
	font-weight: bold;
	background: url("assets/images/shared/more-link-green.png") center right no-repeat;
	background-size: 16px 16px;
	padding-right: 30px;
}




.service-overview-panel .service-title {
	margin: 0 0 20px 0;
}
.service-overview-panel .service-title a {
 	color: #FFFFFF;
	background-image: url("assets/images/shared/more-link-white.png");
}
.service-subs,
.service-subs li {
	margin: 0;
	padding: 0;
	list-style: none;
	color: #FFFFFF;
}
.service-subs li {
	padding: 10px 0;
	border-bottom: 1px solid #FFFFFF;
}





/*  ********************************************************************************  **
 
	Insights (blog area)
 
**  ********************************************************************************  */

/*  **********  Archive  **********  */

.archive-container article {
	float: left;
	width: 30%;
	width: calc((100% - 200px) / 3);
	margin: 50px 0 0 5%;
	margin-left: calc(100px);
	clear: none;
}
.archive-container article:first-child,
.archive-container article:nth-child(3n + 1) {
	margin-left: 0;
	clear: left;
}
.archive-container article .entry-header {
	position: relative;
}
.archive-container article img {
	display: block;
	width: 100%;
	height: auto;
	position: relative;
	z-index: 0;
}
.archive-container article .article-date {
	position: absolute;
	right: 20px;
	bottom: -20px;
	width: 50px;
}
.archive-container article .article-date span {
	height: 20px;
	line-height: 20px;
	display: block;
	text-align: center;
}
.archive-container article a {
	color: #343E46;
	text-decoration: none;
}
.archive-container article a .article-date span {
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	line-height: 20px;
	background-color: #FFFFFF;
	letter-spacing: 0.15em;
}
.archive-container article a .article-date span.article-date-day {
	line-height: 32px;
	height: 32px;
}
.archive-container article a .article-date span.article-date-month {
	background-color: #A9AD00;
	color: #FFFFFF;
	font-size: 11px;
	line-height: 20px;
}
.archive-container article p {
	margin: 20px 0;
}
.archive-container article p.feature-large {
	margin: 30px 0 20px;
}

.archive-container article p.archive-read-more {
	margin-top: 30px;
}


.nav-links {
	display: block;
	padding: 50px 0;
	text-align: center;
}
.nav-links a,
.nav-links span {
	display: inline-block;
	font-size: 13px;
	font-weight: 500;
	line-height: 18px;
	padding: 6px 10px;
	margin: 0 5px;
	border: 1px solid #343E46;
	color: #343E46;
	text-decoration: none;
}
.nav-links a {
	color: #A9AD00;
	border-color: #A9AD00;
}
.nav-links a:hover {
	background-color: #A9AD00;
	color: #FFFFFF;
}




/*  **********  Single Insights Pages  *********  */

.single-post-feature-image {
	display: block;
	width: 100%;
	max-width: 1100px;
	height: auto;
	margin: 0 auto;
}

.content-block.single-post-item > .wrap {
	max-width: 1100px;
}
.content-block.single-post-item h1 {
	margin-top: 0;
}
.content-block.single-post-item h2,
.content-block.single-post-item h3,
.content-block.single-post-item h4,
.content-block.single-post-item h5,
.content-block.single-post-item h6 {
	margin: 50px 0 30px 0;
}

.content-block.single-post-item hr {
	width: 100%;
	height: 2px;
	margin: 40px 0;
	background: #F1F3F2;
	border: none;
}





/*  ********************************************************************************  **
 
	Shared and Common Styles
 
**  ********************************************************************************  */

.clear {
	clear: both;
}




.content-column.position-left h1 {
	text-align: right;
}
.single-post .content-column.position-left h1 {
	text-align: left;
}




/*  **********  Forms  **********  */

.gform_wrapper .ginput_complex .ginput_left input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="image"]):not([type="file"]),
.gform_wrapper .ginput_complex .ginput_right input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="image"]):not([type="file"]), 
.gform_wrapper .ginput_complex .ginput_right select, .gform_wrapper .ginput_complex input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="image"]):not([type="file"]), .gform_wrapper .ginput_complex select,
.gform_wrapper input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]),
.gform_wrapper textarea {
	border: 1px solid #A9AD00;
}
.gform_wrapper .gfield_required {
	color: #A9AD00 !important;
}
.gform_wrapper ul.gfield_checkbox li, 
.gform_wrapper ul.gfield_radio li {
	width: 32%;
	margin: 0 0 5px 1%;
	float: left;
}
.gform_wrapper ul.gform_fields li.gfield {
	padding-top: 20px;
}




/*  **********  Feature Image  **********  */

#feature-image,
#feature-image-video {
	width: 100%;
	margin: 0;
	padding: 0;
	position: relative;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	height: 600px;
}
#feature-image {
	height: 400px;
}


#video_container {
	width: 100%;
	height: 700px;
}


#banner {
    height: 550px;
    background-position: center center;
    background-size: cover;
    overflow: hidden;
}




/*  **********  Creative Services List  **********  */

.services-list-column,
.services-list-column li {
	margin: 0;
	padding: 0;
	list-style: none;
}
.services-list-column {
	float: left;
	width: 50%;
}
.services-list-column li a {
	display: inline-block;
	margin: 0;
	padding: 15px 28px 15px 0;
	color: #343E46;
	text-decoration: none;
	text-transform: uppercase;
	background-position: center right;
	background-repeat: no-repeat;
	background-image: url("assets/images/shared/more-link-green.png");
	background-size: 0;
	transition: background-size 0.2s;
	letter-spacing:0.14em;
	font-size:13px;
}
.services-list-column li a:hover {
	background-size: 16px;
	transition: background-size 0.2s;
}




/*  **********  Ready to get started? Block **********  */

.ready-to-get-started {
	background-color: #ADAD00;
	color: #FFFFFF;
}.ready-to-get-started h2 span {
	border-color: #FFFFFF;
}




/*  **********  Casestudy Display Block  **********  */

#casestudy-service-filter {
	background-color: #F1F3F2;
	color: #FFFFFF;
	text-align: center;
}
/*
#casestudies-services-selector,
#casestudies-services-selector li {
	margin: 0;
	padding: 0;
	list-style: none;
}
#casestudies-services-selector li {
	display: inline-block;
	margin: 0 20px 20px 0;
}

.casestudy-service-fiter.selected {
	background: #A9AD00;
	color: #FFFFFF;
	cursor: default;
}
*/
#casestudy-services-select {
	background: url("assets/images/casestudy/casestudy_select.png") center right no-repeat #FFFFFF;
	background-size: contain;
	border: 1px solid #A9AD00;
	color: #343E46;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 13px;
	line-height: 30px;
	font-weight: bold;
	display: inline-block;
	padding: 15px 25px;
	vertical-align: middle;
	letter-spacing: 0.15em;
	-webkit-appearance: none;
	appearance: none;
	border-radius: 0;
	padding-right: 87px;
	font-family: "brown", "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
}
#casestudy-services-select option {
	font-weight: normal;
	text-transform: none;
}






.home .content-block.casestudy-display,
.single-services .content-block.casestudy-display {
	background: #343E46;
	color: #FFFFFF;
}
.casestudy-display-container,
.casestudy-slider-container {
	margin: 0;
	padding: 0;
	list-style: none;
}
.casestudy-slider-container li,
.casestudy-display-container li {
	width: calc((100% - 150px) / 4);
	margin: 0 0 80px 50px;
	float: left;
	position: relative;
}
.casestudy-display-container li:first-child,
.casestudy-display-container li:nth-child(4n+ 1) {
	margin-left: 0;
	clear: left;
}
.casestudy-slider-container li,
.casestudy-display-container li img {
	position: relative;
	z-index: 0;
	width: 100%;
	height: auto;
}
.casestudy-display-container li > a {
	display: block;
	padding-left: 30px;
}
.casestudy-slider-container li .footer-link {
	position: absolute;
	z-index: 1;
	bottom: -31px;
	left: -30px;
}
.casestudy-display-container li .footer-link {
	position: absolute;
	z-index: 1;
	bottom: -25px;
	left: 0;
}

.casestudy-display-container li.testimonial,
.testimonial {
	padding: 40px 0;
	border-top: 1px solid #A9AD00;
}
.casestudy-display-container li.testimonial .footer-link, 
.testimonial .footer-link {
	left: 0;
}
.casestudy-display-container li.testimonial p.content,
.testimonial p.content {
	font-size: 21px;
	line-height: 40px;
	margin: 0 0 20px 0;
	/* font-style: italic; */
}
.casestudy-display-container li.testimonial p.name,
.casestudy-display-container li.testimonial p.company, 
.testimonial p.name, .testimonial p.company {
	margin: 0;
}
.casestudy-display-container li.testimonial p.name,
.testimonial p.name {
	font-size: 18px;
	line-height: 36px;
}
.casestudy-display-container li.testimonial p.company, 
.testimonial p.company {
	font-size: 14px;
	line-height: 26px;
}
.casestudy-display-container li.testimonial .light > .more-link {
	color: #343E46;
}
.home .casestudy-display-container li.testimonial .light > .more-link {
	color: #FFFFFF;
}
.testimonial_data {
	padding-right: 50px;
}


.lightbg {
	background-color: #FFFFFF;
}
.lightbg .testimonial_data {
	color: #343E46;
}
.lightbg .more-link { 
	color: #343E46;
}


.slider-block > .wrap {
	max-width:100%;
}
.bx-wrapper { 
	max-width: 99% !important;
	padding: 38px;
	margin-bottom: 0px;
}
.bx-viewport {
	height: 500px !important;
	width: 98% !important;
	margin-left: 10px;
}




/*  **********  Breadcrumbs  **********  */

#page-breadcrumb {
	position: absolute;
	top: -65px;
	left: 0;
	right: 0;
	text-align: center;
}
#page-breadcrumb ul,
#page-breadcrumb ul li {
	margin: 0;
	padding: 0;
	list-style: none;
	margin-top:10px;
}
#page-breadcrumb ul li {
	display: inline-block;
	text-transform: uppercase;
	line-height: 30px;
	color: #999FA3;
	letter-spacing:0.14em;
	font-size:11px;
}
#page-breadcrumb ul li:before {
	content: ' / ';
}
#page-breadcrumb ul li:first-child:before {
	content: '';
}
#page-breadcrumb ul li a {
	color: #999FA3;
	text-decoration: none;
}
#page-breadcrumb ul li a:hover {
	text-decoration: underline;
}




/*  ********************************************************************************  **
 
	Case Study Slider Block
 
**  ********************************************************************************  */

.casestudy-display.slider-block h2 {
	text-align: center;
	color: #FFFFFF;
}




/*  ********************************************************************************  **
 
	Difference Block
 
**  ********************************************************************************  */

ul.differences-list,
ul.differences-list li {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 0;
	text-align: center;
	vertical-align: top;
}
ul.differences-list li {
	font-size: 14px;
	display: inline-block;
	width: 30%;
	width: calc((100% - 200px) / 3);
	margin-left: 5%;
	margin-left: calc(100px);
	margin-top: 100px;
}
ul.differences-list li:first-child,
ul.differences-list li:nth-child(3n + 1) {
	margin-left: 0;
}
ul.differences-list li img.difference-icon {
	display: block;
	margin: 0 auto;
	width: 100%;
	max-width: 85px;
	height: auto;
	margin-bottom: 50px;
}




/*  ********************************************************************************  **
 
	Single Info block
 
**  ********************************************************************************  */

.single-info-block {
	text-align: center;
}




/*  ********************************************************************************  **
 
	Shared and Common Styles
 
**  ********************************************************************************  */

.background-grey {
	background-color: #F1F3F2;
}
.background-dark {
	background-color: #343E46;
	color: #FFFFFF;
}
.background-pattern,
.background-pattern-dark,
.background-pattern.dark {
	background-color: #F1F3F2;
	background-image: url("assets/images/landing/pattern.png");
	background-position: center center;
	background-repeat: repeat;
	background-attachment: fixed;
	background-size: 556px 556px;
}
.background-pattern-dark,
.background-pattern.dark {
	background-color: #343E46;
	background-image: url('assets/images/landing/pattern_dark.png');
	color: var(--colour-white);
}




ul.casestudy-slider-container.slider-items {
	position: relative;
}
ul.casestudy-slider-container.slider-items li {
	padding: 0 20px;
	box-sizing: border-box;
	position: relative;
	z-index: 0;
}
ul.casestudy-slider-container.slider-items li img {
	width: 100%;
	height: auto;
	display: block;
}
ul.casestudy-slider-container.slider-items li .footer-link {
	left: 0;
}

ul.casestudy-slider-container.slider-items button.slick-arrow {
	position: absolute;
	left: -30px;
	top: 50%;
	margin-top: -20px;
	width: 40px;
	height: 40px;
	overflow: hidden;
	z-index: 2;
	background: url("assets/images/shared/more-link-white-left.png") center center no-repeat #A9AD00;
	border: none;
	background-size: 10px 10px;
	text-indent: 40px;
	cursor: pointer;
}
ul.casestudy-slider-container.slider-items button.slick-arrow.slick-next {
	left: auto;
	right: -30px;
	background-image: url("assets/images/shared/more-link-white.png");
}




.contact-right strong {
	font-weight: 600;
	color: #A9AD00;
}
.contact-right a {
	color: #343E46;
}
.content-column.contact-left {
	width: 65%;
	padding-right: 100px;
	box-sizing: border-box;
}
.content-column.contact-right {
	width: 35%;
	padding-left: 100px;
	box-sizing: border-box;
	background: #F1F3F2;
}

.contact-right {
	position: relative;
}
.contact-right > .wrap {
	position: relative;
	z-index: 2;
}
.contact-right-cover {
	position: absolute;
	top: -80px;
	bottom: 0;
	left: 0;
	right: -100px;
	background: #F1F3F2;
}



.mariart-map {
	height: 400px;
	padding: 0 -100px;
	margin: 50px -100px 0 -100px;
}




.content-video {
	width: 100%;
	max-width: 800px;
	height: auto;
	margin: 0 auto;
	padding-top: 50px;
}




.how-we-work-points {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}
.how-we-work-point {
	float: left;
	width: 33.3%;
	width: calc(100% / 3);
	padding: 0 30px;
	margin: 50px 0;
	box-sizing: border-box;
	text-align: center;
}
.how-we-work-point:nth-child(3n + 1) {
	clear: left;
}
.how-we-work-point img {
	display: block;
	margin: 0 auto;
	width: 70%;
	max-width: 140px;
	height: auto;
}


.contact-right img {
	width: 100%;
	max-width: 500px;
	height: auto;
	display: block;
}




.gform_wrapper label.gfield_label,
.gform_wrapper legend.gfield_label {
	font-weight: normal !important;
	font-size: 15px !important;
}
.gform_wrapper .field_sublabel_above .ginput_complex.ginput_container label, 
.gform_wrapper .field_sublabel_above div[class*="gfield_date_"].ginput_container label,
.gform_wrapper .field_sublabel_above div[class*="gfield_time_"].ginput_container label,
.gform_wrapper .field_sublabel_below .ginput_complex.ginput_container label, 
.gform_wrapper .field_sublabel_below div[class*="gfield_date_"].ginput_container label,
.gform_wrapper .field_sublabel_below div[class*="gfield_time_"].ginput_container label {
	font-size: 1em !important;
	letter-spacing: o !important;
}

.gform_wrapper .gform_footer input.button, .gform_wrapper .gform_footer input[type="submit"], .gform_wrapper .gform_page_footer input.button, .gform_wrapper .gform_page_footer input[type="submit"] {
	font-family: "brown", "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif" !important;
}

.gform_wrapper .gform_footer input.button, 
.gform_wrapper .gform_footer input[type="submit"], 
.gform_wrapper .gform_page_footer input.button,
.gform_wrapper .gform_page_footer input[type="submit"] {
	width: auto !important;
}




p.community-narrow-detail {
	padding-top: 20px;
	border-top: 1px solid #A9AD00;
	margin-left: auto;
	margin-right: auto;
	width: 80%;
	max-width: 800px;
}

.community-logos-container {
	padding-top: 50px;
	text-align: center;
	vertical-align: top;
	font-size: 0;
}
.community-logos-container img {
	display: inline-block;
	width: 20%;
	height: auto;
	margin: 30px 2.5% 0 2.5%;
}




.service-block {
	vertical-align: top;
	text-align: center;
	font-size: 0;
}
.service-block .service-col {
	float: left;
	width: 25%;
	padding: 30px 15px 0 15px;
	box-sizing: border-box;
}
.service-block.services-columns-3 .service-col {
	width: 33.3%;
	width: calc(100% / 3);
}
.service-block.services-columns-2 .service-col {
	width: 50%;
}


.service-col img {
	width: 100%;
	height: auto;
	display: block;
}




/*  ********************************************************************************  **
 
	Christmas 2020
 
**  ********************************************************************************  */

.background-christmas-2020 {
	background: url("assets/images/christmas-2020/christmas-2020.jpg") center right no-repeat #A9AD00;
	background-size: contain;
	color: #FFFFFF;
}
#christmas-2020-logos {
	text-align: center;
	vertical-align: middle;
}
#christmas-2020-logos img {
	vertical-align: middle;
	margin: 0 30px;
}

#christmas-2020-form:after {
	content: "";
	clear: both;
	display: table;
}
#christmas-2020-form .gform_wrapper .gform_body {
	float: left;
	width: calc(100% - 135px);
}
#christmas-2020-form .gform_wrapper ul.gform_fields li.gfield {
	float: left;
	width: calc(50% - 15px);
	clear: none;
	padding-right: 0 !important;
	margin: 0;
}
#christmas-2020-form .gform_wrapper ul.gform_fields li.gfield:first-child {
	margin-right: 25px;
}
#christmas-2020-form .gform_wrapper .gform_footer input.button,
#christmas-2020-form .gform_wrapper .gform_footer input[type="submit"],
#christmas-2020-form .gform_wrapper .gform_page_footer input.button,
#christmas-2020-form .gform_wrapper .gform_page_footer input[type="submit"] {
	margin: 20px 0 0 0;
}
#christmas-2020-form .gform_wrapper .gform_footer {
	float: right;
	width: 115px;
	clear: none;
}

#christmas-2020-form .gform_wrapper input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]),
#christmas-2020-form .gform_wrapper select {
	padding: 17px;
	border: 1px solid #A9AD00;
	font-size: 15px;
	line-height: 1.5em;
	width: 100%;
	box-sizng: border-box;
	appearance: none;
}
#christmas-2020-form .gform_wrapper select {
	background: url("assets/images/shared/more-link-green-down.png") center right 20px no-repeat;
	background-size: 20px 20px;
	-webkit-appearance: none;
	appearance: none;
}

@media screen and (max-width: 1000px) {
	.background-christmas-2020 .content-column {
		width: 60% !important;
	}
}
@media screen and (max-width: 800px) {
	.background-christmas-2020 {
		background-image: none;
	}
	.background-christmas-2020 .content-column {
		width: 100% !important;
	}
	#christmas-2020-form .gform_wrapper .gform_body,
	#christmas-2020-form .gform_wrapper .gform_footer {
		float: none;
		width: auto;
	}
	#christmas-2020-form .gform_wrapper ul.gform_fields li.gfield,
	#christmas-2020-form .gform_wrapper ul.gform_fields li.gfield:first-child {
		width: 100%;
		float: none;
		margin: 10px 0 0 0;
	}
}




div.hs-form-field,
div.hs-submit {
	margin: 10px 0;
}




.mariart-video-overlay-container {
	display: block;
	position: relative;
}
.landing-video .mariart-video-overlay-container {
	width: 100%;
	max-width: 900px;
	margin: 0 0 0 auto;
}
.mariart-video-overlay-container a.image-overlay {
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	text-decoration: none;
}
.mariart-video-overlay-container div.video-container {
	position: relative;
	display: block;
	z-index: 0;
}




.mariart-testimonial p {
	font-size: 24px;
	line-height: 1.6em;
}
.mariart-testimonial p.testimonial-name {
	font-size: 19px;
	font-weight: bold;
	margin-top: 30px;
}


.testimonial-header {
	position: relative;
	width: 100%;
	height: 21px;
	background: url("assets/images/shared/quote_open.png") center center no-repeat;
	background-size: 30px 21px;
	margin: 0 0 30px 0;
}
.testimonial-header::before,
.testimonial-header::after {
	position: absolute;
	content: "";
	top: 10px;
	left: 0;
	width: calc(50% - 30px);
	height: 1px;
	background: var(--colour-green);
}
.testimonial-header::after {
	left: auto;
	right: 0;
}




.mariart-block-text-icon,
.mariart-block-text-icon-with-heading {
	background: #F2F2F2;
	border-top: 5px solid #A9AD00;
	padding: 20px;
	margin: 20px 0 50px 0;
}
.content-block.single-post-item > .wrap h2.mariart-block-text-icon-heading {
	margin-top: 0;
	font-weight: bold;
	font-size: 21px;
	line-height: 34px;
	display: flex;
	flex-wrap: nowrap;
	gap: 20px;
	align-items: center;
	justify-content: flex-start;
}
.content-block.single-post-item > .wrap h2.mariart-block-text-icon-heading img {
	width: 50px;
	height: 50px;
	display: block;
	margin: 0;
	padding: 0;
}

.mariart-block-text-icon.container {
	border-top: none;
}
.mariart-block-text-icon.container.border-top {
	border-top: 5px solid #A9AD00;;
}
.mariart-block-text-icon.container.border-bottom {
	border-bottom: 5px solid #A9AD00;;
}
.mariart-block-text-icon.container.border-left {
	border-left: 5px solid #A9AD00;;
}
.mariart-block-text-icon.container.border-right {
	border-right: 5px solid #A9AD00;;
}
.mariart-block-text-icon.container h6,
.mariart-block-text-icon-with-heading h6 {
	margin: 30px 0 !important;
}


.mariart-block-text-icon-with-heading {
	border-top: none;
	padding: 0;
}
.mariart-block-text-icon-with-heading h2,
.mariart-block-text-icon-with-heading .content {
	padding: 20px;
}
.content-block.single-post-item > .wrap .mariart-block-text-icon-with-heading h2.mariart-block-text-icon-heading {
	margin: 0 !important;
	background: #A9AD00;
	color: #FFFFFF;
	display: flex;
	justify-content: space-between;
}
.content-block.single-post-item > .wrap .mariart-block-text-icon-with-heading h2.mariart-block-text-icon-heading img {
	width: auto;
	height: 26px;
}




.hs-form-checkbox,
.hs-form-radio {
	list-style: none;
}
.hs-form-checkbox input,
.hs-form-radio input {
	margin-right: 10px;
}




/*  ********************************************************************************  **
 
	Blog Style Updates
 
**  ********************************************************************************  */

.single-post-feature-image {
	max-width: 920px;
}
.content-block.single-post-item > .wrap {
	max-width: 700px;
}

.content-block.single-post-item > .wrap p,
.content-block.single-post-item > .wrap li {
	font-size: 17px;
	line-height: 27px;
}
.content-block.single-post-item > .wrap h1 {
	font-size: 40px;
	line-height: 56px;
}
.content-block.single-post-item > .wrap h2 {
	font-size: 28px;
	line-height: 38px;
}
.content-block.single-post-item > .wrap h6 {
	font-weight: bold;
	font-size: 21px;
	line-height: 34px;
}

.single-post-item a.button {
	color: #343E46;
	text-decoration: none;
	font-size: 13px;
	font-weight: bold;
	text-transform: uppercase;
	line-height: 16px;
	padding: 20px 30px;
	border: 1px solid #A9AD00;
	border-radius: 28px;
	letter-spacing: 0.15em;
	display: inline-block;
}
.single-post-item a.button:hover {
	color: #A9AD00;
}

.single-post-item article ul {
	padding-left: 17px;
}
.single-post-item article ul li {
	list-style: none;
	position: relative;
}
.single-post-item article ul li::before {
	content: "";
	position: absolute;
	left: -17px;
	top: 11px;
	width: 8px;
	height: 8px;
	background: #A9AD00;
	border-radius: 50%;
}

.single-post-item article ol li {
	margin-bottom: 15px;
	padding-bottom: 15px;
	border-bottom: 1px solid #A9AD00;
}

.content-block.single-post-item img {
	display: block;
	margin: 30px 0;
	padding: 0;
	width: 100%;
	height: auto;
}




/*  **********  Testimonial  *********  */

.single-post .mariart-testimonial  {
	margin: 30px 0;
	text-align: center;
}

.single-post .mariart-testimonial p.testimonial-name {
	position: relative;
	font-size: 17px;
	color: #A9AD00;
	overflow: hidden;
}
.single-post .mariart-testimonial p.testimonial-name span {
	position: relative;
    display: inline-block;
}
.single-post .mariart-testimonial p.testimonial-name span:before, 
.single-post .mariart-testimonial p.testimonial-name span:after {
    content: '';
    position: absolute;
    top: 50%;
    border-bottom: 1px solid #A9AD00;
    width: 100vw;
    margin: 0 20px;
}
.single-post .mariart-testimonial p.testimonial-name span:before {
    right: 100%;
}
.single-post .mariart-testimonial p.testimonial-name span:after {
    left: 100%;
}
.single-post .mariart-testimonial .testimonial-header::before,
.single-post .mariart-testimonial .testimonial-header::after {
	background: #A9AD00;
}


p.insights-date {
	margin-bottom: 30px;
}

.single-post .article-light-background {
	padding: 30px;
	background: #F1F3F2;
	margin: 30px 0;
}




/*  ********************************************************************************  **
 
	FAQs
 
**  ********************************************************************************  */

.mariart-faq {
	display: block;
	margin: 0;
	padding: 0;
	border-top: 1px solid #A9AD00;
}
.mariart-faq:last-of-type {
	border-bottom: 1px solid #A9AD00;
}
.mariart-faq > h2,
.content-block.single-post-item > .wrap .mariart-faq > h2 {
	margin: 0;
	padding: 20px 0;
	padding-right: 40px;
	font-size: 18px;
	font-weight: bold;
	line-height: 27px;
	font-family: "brown", "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	cursor: pointer;
	position: relative;
}
.mariart-faq > h2::after {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	width: 20px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	content: "+";
	font-size: 27px;
	font-weight: normal;
}
.mariart-faq > h2.open::after {
	content: "-";
}
.mariart-faq > .answer {
	padding: 0 0 20px 0;
}




 
 
 
 
 
 
 
 
 
/*  ********************************************************************************  **
**  ********************************************************************************  **
 
	Responsive Media Queries
 
**  ********************************************************************************  **
**  ********************************************************************************  */




/*  ********************************************************************************  **
 
	1600px
 
**  ********************************************************************************  */
 
@media screen and (max-width: 1600px) {
 
 	/*  **********************************************************************  **
 
		Team Page

	**  **********************************************************************  */
	
	.team-person-container,
	.team-person-container:nth-child(2n) {
		width: 30%;
		width: calc((100% - 80px) / 3);
		margin-left: 5%;
		margin-left: calc(40px);
		clear: none;
		float: left;
		margin-top: 40px;
	}
	.team-person-container:first-child,
	.team-person-container:nth-child(3n + 1) {
		margin-left: 0;
		clear: left;
	}
	.team-person-container:first-child,
	.team-person-container:nth-child(2),
	.team-person-container:nth-child(3) {
		margin-top: 0;
	}
	
	.team-person-container .image-container {
		position: relative;
		top: auto;
		bottom: auto;
		left: auto;
		width: 100%;
		height: 600px;
		background-position: center top 80px;
	}
	.bio-container {
		margin-left: 0;
		padding: 50px 20px 20px 20px;
	}
	.bio-name-container {
		bottom: auto;
		top: 0;
	}
	
	
	
	
	#video_container {
		height: 500px;
	}
	
	
	
	
	.casestudy-slider-container li,
	.casestudy-display-container li,
	.casestudy-display-container li:nth-child(4n + 1) {
		width: calc((100% - 100px) / 3);
		clear: none;
		margin-left: 50px;
	}
	.casestudy-display-container li:first-child,
	.casestudy-display-container li:nth-child(3n + 1) {
		margin-left: 0;
		clear: left;
	}
 
}




/*  ********************************************************************************  **
 
	1400px
 
**  ********************************************************************************  */
 
@media screen and (max-width: 1400px) {

	h2,
	.content-block.single-post-item h2.full,
	p.service-heading {
		font-size: 29px;
		line-height: 42px;
	}
	.content-column {
		width: calc((100% - 60px) / 2);
	}
 
 
 
 
 	/*  **********************************************************************  **
 
		Services Page

	**  **********************************************************************  */
	
 	.services-list-item,
	.services-list-item:nth-child(4n + 1) {
		width: 30%;
		width: calc((100% - 80px) / 3);
		clear: none;
		margin-left: 5%;
		margin-left: calc(40px);
	}
	.services-list-item:nth-child(3n + 1) {
		margin-left: 0;
		clear: left;
	}
 
 
 
 
 	/*  **********************************************************************  **
 
		Insights

	**  **********************************************************************  */
	
	.archive-container article,
	.archive-container article:nth-child(3n + 1) {
		width: 48%;
		width: calc((100% - 100px) / 2);
		margin-left: 4%;
		margin-left: calc(100px);
		clear: none;
	}
	.archive-container article:nth-child(2n + 1) {
		margin-left: 0;
		clear: left;
	}
 
}




/*  ********************************************************************************  **
 
	1200px
 
**  ********************************************************************************  */
 
@media screen and (max-width: 1200px) {

	#video_container {
		height: 400px;
	}



 
 	/*  **********************************************************************  **
 
		Page Containers

	**  **********************************************************************  */

	 /*  **********  Content Blocks  **********  */

	 #masthead,
	 #colophon,
	.content-block {
		margin: 0;
		padding: 70px;
	}

	/*  **********  Content Blocks Updates  **********  */

	#masthead {
		padding-top: 0;
		padding-bottom: 0;
	}
	#colophon,
	#services-footer {
		padding-top: 30px;
		padding-bottom: 30px;
	}
	.content-block.ready-to-get-started {
		padding-top: 100px;
		padding-bottom: 100px;
	}
	
	.content-block-dual-background > .row > .cell.left > .wrap,
	.content-block-dual-background > .row > .cell.right > .wrap {
		padding: 70px;
	}

	
	
	
	/*  **********************************************************************  **
 
		Shared Eleemnts

	**  **********************************************************************  */
	
	.more-link, 
	.casestudy-service-fiter {
		font-size: 12px;
		line-height: 30px;
		padding: 10px 20px;
	}
	.more-link-slideout {
		height: 52px;
		width: 52px;
		line-height: 52px;
	}
	
	
	
	
	/*  **********************************************************************  **
 
		Case Study Pages

	**  **********************************************************************  */
	
	h1.casestudy-title {
		font-size: 25px;
		line-height: 42px;
	}
	
	#casestudy-content-container {
		padding: 0;
	}
	#casestudy-content-block,
	#casestudy-content-block > .wrap,
	.casestudy-content-left,
	.casestudy-content-right {
		display: block;
		width: 100%;
	}
	.casestudy-content-left > .wrap,
	.casestudy-content-right > .wrap {
		padding: 50px;
	}
	.casestudy-content-block-underlay {
		display: none;
	}
	.casestudy-gallery-image:nth-child(2),
	.casestudy-gallery-image:nth-child(3) {
		float: none;
		width: 100%;
	}
	
	
	
	
	/*  **********  Case Study Display Block  **********  */
	
	.casestudy-slider-container li,
	.casestudy-display-container li,
	.casestudy-slider-container li:first-child,
	.casestudy-display-container li:first-child,
	.casestudy-slider-container li:nth-child(3n + 1),
	.casestudy-slider-container li:nth-child(4n + 1),
	.casestudy-display-container li:nth-child(3n + 1),
	.casestudy-display-container li:nth-child(4n + 1) {
		width: calc(((100% - 50px) / 2));
		clear: none;
		margin-left: 50px;
	}
	.casestudy-slider-container li:nth-child(2n + 1),
	.casestudy-display-container li:nth-child(2n + 1) {
		clear: left;
		margin-left: 0;
	}
	.casestudy-display-container li.testimonial p.content, .testimonial p.content {
		font-size: 19px;
		line-height: 37px;
	}
	.casestudy-display-container li.testimonial p.name, .testimonial p.name {
		font-size: 16px;
		line-height: 31px;
	}
	.single-casestudy .content-block > .wrap, #casestudy-gallery.content-block > .wrap {
		max-width: none;
	}
	
	
	
	
	#banner {
		height: 350px;
	}
	#feature-image {
		height: 300px;
	}
	
	
	
	
	.content-column.contact-left {
		padding-right: 50px;
	}
	.content-column.contact-right {
		padding-left: 50px;
	}
	.contact-right-cover {
		top: -70px;
		right: -70px;
	}
	.mariart-map {
		height: 300px;
		padding: 0 -70px 0 -50px;
		margin: 50px -70px 0 -50px;
	}
	
	
	
	
	.service-block .service-col {
		width: 33.3%;
		width: calc(100% / 3);
	}
	.service-block.services-columns-3 .service-col {
		width: 50%;
	}
	
	
	
	
	/*  **********************************************************************  **
 
		Team Page

	**  **********************************************************************  */
	
	.team-person-container,
	.team-person-container:first-child,
	.team-person-container:nth-child(2n),
	.team-person-container:nth-child(3n + 1),
	.team-person-container:first-child,
	.team-person-container:nth-child(2),
	.team-person-container:nth-child(3)  {
		width: 47.5%;
		width: calc((100% - 40px) / 2);
		margin-left: 0;
		clear: none;
		float: right;
		margin-top: 40px;
	}
	.team-person-container:nth-child(2n + 1) {
		float: left;
		clear: both;
	}
	.team-person-container:first-child,
	.team-person-container:nth-child(2) {
		margin-top: 0;
		float: left;
	}
	.team-person-container:nth-child(2) {
		float: right;
		clear: none;
	}
}




/*  ********************************************************************************  **
 
	1000px
 
**  ********************************************************************************  */
 
@media screen and (max-width: 1000px) {

	/*  **********************************************************************  **
 
		Standard HTML Tags

	**  **********************************************************************  */
	
	h2,
	.content-block.single-post-item h2.full,
	p.service-heading {
		font-size: 24px;
	}
	
	.home p.service-heading,
	.home h1 {
		text-align: left
	}



 
 	/*  **********************************************************************  **
 
		Page Containers

	**  **********************************************************************  */

	 /*  **********  Content Blocks  **********  */

	 #masthead,
	 #colophon,
	 #services-footer,
	.content-block {
		margin: 0;
		padding: 60px;
	}

	/*  **********  Content Blocks Updates  **********  */

	#masthead {
		padding-top: 0;
		padding-bottom: 0;
	}
	#colophon
	#ervices-footer {
		padding-top: 30px;
		padding-bottom: 30px;
	}
	.content-block.ready-to-get-started {
		padding-top: 100px;
		padding-bottom: 100px;
	}
	
	
	
	
	/*  **********  Columns  **********  */

	.content-column,
	.content-column.position-right,
	.content-column.size-third,
	.content-column.size-twothirds {
		float: none;
		width: 100%;
		margin: 0;
		margin-top: 40px;
		padding: 0;
	}
	.content-column:first-child {
		margin-top: 0;
	}
	
	
	
	
	/*  **********  Dual Background  **********  */
	
	
	.content-block-dual-background > .row > .cell.left > .wrap,
	.content-block-dual-background > .row > .cell.right > .wrap {
		padding: 80px 60px;
	}
	
	
	
	
	/*  **********************************************************************  **
 
		Navigation Menu

	**  **********************************************************************  */
	
	#primary-menu {
		display: none;
		top: 90px;
		left: -80px;
		right: -80px;
		padding: 0 80px;
		background: #FFFFFF;
		height: 90px;
		border-top: 1px solid #EEEEEE;
		transition: top 0.2s;
	}
	.sticky #primary-menu {
		top: 70px;
	}
	#masthead.sticky .sf-menu > li > a {
		line-height: 90px;
	}
	
	
	
	
	/*  **********  Mobile Menu  **********  */
	
	#mobile-menu {
		position: absolute;
		top: 0;
		right: 0;
		display: block;
	}
	#mobile-menu ul,
	#mobile-menu ul li {
		margin: 0;
		padding: 0;
		list-style: none;
	}
	#mobile-menu ul li {
		line-height: 90px;
		float: left;
		margin-left: 40px;
		transition: line-height 0.2s;
	}
	.sticky #mobile-menu ul li {
		line-height: 40px;
	}
	
	#mobile-menu a,
	#mobile-menu #menu-toggle-tablet,
	#mobile-menu #menu-toggle-mobile {
		display: block;
		width: 20px;
		background: none;
		background-position: center center;
		background-repeat: no-repeat;
		background-size: 20px;
		text-indent: 50px;
		overflow: hidden;
	}
	#mobile-menu a.phone {
		background-image: url("assets/images/header/phone.png");
	}
	#mobile-menu a.contact {
		background-image: url("assets/images/header/mail.png");
	}
	#mobile-menu #menu-toggle-tablet,
	#mobile-menu #menu-toggle-mobile {
		border: none;
		background-image: url("assets/images/header/menu.png");
		line-height: 90px;
		transition: line-height 0.2s;
		cursor: pointer;
	}
	.sticky #mobile-menu #menu-toggle-tablet,
	.sticky #mobile-menu #menu-toggle-mobile {
		line-height: 40px;
	}
	
	#mobile-menu #menu-toggle-mobile {
		display: none;
	}
	
	
	
	
	/*  **********************************************************************  **
 
		Footer

	**  **********************************************************************  */
	
	#footer-links {
		font-size: 0;
	}
	#footer-links li {
		width: 49%;
		margin: 10px 0;
	}
	
	
	
	
	/*  **********************************************************************  **
 
		Services List Pages

	**  **********************************************************************  */
	
	.services-list-item,
	.services-list-item:nth-child(3n + 1),
	.services-list-item:nth-child(4n + 1) {
		width: 47.5%;
		width: calc((100% - 50px) / 2);
		clear: none;
		margin-left: 5%;
		margin-left: calc(50px);
	}
	.services-list-item:nth-child(2n + 1) {
		margin-left: 0;
		clear: left;
	}
	
	
	
	
	/*  **********************************************************************  **
 
		Services Pages

	**  **********************************************************************  */
	
	.content-block.service_single {
		padding-left: 0;
		padding-right: 0;
		padding-top: 0;
	}
	
	.single-services .content-block-dual-background > .row > .cell.left > .wrap {
		/* background: #F1F3F2; */
	}

	
	
	
	/*  **********************************************************************  **
 
		Shared and Common Styles

	**  **********************************************************************  */
	
	.content-column.position-left h1 {
		text-align: left;
	}
	.service_single .content-column.position-left h1,
	.service_single .content-column.position-left h2,
	.service_single .content-column.position-left p.service-heading {
		text-align: left;
	}
	h6,
	.leadin {
		line-height: 29px;
	}
	
	
	
	
	/*  *********  Content Blocks Area  *********  */
	
	.content-block-dual-background,
	.content-block-dual-background > .row,
	.content-block-dual-background > .row > .cell {
		display: block;
		width: 100%;
	}
	.services-list-column li {
		font-size: 13px;
	}
	.services-list-column li a,
	.services-list-column li a:hover {
		background-size: 12px;
		padding-right: 20px;
	}
	
	
	
	
	/*  **********  Difference Block  **********  */
	
	ul.differences-list li,
	ul.differences-list li:nth-child(3n + 1) {
		width: 47.5%;
		width: calc((100% - 60px) / 2);
		margin-left: 5%;
		margin-left: calc(60px);
		margin-top: 60px;
		clear: none;
	}
	
	ul.differences-list li:first-child,
	ul.differences-list li:nth-child(2n + 1) {
		margin-left: 0;
		clear: left;
	}
	
	
	
	
	.team-person-container {
		width: calc((100% - 60px) / 2);
	}
	.team-person-container .image-container {
		height: 500px;
	}
	.bio-container {
		padding: 60px 30px 30px 30px;
	}
	.team-person-container {
		margin-top: 60px;
	}
	
	
	
	
	#page-breadcrumb {
		top: -40px;
	}
	
	
	
	
	.contact-right-cover {
		top: -60px;
		right: -60px;
		left: -60px;
	}
	.mariart-map {
		padding: 0 -60px;
		margin: 50px -60px 0 -60px;
	}
	
	.content-column.contact-left {
		width: auto;
		padding-right: 0;
		padding-top: 50px;
	}
	
	
	
	
	.how-we-work-point,
	.how-we-work-point:nth-child(3n + 1) {
		width: 50%;
		clear: none;
	}
	.how-we-work-point:nth-child(2n + 1) {
		clear: left;
	}
	
	
	.contact-office-image img {
		max-width: 500px;
		margin: 0 auto 0 0;
	}
	
	
	
	
	.community-logos-container img {
		width: 22%;
		margin: 30px 3% 0 3%;
	}
	
	
	
	
	.mariart-testimonial p {
		font-size: 21px;
	}
	.mariart-testimonial p.testimonial-name {
		font-size: 16px;
	}
	
	
	
	p.service-heading {
		text-align: left;
	}

}




/*  ********************************************************************************  **
 
	800px
 
**  ********************************************************************************  */
 
@media screen and (max-width: 800px) {
 
	/*  **********************************************************************  **
 
		Services List Pages

	**  **********************************************************************  */
	
	.services-list-item,
	.services-list-item:nth-child(3n + 1),
	.services-list-item:nth-child(4n + 1),
	.services-list-item:nth-child(2n + 1) {
		float: none;
		width: auto;
		margin: 50px 0;
	}
	
	.single-services .content-column > .wrap h1:first-child {
		margin-top: 50px;
	}

	
	
	
	/*  **********************************************************************  **
 
		Team Page

	**  **********************************************************************  */
	
	.team-person-container .image-container {
		height: 700px;
	}
	
	
	
	
	#video_container {
		height: 400px;
	}
	
	
	
	
	/*  **********************************************************************  **
 
		Team Page

	**  **********************************************************************  */
	
	.team-person-container, 
	.team-person-container:first-child, 
	.team-person-container:nth-child(2), 
	.team-person-container:nth-child(2n), 
	.team-person-container:nth-child(3n), 
	.team-person-container:nth-child(2n + 1), 
	.team-person-container:nth-child(3n + 1) {
		float: none;
		width: auto;
		margin-top: 50px;
	}
	.team-person-container:first-child {
		margin-top: 0;
	}
	
	.team-person-container .image-container {
		height: 800px;
	}
	
	
	
	
	.gallery-item-container {
		margin-bottom: 20px;
	}
	.gallery-item-container.image.position-half-left,
	.gallery-item-container.image.position-half-right {
		width: calc((100% - 20px) / 2);
	}
	.gallery-item-container.image.position-twothirds-left,
	.gallery-item-container.image.position-twothirds-right {
		width: calc((100% - 20px) / 3 * 2);
	}
	.gallery-item-container.image.position-third-left, 
	.gallery-item-container.image.position-third-right {
		width: calc((100% - 20px) / 3);
	}
	
	
	
	
	.gform_wrapper ul.gfield_checkbox li, 
	.gform_wrapper ul.gfield_radio li {
		width: 49%;
	}
 
 
 
 
 	/*  **********************************************************************  **
 
		Insights

	**  **********************************************************************  */
	
	.archive-container article,
	.archive-container article:first-child,
	.archive-container article:nth-child(3n + 1),
	.archive-container article:nth-child(2n + 1) {
		width: auto;
		margin: 30px 0;
		float: none;
	}
	
	
	
	
	#feature-image {
		height: 250px;
	}
	
	
	
	
	.service-block .service-col {
		width: 50%;
	}
	.service-block.services-columns-2 .service-col,
	.service-block.services-columns-3 .service-col {
		width: auto;
		float: none;
	}
 
}




/*  ********************************************************************************  **
 
	600px
 
**  ********************************************************************************  */
 
@media screen and (max-width: 600px) {

	/*  **********************************************************************  **
 
		Font Sizes

	**  **********************************************************************  */
	
	h2 {
		font-size: 22px;
		line-height: 26px;
	}
	
	h2 {
		margin-bottom: 20px;
	}
	h2.slider-headline {
		font-size: 29px;
		line-height: 36px;
	}


 
 	/*  **********************************************************************  **
 
		Page Containers

	**  **********************************************************************  */
	
	body {
		padding-top: 70px;
	}

	 /*  **********  Content Blocks  **********  */

	 #masthead,
	 #colophon,
	 #services-footer,
	.content-block {
		margin: 0;
		padding: 30px;
	}

	/*  **********  Content Blocks Updates  **********  */

	#masthead {
		padding-top: 0;
		padding-bottom: 0;
	}
	#colophon,
	#ervices-footer {
		padding-top: 30px;
		padding-bottom: 30px;
	}
	.content-block.ready-to-get-started {
		padding-top: 50px;
		padding-bottom: 50px;
	}
	
	#services-contact.content-block {
		padding-top: 40px;
		padding-bottom: 40px;
	}
	
	
	
	
	/*  **********  Dual Background  **********  */
	
	
	.content-block-dual-background > .row > .cell.left > .wrap,
	.content-block-dual-background > .row > .cell.right > .wrap {
		padding: 50px 30px;
	}
	
	
	
	
	/*  **********************************************************************  **
 
		Header

	**  **********************************************************************  */
	
	#masthead {
		height: 70px;
	}
	#mariart-header-logo {
		height: 45px;
	}
	
	#mobile-menu ul li,
	#mobile-menu #menu-toggle-tablet {
		line-height: 40px;
	}
	#mobile-menu ul li a,
	#mobile-menu #menu-toggle-tablet {
		text-indent: 30px;
		overflow: hidden;
		display: block;
		font-size: 0;
	}
	
	
	
	
	/*  **********************************************************************  **
 
		Main Menu

	**  **********************************************************************  */
	
	#primary-menu {
		display: none;
		top: 70px;
		left: -50px;
		right: -50px;
		padding: 0;
	}
	.sf-menu {
		float: none;
		dipslay: block;
		width: auto;
	}
	.sf-menu li {
		margin: 0;
		padding: 0;
		float: none;
		display: block;
		width: auto;
	}
	.sf-menu > li > a,
	.sf-menu > li > a:hover,
	.sf-menu > li.sfHover > a,
	#masthead.sticky .sf-menu > li > a {
		line-height: 50px;
		padding: 0 50px;
	}
	.sf-menu li > a,
	.sf-menu li > a:hover,
	.sf-menu li.sfHover > a,
	#masthead.sticky .sf-menu > li > a
	.sf-menu li,
	.sf-menu li:hover,
	.sf-menu li.sfHover {
		border: none;
		background: #FFFFFF;
	}
	
	
	
	
	/*  **********  Second Level  **********  */
	
	.sf-menu ul {
		position: relative;
		top: auto;
		left: auto;
		border-left: none;
		max-height: 300px;
		overflow-y: scroll;
	}
	.sf-menu ul li a {
		margin: 0 50px;
		padding: 0 0 0 30px;
		line-height: 50px;
		border-left: 1px solid #A9AD00;
	}
	
	
	
	
	/*  **********************************************************************  **
 
		Footer

	**  **********************************************************************  */
	
	#footer-links li {
		display: block;
		width: auto;
		margin: 15px 0;
	}
	
	
	
	
	/*  **********************************************************************  **
 
		Services Pages

	**  **********************************************************************  */
	
	.content-block.service_single {
		padding-top: 0;
	}
	
	
	
	
	/*  **********************************************************************  **
 
		Team Page

	**  **********************************************************************  */
	
	.team-person-container .image-container {
		height: 600px;
	}

	
	
	
	/*  **********************************************************************  **
 
		Shared and Common Styles

	**  **********************************************************************  */
	
	h2,
	.content-block.single-post-item h2.full,
	p.service-heading {
		font-size: 21px;
		line-height: 36px;
	}
	
	
	
	
	#banner {
		height: 250px;
	}
	
	.more-link-container {
		margin-top: 10px;
		display: inline-block;
	}
	
	
	
	
	/*  **********  Differences List  **********  */
	
	ul.differences-list li,
	ul.differences-list li:first-child,
	ul.differences-list li:nth-child(2n + 1),
	ul.differences-list li:nth-child(3n + 1) {
		float: none;
		width: 100%;
		padding-left: 0;
		padding-right: 0;
		margin-left: 0;
		margin-right: 0;
	}
	ul.differences-list li img.difference-icon {
		max-width: 65px;
		margin-bottom: 30px;
	}
	
	
	
	
	/*  ********  Services List Block  **********  */
	
	.services-list-column {
		float: none;
		width: auto;
	}
	
	
	
	
	/*  **********  Case Study Display Block  **********  */
	
	.casestudy-slider-container li,
	.casestudy-display-container li,
	.casestudy-slider-container li:nth-child(2n + 1),
	.casestudy-display-container li:nth-child(2n + 1),
	.casestudy-slider-container li:nth-child(3n + 1),
	.casestudy-display-container li:nth-child(3n + 1),
	.casestudy-slider-container li:nth-child(4n + 1),
	.casestudy-display-container li:nth-child(4n + 1) {
		width: 100%;
		margin-left: 0;
		float: none;
	}
	
	
	
	
	#video_container {
		height: 300px;
	}
	
	
	
	#feature-image {
		display: none;
	}
	.contact-right-cover {
		top: -30px;
		right: -30px;
		left: -30px;
	}
	.mariart-map {
		margin: 50px -30px 0 -30px;
	}
	
	
	
	
	.how-we-work-point,
	.how-we-work-point:nth-child(3n + 1),
	.how-we-work-point:nth-child(2n + 1) {
		width: auto;
		float: none;
	}
	
	
	
	
	.community-logos-container img {
		width: 45%;
		margin: 30px 2.5% 0 2.5%;
	}
	
	
	
	
	.how-we-work-point img {
		max-width: 100px;
	}
	.how-we-work-point p {
		margin-top: 20px;
	}
	
	
	
	
	#casestudy-service-filter {
		text-align: left;
	}
 
}




/*  ********************************************************************************  **
 
	450px
 
**  ********************************************************************************  */
 
@media screen and (max-width: 450px) {
 
	#video_container {
		height: 250px;
	}
 
}