﻿* {margin:0; padding:0; outline:none; border:none; box-sizing:border-box; -moz-box-sizing:border-box;}

/*
font-family: trajan-pro-3, serif;
font-weight: 400;
font-style: normal;

font-family: garamond-premier-pro, serif;

*/

/* GLOBAL */

html { }
body {line-height:1; font-family: garamond-premier-pro, serif; text-rendering: optimizeLegibility;  -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;}

::-webkit-input-placeholder     {color:#6C345F;}
::-moz-placeholder              {color:#6C345F; opacity:1;}
:-ms-input-placeholder          {color:#6C345F;}
:-moz-placeholder               {color:#6C345F; opacity:1;}

h1,
h2,
h3,
h4,
h5,
h6		{font-weight: normal;}

ul,
ol,
p		{font-size: 18px; color:#63656A; line-height: 1.35em;}

ul,
ol		{margin: 1em;}

img     {max-width:100%; height:auto;}
a       {color:inherit;}
a.cover {position:absolute; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0); display:block; z-index: 20}

.inner { width:1300px; max-width:100%; margin:0 auto; padding: 0 30px}

.center { text-align: center; }

.basic-panel { padding-bottom: 80px; }

/* HEADER */
header 				{display: flex; justify-content: center; padding: 30px 0 25px; width: 100%; z-index: 5; background-color: #ffffff; top:0; position: fixed; transition: 0.5s ease-out}

.scroll-hide.hide		{padding: 10px 0}
.scroll-hide.hide .logo	{width: 120px;}

/* LOGO */
.logo				{width:160px; transition: 0.2s ease-out}
.circle-logo		{width:198px; height: 198px; border-radius: 198px; background-color: #ffffff; display: flex; justify-content: center; align-items: center; position: absolute; left: 50%; top:50%; margin-left:-99px; margin-top: -99px}
.circle-logo img	{width:122px;}

.hamburger						{width:40px; height: 21px; position: fixed; top:55px; right:20px; display: block; z-index: 1001;}
.hamburger span					{width:100%; height: 1px; position: absolute; left: 0; top:0; background-color: #6C345F; transition:all 0.5s cubic-bezier(0.19, 1, 0.22, 1);}
.hamburger span:nth-child(2)	{top:10px;}
.hamburger span:nth-child(3)	{top:20px;}

.hamburger.active span:nth-child(1)	{transform: rotate(45deg); top:10px;}	
.hamburger.active span:nth-child(2)	{transform: rotate(-45deg); top:10px;}	
.hamburger.active span:nth-child(3)	{opacity: 0; transform: translateY(10px)}

/* NAV */
nav			{opacity: 0; top:0; visibility: hidden; position: fixed; width:100%; height: 100%; display: flex; align-items: center; justify-content: center; transition:all 1s cubic-bezier(0.19, 1, 0.22, 1); background-color: rgba(255,255,255,0.95); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); transform: scale(1.1); z-index: 1000}
nav.open	{opacity: 1; visibility: visible; transform: scale(1);}

nav ul					{text-align: center; font-family: trajan-pro-3, serif; font-size: 20px; margin: 0}
nav ul li				{margin: 2.5vh 0}
nav ul li a				{text-decoration: none; color:#63656A; position: relative; transition: 0.2s ease-out}
nav ul li a:after		{height:1px; width: 100%; background-color: #6C345F; content: ''; bottom: 3px; position: absolute; left: 0; opacity: 0; visibility: hidden; transition: 0.2s ease-out}
nav ul li a:hover:after	{opacity: 1; visibility: visible; bottom: 0;}
nav ul li a:hover 		{color:#6C345F;}

/* HOME HERO */
.home-hero				{background-size: cover; background-position: center; height: calc(100vh); position: sticky; top: 0; min-height: 400px; overflow: hidden; margin-top: 0;}
.home-hero p			{font-size: 17px; color:#63656A; position: absolute; right: 5%; bottom: 0; padding:7px 15px; background-color: #ffffff; font-family: trajan-pro-3, serif; z-index: 5}
.home-hero .circle-btn	{position: absolute; bottom: 40px; left: 50%; transform: translateX(-50%); z-index: 5}
.home-hero:after		{position: absolute; bottom: 0; left: 0; width:100%; height: 150px; content: ''; background: linear-gradient(0deg, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 100%);}
.home-hero-image		{position: absolute; background-size: cover; left: 0; top:0; width: 100%; height: 100%; background-position: right; z-index: 1; animation-name: zoom-out; animation-timing-function: ease-out; animation-duration: 6s; animation-fill-mode: forwards; transform: scale(1.1)}

/* HOME SECTION */
.home-section						{display: flex; height: 100vh; min-height: 600px; position: sticky; left: 0; top:0; width: 100%; z-index: 10}
.home-section .col					{width:50%; background-size: cover; background-position: center;}
.home-section .col-text				{background-color: #ffffff; display: inline-flex; justify-content: center; align-items: center; text-align: center; padding: 0 130px}
.home-section .col-text .text		{width:425px; max-width: 100%;}
.panel-intro h2,
.home-section .col-text h2			{font-size: 30px; color:#6C345F; font-family: trajan-pro-3, serif; margin-bottom: 1em}
.home-section .col-text p			{font-size: 18px; color:#63656A; line-height: 1.35em;}
.home-section .col-text .text-btn	{margin-top: 1.4em;}

.home-panels .circle-btn			{position: absolute; bottom: 40px; left: 50%; transform: translateX(-50%); z-index: 5}

/*.home-panels .circle-btn			{position: fixed; left: 50%; bottom: 50px; transform: translateX(-50%); z-index: 50}*/

.home-section:nth-child(odd)						{flex-direction: row-reverse}
.home-section:nth-child(odd) .col-text				{background-color:#6C345F; color:#ffffff}
.home-section:nth-child(odd) h2,
.home-section:nth-child(odd) p,
.home-section:nth-child(odd) .text-btn span			{color:#ffffff}
.home-section:nth-child(odd) .text-btn:after		{background-color: #ffffff;}
.home-section:nth-child(odd) .text-btn:hover span	{color:#6C345F}
.home-section:nth-child(odd) .circle-logo 			{background-color:#6C345F;}

.home-hero .circle-btn,
.home-section:nth-child(odd) .circle-btn			{background-color:#6C345F;}

.home-hero .circle-btn:before,
.home-section:nth-child(odd) .circle-btn:before		{border-color:#6C345F}

.home-hero .circle-btn:after,
.home-section:nth-child(odd) .circle-btn:after		{border-color:#6C345F}

.home-hero .circle-btn path,
.home-section:nth-child(odd) .circle-btn path		{fill:#ffffff}

.home-hero .circle-btn:hover,
.home-section:nth-child(odd) .circle-btn:hover		{background-color: #ffffff;}

.home-hero .circle-btn:hover path,
.home-section:nth-child(odd) .circle-btn:hover path	{fill:#6C345F}

/* HOME OUR CLIENTS */
.our-clients					{text-align: center; padding: 100px 0; background-color: #ffffff; position: relative; z-index: 100}
.panel-intro					{width:545px; max-width: 100%; margin: auto; text-align: center;}
.panel-intro p					{font-size: 18px; color:#63656A; line-height: 1.35em; margin-bottom: 1em;}
.panel-intro p:last-child		{margin-bottom: 0}
.client-image					{height: 125px; margin-bottom: 0;}
.client-image img				{height: 100%; width:auto; margin: auto}
.our-clients-carousel			{margin: 70px auto; position: relative;}
.our-clients-carousel .slide	{text-align: center; padding: 0 20px;}
.our-clients-carousel .text-btn	{font-size: 14px;}
.client-panel h3				{font-size: 24px; color:#6C345F; font-family: trajan-pro-3, serif; margin-bottom: 0.75em; line-height: 1.3em;}
.client-panel p					{font-size: 16px; margin-bottom: 0.75em}


/* HOME LATEST NEWS */
.home-latest-news			{text-align: center; padding: 100px 0; background-color: #F8F8F8; position: relative; z-index: 100}
.news-listing				{display: flex; justify-content: center; margin: 70px auto;}
.news-listing .col			{padding:0 20px; flex: 1;}
.news-panel					{background-color: #ffffff; text-align: left; height: 100%; position: relative;}
.news-panel-image-outer		{height: 235px; position: relative; overflow: hidden;}
.news-panel-image			{background-size: cover; background-position: center; position: absolute; left: 0; top:0; width:100%; height: 100%; transition:all 1s cubic-bezier(0.19, 1, 0.22, 1);}
.news-panel-text			{padding: 35px 35px 50px 35px; position: relative;}
.news-panel-text h3			{font-size: 22px; font-family: trajan-pro-3, serif; color:#6C345F; margin-bottom: 0.75em;}
.date						{color:#6C345F; font-size: 12px; font-family: trajan-pro-3, serif; display: flex; flex-direction: column; justify-content: center; text-align: center; position: absolute; width: 53px; height: 53px; background-color: #ffffff; top:-53px;}
.date span					{font-size: 20px;}

.news-panel:hover .news-panel-image			{transform: scale(1.1)}

/* CONTENT PAGE */
main	{margin-top: 200px;}

section.grey	{background-color:#F7F4F7}

/* TWO COL TEXT */	
.two-col-text					{padding: 80px 0}
.two-col-text p					{color:#231F20; line-height: 1.5em; margin-bottom: 1.3em}
/*.two-col-text p.intro-text	{font-size: 20px; font-weight: 700; color: #6C345F}*/
.two-col-text .intro-text p		{font-size: 20px; font-weight: 700; color: #6C345F}
.two-col-text .intro-text		{margin-bottom: 1.3em;}
.two-col-text .inner			{ width: 864px; }
.two-col-text .cols				{display: flex;}
.two-col-text .col				{padding: 0 20px; flex: 1;}
.two-col-text .col p:last-child	{margin-bottom: 0;}
.two-col-text blockquote		{padding-top: 0}
.two-col-text h2				{font-family: trajan-pro-3, serif; font-size: 22px; color: #6C345F; margin-bottom: 0.65em; margin-top: 0.65em}
.two-col-text .purple-highlight	{color: #6C345F; font-weight: 700}

blockquote			{padding: 15px;}
blockquote:before	{content: ''; background-image:url(/_assets/icon-quotes.svg); width: 77px; height: 35px; display: block; margin-bottom: 10px;}
blockquote p		{font-size: 18px; line-height: 1.5em; color:#6C345F; font-family: trajan-pro-3, serif;}

.two-col-text .pullout		{background-color: #6C345F; padding: 30px; margin-top: 0.5em}
.two-col-text .pullout h2	{color:#ffffff; margin-top: 0}
.two-col-text .pullout p	{color:#ffffff;}
.two-col-text .pullout p:last-child	{margin-bottom: 0}

/* TWO COL WITH IMAGE */
.col-image			{position: relative;}
.col-image-inner	{width:150%; height: 100%; background-size: cover; background-position: center; position: absolute; right: 20px;}

.with-person-image .inner						{width: 1000px;}
.with-person-image .col-image					{display: flex; flex-direction: column; align-items: center;}
.with-person-image .col-image img				{width:250px; max-width: 100%;}
.with-person-image .col-image blockquote		{text-align: center; width: 100%; max-width: 100%; margin-top: 30px; padding: 15px;}
.with-person-image .col-image blockquote:before	{margin-left: auto; margin-right: auto;}
.with-person-image .col-image blockquote p		{font-size: 16px; line-height: 1.65em;}
.with-person-image .col h2						{font-family: trajan-pro-3, serif; font-size: 26px; line-height: 1.3em; margin-bottom: 0.5em; color:#6C345F}
.with-person-image .col h2 span					{font-size: 20px; color:#63656A; display: block}

.person-image	{width:250px; height: 250px; border-radius: 250px; overflow: hidden; border:5px solid #6C345F; position: relative;}

.with-person-image:nth-child(odd)	{background-color: #F7F4F7}

/* CONTENT PAGE HEADER */
.content-header			{height: 35vw; max-height: 540px; display: flex; justify-content: flex-end; align-items: center; position: relative; overflow: hidden;}
.content-header:before	{background: rgb(108,52,95); background: linear-gradient(90deg, rgba(108,52,95,0) 0%, rgba(108,52,95,1) 100%); mix-blend-mode: multiply; position: absolute; right:0; top:0; width:75%; height: 100%; content: ''; z-index: 2}
.header-text			{display: flex; flex-direction: column; text-align: center; margin-right: 5%; position: relative; z-index: 2}
.header-text h1			{color:#ffffff; font-family: trajan-pro-3, serif; font-size: 5vw; margin-bottom: 0.3em;}
.header-text p			{color:#ffffff; font-family: trajan-pro-3, serif; font-size: 23px;}
.header-text p span		{font-size: 33px;}

.content-header-image	{position: absolute; background-size: cover; left: 0; top:0; width: 100%; height: 100%; background-position: right; z-index: 1; animation-name: zoom-out; animation-timing-function: ease-out; animation-duration: 6s; animation-fill-mode: forwards; transform: scale(1.1)}

.ty-container 			{min-height: 340px;}

@keyframes zoom-out {
	to	{transform: scale(1);}
}

.header-intro-text	{display: flex; margin: auto}
.quote				{opacity: 0.5}
.quote svg			{width:35px;}
.quote path			{fill:#ffffff}
.quote-left			{margin-right: 10px;}
.quote-right		{margin-left: 10px; align-self: flex-end}

/* MAP */
.map-section	{padding: 80px 0}
.map			{width:1070px; margin:60px auto 0; max-width: 100%; position: relative;}
.marker-image	{position: absolute; left: 0; top:0; width:100%; height: 100%; object-fit: cover; transition: 0.2s ease-out}

.key			{display: flex; width:650px; max-width: 100%; justify-content: center; margin: auto}
.key-item		{flex: 1; padding: 20px; text-align: center; cursor: pointer; transition: 0.2s ease-out}

.non-active		{opacity: 0.2}

/* TEXT WITH LISTS */
.text-with-lists								{padding: 80px 0 60px; text-align: center}
.text-with-lists .inner							{width: 960px;}
.text-with-lists .inner .cols					{display: flex; margin-top: 30px; width:calc(100% + 40px); margin-left: -20px;}
.text-with-lists .inner .cols .col				{flex: 1; padding: 20px; text-align: center}
.text-with-lists .inner .cols .col-inner		{background-color:#F7F4F7; height: 100%; padding:25px 15px; border-bottom: 4px solid #6C345F}
.text-with-lists .inner .cols .col:last-child	{margin-right: 0}
.text-with-lists .inner .cols .col h2			{font-family: trajan-pro-3, serif; font-size: 16px; color:#6C345F; margin-bottom: 1em}
.text-with-lists ul								{list-style:none; font-size: 16px; margin: 0; background-color:#F7F4F7}
.text-with-lists ul	li							{margin-bottom: 0.5em;}
.text-with-lists ul	li:last-of-type				{margin-bottom: 0}

.image-with-text-2			{padding: 80px 0}
.image-with-text-2 h2		{font-size: 30px; text-align: center; display: block; color:#ffffff; font-family: trajan-pro-3, serif; margin-bottom: 1.2em}
.image-with-text-2 h3		{font-size: 18px; margin-top: 1.5em; color:#ffffff; font-family: trajan-pro-3, serif; margin-bottom: 1.2em}
.image-with-text-2 p		{color:#ffffff; margin-bottom: 0.75em}
.image-with-text-2 ul		{color:#ffffff;}
.image-with-text-2.purple	{background-color:#6C345F; color: #ffffff}
.image-with-text-2 .inner	{width:960px;}
.image-with-text-2 .cols	{display: flex; width:calc(100% + 40px); margin-left: -20px;}
.image-with-text-2 .col		{width:50%; padding: 20px;}
.image-with-text-2 .col-image-inner	{right:0px; width:100%; position: relative}

/* OUR CLIENTS */
.our-clients-page-section					{padding: 60px 0}
.our-clients-page-section .cols				{display: flex; flex-wrap: wrap; width: calc(100% - 40px); justify-content: center;}
.our-clients-page-section .cols .col		{width:20%; padding: 20px;}
.our-clients-page-section .client-text		{padding: 0 30px;}
.our-clients-page-section .client-image		{margin-bottom: 0; height: auto}
.our-clients-page-section .client-image	img	{height: auto}
.our-clients-page-section .client-text h3	{font-size: 18px; line-height: 1.3em;}

.client-text	{display: none}

/* CONTACT PAGE */
.contact-panel.contact-page-panel	{z-index: 1}
.contact-page-panel .cols			{display: flex; width:calc(100% + 40px); margin-top: 30px; margin-left: -20px;}
.contact-page-panel .inner			{width:960px;}
.contact-page-panel .col			{width:50%; padding: 20px;}
.contact-page-panel .contact-form	{width:100%; padding: 0; margin-top: 0}
.contact-page-panel iframe			{height: 100%; width: 100%;}
.contact-page-panel .contact-error	{margin-bottom: 20px;}
.google-map							{height: 100%;}

.form-cell-captcha-cell				{display: flex; justify-content: center}

/* CONTACT PANEL */
.contact-error		{border:1px solid #6C345F; padding: 20px 20px 10px;}
.contact-error ul	{list-style: none; color:#6C345F}
.contact-error p	{font-weight: 700}
.contact-panel		{text-align: center; padding: 100px 0; background-color: #ffffff; position: relative; z-index: 100}
.contact-form		{width:608px; max-width: 100%; padding: 0 20px; margin: 40px auto 0}
.form-cell			{margin:0 0 10px 0}
.form-cell-submit	{margin: 40px 0 0}

textarea,
input[type='text']	{background-color: #F6F6F6; text-align: center; width:100%; font-size: 16px; padding: 20px; color:#6C345F; transition:all 1s cubic-bezier(0.19, 1, 0.22, 1);}
textarea			{height: 130px; resize: none}

input[type='text']:focus,
textarea:focus		{background-color: #ffffff; box-shadow: 0 0 0 2px #6C345F;}

.form-cell button	{background-color: transparent}

/* FOOTER */
footer				{background-color:#F8F8F8; padding: 80px 0; z-index: 100; position: relative;}
footer .inner		{display: flex; justify-content: center;}
.footer-logo		{flex: 1;}
.footer-logo img	{width: 182px; height: auto;}

.footer-social			{flex:1; text-align: center; display: inline-flex; justify-content: center; flex-direction: column; align-items: center}
.footer-social p		{font-family: trajan-pro-3, serif; font-size: 20px;}
ul.social				{display: inline-flex; list-style: none; margin-top: 15px;}
ul.social li			{margin: 0 10px;}
ul.social li a			{border-radius: 58px; width:58px; height: 58px; background-color: #6C345F; display: flex; justify-content: center; align-items: center; transition:all 1s cubic-bezier(0.19, 1, 0.22, 1);}
ul.social li a path		{fill:#ffffff}
ul.social li a circle	{fill:#ffffff}
ul.social li a:hover	{background-color: #63656A}

.footer-contact					{flex: 1; text-align: right}
.footer-contact	p				{margin-bottom: 1em;}
.footer-contact	p a				{text-decoration: none; display: inline-block; position: relative;}
.footer-contact	p a:after		{border-top: 1px solid #6C345F; content: ''; position: absolute; left: 0; bottom: 0; width: 100%; transition:all 0.1s ease-out}
.footer-contact	p:last-child	{margin-bottom: 0}
.footer-contact	p a:hover:after	{bottom: -3px;}
.footer-contact	p a:hover		{color:#6C345F}

/* 404 PAGE */
.page-not-found	{padding: 80px 0}

/* CIRCLE BUTTON */
.slick-arrow,
.circle-btn					{width:50px; height: 50px; border:none; text-align: center; border-radius: 100px; background-color: #ffffff; display: inline-flex; position: relative; transition:all 0.4s cubic-bezier(0.19, 1, 0.22, 1); margin: auto; align-items: center; justify-content: center;}

.circle-btn svg				{transform: translateY(0px); transition:all 0.2s ease-out; }
.slick-arrow:after,
.circle-btn:after			{width:60px; height: 60px; border:1px solid #ffffff; text-align: center; border-radius: 100px; background-color: transparent; display: block; transition:all 1.2s cubic-bezier(0.19, 1, 0.22, 1); content: ''; position: absolute; left: -6px; bottom: -6px;}

.slick-arrow:before,
.circle-btn:before			{width:60px; height: 60px; border:1px solid #ffffff; text-align: center; border-radius: 100px; background-color: transparent; display: block; transition:all 1.2s cubic-bezier(0.19, 1, 0.22, 1); content: ''; position: absolute; left: -6px; bottom: -6px; opacity:0}

.circle-btn .cls-1			{fill:#63656A}
.slick-arrow:hover:after,
.circle-btn:hover:after		{transform: scale(1.8); opacity: 0}

.slick-arrow:hover:before,
.circle-btn:hover:before	{opacity: 1; transform: scale(1.1);}

.circle-btn:hover svg		{transform: translateY(2px)}

.circle-btn:hover			{background-color: #6C345F}
.circle-btn:hover .cls-1	{fill:#ffffff}

.slick-arrow	{font-size: 0; position: absolute; top:50%; transform: translateY(-50%); background-size: 10px auto; background-position: center; background-repeat: no-repeat; background-color: #6C345F}
.slick-prev		{left: -50px; background-image: url(/_assets/slick-chevron-prev-white.png);}
.slick-next		{right: -50px; background-image: url(/_assets/slick-chevron-white.png);}

.slick-arrow:after	{border:1px solid #6C345F;}
.slick-arrow:before	{border:1px solid #6C345F;}

.slick-arrow:hover				{background-color: #f1f1f1; background-image: url(/_assets/slick-chevron.png)}
.slick-arrow.slick-prev:hover	{background-color: #f1f1f1; background-image: url(/_assets/slick-chevron-prev.png)}

/* TEXT BUTTONS */
.text-btn				{font-family: trajan-pro-3, serif; color:#6C345F; font-size: 18px; text-decoration: none; display: inline-block; padding: 12px 5px 6px; position: relative;}
.text-btn span			{position: relative; z-index: 2; display: block; transition:all 0.5s cubic-bezier(0.19, 1, 0.22, 1);}
.text-btn:after			{height: 1px; background-color: #6C345F; content: ''; position: absolute; left: 0; bottom: 0; width:100%; transition:all 0.5s cubic-bezier(0.19, 1, 0.22, 1);}
.text-btn:hover:after	{height: 100%;}
.text-btn:hover span	{color:#ffffff; transform: translateY(-4px);}

/* COOKIE BAR */
.cookieBar              { width: 100%; background: url('/_assets/bg_cookiebar.png'); position: fixed; bottom: 0px; left: 0px; text-align: center; padding: 10px 10px; z-index: 99999999; box-sizing:border-box; -moz-box-sizing:border-box; }
.cookieBar p			{color:#ffffff; font-size:14px; font-family:inherit; line-height:1.5em; text-align:center; display:inline-block;}
.cookieBar .acceptBtn   {border:0px; background:#000; border:1px solid #DEDEDE; font-weight:bold; display:inline-block; margin-top:6px; margin-left:5px; font-family:inherit; font-size:12px; padding:5px 10px; text-decoration:none; color:#FFF; text-transform:uppercase; }






