@import url(/css/reset.css);
@import url(/css/text.css);
/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */
html {
  height: 100%;
}
body {
  font: 12px/16px "Gotham SSm A", "Gotham SSm B", Arial, sans-serif;
  font-style: normal;
  font-weight: 400;
  color: #323e48;
  background: #fff url(/img/ui/bg.gif) repeat-x top center;
  height: 100%;

  text-rendering: optimizeLegibility; /* emphasizes in legibility over rendering speed */
  -webkit-font-smoothing: antialiased; /* apply font anti-aliasing */
  -moz-osx-font-smoothing: grayscale; /* optimize font rendering */

  -moz-font-feature-settings: "kern" 1; /* turn on kerning, highly recomened */
  -ms-font-feature-settings: "kern" 1; /* turn on kerning, highly recomened */
  -o-font-feature-settings: "kern" 1; /* turn on kerning, highly recomened */
  -webkit-font-feature-settings: "kern" 1; /* turn on kerning, highly recomened */
  font-feature-settings: "kern" 1; /* turn on kerning, highly recomened */
  font-kerning: normal; /* turn on kerning, highly recomened */

  font-feature-settings: "liga" off; /* ligatures: on or off */
  font-feature-settings: "dlig" off; /* discretionary-ligatures: on or off */
  font-feature-settings: "tnum" off; /* tabular figures: on or off */
  font-feature-settings: "onum" off; /* old-style-figures: on or off */
  font-feature-settings: "ss01" off; /* alternate glyphs (stylistic Set): on or off */
  font-variant-numeric: lining-nums;
}

.animatein {
  visibility: hidden;
}

.resizeimg {
  max-width: 100%;
  height: auto;
}

.flexmiddle {
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
}

b {
  font-family: "Gotham SSm A", "Gotham SSm B";
  font-style: normal;
  font-weight: 500;
}

h2 {
  font-weight: 700;
  font-size: 50px;
  color: #323e48;
  letter-spacing: 0;
  line-height: 60px;
}

.showmobile {
  display: none;
}

/**** nav ****/
.homelogo {
  display: block;
  position: absolute;
  top: 30px;
  left: 30px;
  width: 250px;
  height: 50px;
  background: url("../img/content/logo.svg") top left no-repeat;
  z-index: 1000;
}

.navbutton {
  display: block;
  width: 80px;
  height: 80px;
  position: fixed;
  background: #fff;
  z-index: 9000;
  top: 0;
  right: 0;
  cursor: pointer;
  cursor: hand;
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}
.navbutton:hover {
  background: #68a2b9;
}
.navicon {
  width: 36px;
  height: 2px;
  background: #323e48;
  position: relative;
  left: 22px;
  top: 39px;
}
.navicon:before {
  content: "";
  display: block;
  width: 36px;
  height: 2px;
  background: #323e48;
  position: relative;
  top: -7px;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}
.navicon:after {
  content: "";
  display: block;
  width: 36px;
  height: 2px;
  background: #323e48;
  position: relative;
  top: 5px;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}

.s0 .navbutton {
  background: #323e48;
}
.s0 .navicon,
.s0 .navicon:before,
.s0 .navicon:after {
  background: #fff;
}

.navholder {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
  background: #323e48;
  z-index: 8000;
  height: 0;
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
  transition-delay: 0.5s;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: flex-start;
  align-items: flex-start;
  -webkit-justify-content: center;
  justify-content: center;
}

.navholder .nav {
  margin: 0 0 0 15vw;
  padding: 0;
  list-style-type: none;
  text-transform: uppercase;
  font-family: "Gotham SSm A", "Gotham SSm B";
  font-style: normal;
  font-weight: 800;
  font-size: 20px;
  line-height: 20px;
  letter-spacing: 0.05em;
}
.navholder .nav li {
  margin: 0;
  padding: 2vh 0;
}
.navholder .nav li a {
  color: #68a2b9;
  text-decoration: none;
  border-right: 1px solid #68a2b9;
  display: inline-block;
  padding-right: 20px;
  position: relative;
  top: -100vh;
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.navholder .nav li a.n0 {
  transition-delay: 0s;
}
.navholder .nav li a.n1 {
  transition-delay: 0.05s;
}
.navholder .nav li a.n2 {
  transition-delay: 0.05s;
}
.navholder .nav li a.n3 {
  transition-delay: 0.1s;
}
.navholder .nav li a.n4 {
  transition-delay: 0.15s;
}
.navholder .nav li a.n5 {
  transition-delay: 0.2s;
}
.navholder .nav li a.n6 {
  transition-delay: 0.25s;
}
.navholder .nav li a.n7 {
  transition-delay: 0.3s;
}
.navholder .nav li a.n8 {
  transition-delay: 0.35s;
}

.navholder .nav li a:hover {
  text-decoration: underline;
}

.s0 .nav a.n0,
.s1 .nav a.n1,
.s1a .nav a.n1a,
.s2 .nav a.n2,
.s3 .nav a.n3,
.s4 .nav a.n4,
.s5 .nav a.n5,
.s6 .nav a.n6,
.s7 .nav a.n7,
.s8 .nav a.n8 {
  color: #fff;
}

.menuopen .navbutton {
  background: #323e48;
}
.menuopen .navicon:before {
  top: 0;
}
.menuopen .navicon:after {
  top: -2px;
}
.menuopen .navicon,
.menuopen .navicon:before,
.menuopen .navicon:after {
  background: #fff;
}
.menuopen .navholder {
  height: 100vh;
  transition-delay: 0s;
}
.menuopen .navholder .nav li a {
  top: 0;
}

.menuopen .navholder .nav li a.n0 {
  transition-delay: 0.35s;
}
.menuopen .navholder .nav li a.n1 {
  transition-delay: 0.3s;
}
.menuopen .navholder .nav li a.n2 {
  transition-delay: 0.3s;
}
.menuopen .navholder .nav li a.n3 {
  transition-delay: 0.25s;
}
.menuopen .navholder .nav li a.n4 {
  transition-delay: 0.2s;
}
.menuopen .navholder .nav li a.n5 {
  transition-delay: 0.15s;
}
.menuopen .navholder .nav li a.n6 {
  transition-delay: 0.1s;
}
.menuopen .navholder .nav li a.n7 {
  transition-delay: 0.05s;
}
.menuopen .navholder .nav li a.n8 {
  transition-delay: 0s;
}

.banner {
  height: 80vh;
  position: relative;
  background: #323e48;
}
.bannerpic-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3);
  z-index: 1;
}
.bannertext {
  transform: translateY(52px);
  bottom: 50px;
  left: 10vw;
  position: absolute;
  color: #fff;
  width: 85%;
  font-size: 21px;
  letter-spacing: 0.05em;
  z-index: 500;
}
.bannertext h1 {
  font-size: 80px;
  letter-spacing: 0;
  line-height: 90px;
  font-family: "Gotham SSm A", "Gotham SSm B";
  font-style: normal;
  font-weight: 700;
}
.bannerpic {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: 50% 50% no-repeat;
  background-size: cover;
}
/* .bannerpic {position:absolute;top:0;right:0;width:62.5%;height:100%;background:50% 50% no-repeat;background-size:cover} */

.sectiongap {
  width: 100%;
  height: 50px;
  clear: both;
}
.bigsectiongap {
  width: 100%;
  height: 10vw;
  clear: both;
}
.introtext {
  font-size: 20px;
  line-height: 30px;
  width: 60%;
  padding: 0 0 8vw 10vw;
}
.tintstrip {
  background: #e9e9e9;
}
.leftpadding {
  padding-left: 10%;
}

.paratext {
  font-size: 20px;
  line-height: 30px;
  width: 60%;
  padding: 0 0 2vw 10vw;
}

.bluecoast-text {
  font-size: 40px;
}

.footer {
  background: #323e48;
  color: #fff;
  padding: 7.5vw 2.5vw;
}
.footer ul {
  list-style-type: none;
  margin: 0 0 50px 0;
  padding: 0;
}
.footer ul li {
  display: inline-block;
  margin: 0 30px 0 0;
  padding: 0;
}
.footer ul li a {
  color: #fff;
  text-decoration: none;
  font-weight: 500;
}
.footer ul li a:hover {
  text-decoration: underline;
}
.footer .line {
  width: 100%;
  height: 1px;
  background: #fff;
  margin-bottom: 30px;
}
.footer p {
  float: left;
}
.footer .footerlogo {
  display: block;
  background: url("../img/content/logo.svg") top right no-repeat;
  width: 90px;
  height: 40px;
  float: right;
}
.footer a {
  color: #fff;
}

/* #Page Styles
================================================== */

/**** holding ****/
.holding .footer {
  display: none;
}
.holdingpage {
  min-height: 100vh;
  background: #323e48;
  color: #fff;
}
.holdingholder {
  width: 55%;
  text-align: center;
  min-width: 700px;
}
.holdingintro {
  margin: 0;
  float: left;
  text-align: left;
  width: 55%;
  margin-right: 15%;
}

.holdingcontact {
  float: left;
  text-align: left;
  width: 30%;
}
.holding .contacttext {
  margin: 0;
}
.holding h1 {
  font-size: 28px;
  line-height: 36px;
  font-weight: 500;
  margin-bottom: 50px;
}
.holding h3 {
  font-weight: 300;
  font-size: 18px;
  line-height: 24px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.holdinglogo {
  width: 160px;
  height: 70px;
  margin-bottom: 22px;
  background: url("../img/content/logo.svg") top left no-repeat;
}

/**** home ****/
.s0 .homelogo {
  display: none;
}

.logobar {
  float: left;
  background: #323e48;
  width: 16%;
  height: 100vh;
  position: relative;
  z-index: 100;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
}
.logobar .logoholder {
  width: 100%;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  flex-wrap: wrap;
}
.logobar .logoholder .logo {
  position: absolute;
  top: 40px;
  left: 40px;
  background: url("../img/content/logo.svg") top left no-repeat;
  max-width: 180px;
  width: calc(100% - 80px);
  flex-grow: 9;
}

.bartext {
  font-family: "Gotham SSm A", "Gotham SSm B";
  font-style: normal;
  font-weight: 700;
  font-size: 34px;
  color: #ffffff;
  letter-spacing: 0;
  line-height: 56px;
  position: absolute;
  width: 40vw;
  top: 10vh;
  left: 30px;
  pointer-events: none;
}

.bartext-realestate {
  font-family: "Gotham SSm A", "Gotham SSm B";
  font-style: normal;
  font-weight: 700;
  font-size: 25px;
  color: #ffffff;
  letter-spacing: 0;
  line-height: 56px;
  position: absolute;
  width: 35vw;
  top: 10vh;
  left: 30px;
  pointer-events: none;
}

.homeoptionholder {
  width: 84%;
  height: 50vh;
  position: relative;
  flex: 1;
  flex-grow: 1;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  flex-wrap: wrap;
}
.homeoption {
  flex: 1;
  flex-grow: 1;
  height: 50vh;
  position: relative;
  color: #323e48;
  text-decoration: none;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;

  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}

.homeoption .pic {
  background: 50% 50% no-repeat;
  background-size: cover;
  position: relative;
  flex: 1;
  flex-grow: 3.5;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}
.homeoption .pic:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}
.homeoption .text {
  flex-grow: 1;
  overflow: hidden;
  flex: 1;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}

.homeoption .text h2 {
  font-family: "Gotham SSm A", "Gotham SSm B";
  font-style: normal;
  font-weight: 400;
  margin: 15px 0;
  margin-left: 30px;
  border-right: 1px solid #979797;
  letter-spacing: 0.05em;
  font-size: 21px;
  line-height: 21px;
  height: calc(100% - 30px);
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
}
.homeoption.finance .text h2 {
  border: none;
}
.homeoption:last-child .text h2 {
  border: 0;
}
.homeoption .text h2:after {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../img/ui/rightarrow.svg") left bottom no-repeat;
  margin-left: 10px;
}
.homeoption .text p {
  opacity: 0;
  margin: 50px 30px 0 30px;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}

/* .homeoption:not(.about):hover {flex-grow:1.2} */
.homeoption:not(.about):hover .pic {
  flex-grow: 1;
}
.homeoption:not(.about):hover .pic:before {
  opacity: 1;
}
.homeoption:not(.about):hover .text h2 {
  border-color: #fff;
  height: 40px;
}
.homeoption:not(.about):hover .text p {
  opacity: 1;
  margin-top: 0;
  transition-delay: 0.2s;
}

.homeoption.about {
}
.homeoption.about .pic {
  background: #f4f4f4;
}
.homeoption.about .pic p {
  font-weight: 700;
  color: #323e48;
  margin: 0;
  padding: 2vw;
  font-size: 24px;
  line-height: 30px;
}
.homeoption.about .text {
  background: #f4f4f4;
  text-decoration: none;
}
.homeoption.about:hover .text {
  text-decoration: underline;
}
.homeoption.about .text h2 {
  border: none;
}
/*.homeoption.about .text h2:after {background-image:url("../img/ui/rightarrowwhite.svg")}*/

.logobar {
  width: 16%;
  height: 100vh;
}
.logobar .logo {
  position: absolute;
  top: 20px;
  left: 20px;
  background: url("../img/content/logo.svg") top left no-repeat;
  max-width: 180px;
  width: calc(100% - 40px);
  height: 50%;
}

/**** about ****/
.memberrow {
  padding: 0 0 0 9vw;
}
.member {
  line-height: 20px;
  color: #003b71;
  letter-spacing: 0.02em;
  width: 18vw;
  margin: 0 1vw 5vw 1vw;
  float: left;
}
.member .member1 {
  height: 90px;
}
.member .membername {
  font-weight: 700;
  color: #68a2b9;
  font-size: 14px;
  padding-left: 60px;
}
.member .memberinitials {
  float: left;
  font-weight: 800;
  border-right: 1px solid #68a2b9;
  width: 44px;
  margin-right: 15px;
}
.member .membertitle {
  float: left;
}
.member .membersector {
  text-transform: uppercase;
  font-weight: 300;
  clear: both;
  padding-left: 60px;
  font-size: 11px;
}
.member .membercontact {
  padding-left: 60px;
  font-size: 10px;
  font-weight: 300;
}
.member .membercontact a {
  font-style: italic;
  font-weight: 400;
  color: #003b71;
  text-decoration: none;
}
.member .membercontact a:hover {
  text-decoration: underline;
}
.member .memberbio {
  display: inline-block;
  margin: 20px 0 0 60px;
  font-size: 11px;
  font-style: italic;
  color: #68a2b9;
  text-decoration: none;
  border-bottom: 1px solid #68a2b9;
  padding-bottom: 1px;
  display: none;
}

.offsetpic {
  width: 45vw;
  height: 30vw;
  background: 50% 50% no-repeat;
  background-size: cover;
  float: left;
  margin-top: calc((30vw - 250px) * -1);
}

.memberrow.offset {
  padding-left: 49vw;
}

.teambutton {
  display: inline-block;
  padding: 20px 100px 20px 20px;
  color: #fff;
  text-decoration: none;
  margin-top: 5vw;
  background: #323e48 url("../img/ui/rightarrowwhite.svg") right 20px center
    no-repeat;
  background-size: 20px auto;
}
.teambutton:hover {
  text-decoration: underline;
}

/**** real estate ****/
h2.offset {
  margin-top: -1em;
  margin-bottom: 2.5vw;
}
h2.halfoffset {
  margin-top: -0.5em;
  margin-bottom: 2.5vw;
}
.bigtext {
  font-size: 30px;
  color: #003b71;
  line-height: 50px;
}
.textslider .slide {
  width: 40vw;
}
.textslider .cycle-pager {
  padding-left: 37.5%;
  margin-top: 20px;
}
.textslider .cycle-pager span {
  display: inline-block;
  width: 8px;
  height: 8px;
  overflow: hidden;
  text-indent: -9999px;
  border-radius: 100%;
  border: 1px solid #323e48;
  margin-right: 25px;
  cursor: pointer;
  cursor: hand;
}
.textslider .cycle-pager span.cycle-pager-active {
  background: #323e48;
}

.rebuttons {
  margin: 0 0 5vw 5vw;
  float: left;
  width: 40%;
}
.rebuttons a {
  display: inline-block;
  background: #e9e9e9 url("../img/ui/rightarrow.svg") right 10px center
    no-repeat;
  background-size: 20px auto;
  padding: 10px 30px 10px 10px;
  width: 220px;
  font-size: 14px;
  text-transform: uppercase;
  margin: 0 10px 10px 0;
  cursor: pointer;
  cursor: hand;
}
.rebuttons a:hover {
  text-decoration: underline;
}

.projects {
  overflow-x: hidden;
}

/*.projectpicholder {width:70%;margin:0 5% 0 0;float:left}
.previewslider {width:100%;overflow:hidden}
.previewslider .cycle-slideshow {width:calc(120vw + 60px)}

.previewslider .cycle-slideshow .slide {margin:0 0 0 30px;background:50% 50% no-repeat;background-size:cover;height:60vh;width:60vw}

.leftpic .previewslider .cycle-slideshow {margin-left:calc(((120vw + 60px) - 70vw) * -1)}

.projecttextslider {float:left;margin:0 2.5% 0 0;width:22.5%;height:60vh;}
.projecttextslider .slide {width:100%;height:100%}
.projecttextslider .slide .holder {width:100%;height:100%;
display: -webkit-flex;
   display: flex;
   -webkit-flex-direction: column;
   flex-direction: column;
   -webkit-align-items: flex-start;
   align-items: flex-start;
   -webkit-justify-content: flex-end;
   justify-content: flex-end;}

.projecttextslider .sliderheading {background:#E0E1E2;display:inline-block;padding:3px;text-transform: uppercase;color:#323E48;margin-bottom:40px;font-size:11px}
.projecttextslider .country {font-weight:500;color:#7E858C;font-size:11px;margin-bottom:20px}
.projecttextslider .propertyname {font-size: 29px;color: #000000;letter-spacing: 0.05em;line-height: 28px;margin-bottom:50px}
.projecttextslider .description {font-size: 13px;color: #000000;letter-spacing: 0.01em;line-height: 23px;margin-bottom:5vw}

.cyclecontrols {margin-top:20px;margin-left:10%;width:60%;clear:both}
.prevnext {float:left}
.projectprev, .projectnext {width:20px;height:20px;display:inline-block;background:top left no-repeat url("../img/ui/leftarrow.svg");margin-right:30px;cursor:pointer;cursor:hand}
.projectnext {background-image:url("../img/ui/rightarrow.svg")}
.projectprev {opacity:0.2}

.projectpager  {margin-top:0px;float:right}
.projectpager  span {display:inline-block;width:8px;height:8px;overflow:hidden;text-indent:-9999px;border-radius:100%;border:1px solid #323E48;margin-left:25px;cursor:pointer;cursor:hand}
.projectpager  span.cycle-pager-active {background:#323E48}


.leftproject .previewslider .cycle-slideshow .slide {margin:0 30px 0 0}

.leftproject .projecttextslider {float:left;margin:0 0 0 2.5%;width:22.5%;height:60vh;}
.leftproject .projectpicholder {width:70%;margin:0 0 0 5%;float:left}
.leftproject .cyclecontrols {margin-top:20px;margin-left:30%;width:60%;clear:both}

.rightpic .projectpicholder {float:right}*/
.leftproject .leftpadding {
  padding-left: 10%;
}
.leftproject .textslider .cycle-pager {
  padding-left: 10%;
}

/**** slick carousel styles ****/
.slick-arrow {
  width: 20px;
  height: 20px;
  display: inline-block;
  background: bottom left no-repeat url(../img/ui/leftarrow.svg);
  margin-right: 30px;
  cursor: pointer;
  cursor: hand;
  border: 0;
  text-indent: -9999px;
  overflow: hidden;
}
.slick-dots {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
.slick-dots li {
  display: inline;
  margin: 0;
}
.slick-dots button {
  display: inline-block;
  width: 10px;
  height: 10px;
  overflow: hidden;
  text-indent: -9999px;
  border-radius: 100%;
  border: 1px solid #323e48;
  margin-left: 30px;
  cursor: pointer;
  cursor: hand;
  padding: 0;
  background: transparent;
}
.slick-active button {
  background: #323e48;
}
.slick-arrow.slick-prev {
  opacity: 0.4;
}
.slick-arrow.slick-next {
  background-image: url(../img/ui/rightarrow.svg);
}
.portfoliopic.slick-slider {
  padding-bottom: 30px;
}
.portfoliopic .slide {
  height: 60vh;
  width: 55vw;
  margin-left: 30px;
  background: 50% 50% no-repeat;
  background-size: cover;
}

.leftslide .picsliderholder {
  position: relative;
  height: calc(60vh + 30px);
  width: 65%;
  float: left;
}
.leftslide .portfoliopic .slick-prev {
  position: absolute;
  bottom: 0;
  right: calc(55vw - 50px);
}
.leftslide .portfoliopic .slick-next {
  position: absolute;
  bottom: 0;
  right: calc(55vw - 100px);
}
.leftslide .portfoliopic .slick-dots {
  position: absolute;
  bottom: 0;
  right: 0;
}

.textsliderholder {
  width: 30%;
  height: 60vh;
  float: left;
  text-align: left;
}
.portfoliotextslides .slide {
  height: 60vh;
}
.portfoliotextslides .slidepadding {
  padding: 0 10vw 0 5vw;
  height: 100%;
  direction: ltr;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: flex-start;
  align-items: flex-start;
  -webkit-justify-content: flex-end;
  justify-content: flex-end;
}
.portfoliotextslides .sliderheading {
  background: #e0e1e2;
  display: inline-block;
  padding: 3px;
  text-transform: uppercase;
  color: #323e48;
  margin-bottom: 40px;
  font-size: 11px;
}
.portfoliotextslides .country {
  font-weight: 500;
  color: #7e858c;
  font-size: 11px;
  margin-bottom: 20px;
}
.portfoliotextslides .propertyname {
  font-size: 29px;
  color: #000000;
  letter-spacing: 0.05em;
  line-height: 29px;
  margin-bottom: 50px;
}
.portfoliotextslides .description {
  font-size: 13px;
  color: #000000;
  letter-spacing: 0.01em;
  line-height: 23px;
  margin-bottom: 5vw;
}

.rightslide .picsliderholder {
  position: relative;
  height: calc(60vh + 30px);
  width: 65%;
  float: right;
}
.rightslide .portfoliopic .slide {
  margin-right: 30px;
  margin-left: 0;
}
.rightslide .slick-prev {
  position: absolute;
  bottom: 0;
  left: 0;
}
.rightslide .slick-next {
  position: absolute;
  bottom: 0;
  left: 50px;
}
.rightslide .slick-dots {
  position: absolute;
  bottom: 0;
  right: calc(100% - 55vw);
}
.rightslide .textsliderholder {
  text-align: left;
}
.rightslide .portfoliotextslides .slidepadding {
  padding: 0 5vw 0 10vw;
}

.realisedhead {
  padding-left: 1em;
  cursor: pointer;
  position: relative;
}
.realisedhead:hover {
  text-decoration: underline;
}
.realisedhead:before {
  content: "+";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  color: #68a2b9;
  transition: transform 0.2s;
}
.realisedhead.active:before {
  transform: rotate(45deg);
}

.realised {
  overflow: hidden;
  transition: max-height 0.2s;
  max-height: 2000px;
}
.hiderealised {
  max-height: 0;
}

/**** new layout slider ****/
.resliderholder {
  width: 100%;
  height: 90vh;
  position: relative;
}
.recontrolsholder {
  position: absolute;
  top: -60px;
  width: 25vw;
  z-index: 2000;
}
.recontrols {
  background: #e9e9e9;
  padding: 2vw;
  position: relative;
}
.recontrols h3 {
  font-size: 30px;
  line-height: 30px;
}
.reline {
  margin: 20px 0;
  width: 20%;
  height: 1px;
  background: #979797;
}
.recaption {
  font-size: 13px;
  line-height: 18px;
}
.recaption span {
  font-size: 11px;
  color: #7e858c;
}
.recaption b {
  font-weight: 700;
}
.reprev,
.renext {
  position: absolute;
  top: 100%;
  left: 0;
  background: #e9e9e9;
  width: 43px;
  height: 36px;
  cursor: pointer;
  cursor: hand;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
}
.renext {
  left: 43px;
}
.reprev img,
.renext img {
  width: 50%;
  height: auto;
}
.reprev img {
  opacity: 0.15;
}
.reprev:hover,
.renext:hover {
  background: #fff;
}
.repager {
  position: absolute;
  bottom: 60px;
  left: 0;
  width: 100%;
  z-index: 2000;
  text-align: center;
}
.repager span {
  display: inline-block;
  width: 8px;
  height: 8px;
  border: 1px solid #fff;
  border-radius: 100%;
  margin: 0 15px;
  cursor: pointer;
  cursor: hand;
}
.repager span.cycle-pager-active {
  background: #fff;
}

.rightcontrols {
  left: auto;
  right: 0;
  text-align: right;
}
.rightcontrols .reline {
  float: right;
}
.rightcontrols .recaption {
  clear: both;
}
.rightcontrols .reprev,
.rightcontrols .renext {
  left: auto;
}
.rightcontrols .reprev {
  right: 43px;
}
.rightcontrols .renext {
  right: 0;
}

.reslider {
  width: 100%;
  height: 100%;
}
.reslider .slide {
  width: 100%;
  height: 100%;
  background: 50% 50% no-repeat;
  background-size: cover;
}

/**** private equity ****/
.s3 .bannerpic {
  opacity: 0.8;
}
.s3 .introtext {
  width: 40%;
  float: left;
}
.halfwidth {
  width: 50%;
}

.portfolio {
  display: flex;
  flex-wrap: wrap;
  -webkit-flex-direction: row;
  flex-direction: row;
}

.portfoliobreak {
  width: 100%;
}

.portfoliorow {
  height: 50vh;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  flex-wrap: wrap;
}
.portfolioitem {
  flex: 1;
  flex-grow: 1;
  position: relative;
  color: #323e48;
  text-decoration: none;
  height: 60vh;
  width: 20vw;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;

  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}

.portfoliopic {
  background: top center no-repeat;
  background-size: cover;
  position: relative;
  flex: 1;
  flex-grow: 3;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}

.portfoliotext {
  flex-grow: 1;
  overflow: hidden;
  flex: 1;
  background: #fff;
  min-height: 12vh;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}

.portfoliologo {
  height: 10vh;
  width: 80%;
  margin: 1vh auto;
  background: 50% 50% no-repeat;
  background-size: contain;
  max-width: 16vw;
}

.portfoliotext p {
  opacity: 0;
  margin: 20px 30px 0 30px;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}

.portfolioitem:hover {
  flex-grow: 3;
}
.portfolioitem:hover .portfoliotext {
  flex-grow: 2;
}
.portfolioitem:hover .portfoliotext p {
  opacity: 1;
  margin-top: 0;
  transition-delay: 0.2s;
  max-width: 650px;
  margin-right: auto;
  margin-left: auto;
}

.partners {
  padding: 0 10vw;
}
.partners h1 {
  font-size: 50px;
  color: #003b71;
  letter-spacing: 0;
  text-align: center;
  line-height: 60px;
  font-weight: bold;
  margin-bottom: 10vw;
}

.fund-title {
  padding-left: 10vw !important;
}

.partnerholder {
  display: flex;
  align-content: flex-start;
  flex-wrap: wrap;
  justify-content: center;
}
.partnerlogo {
  display: flex;
  width: calc((100% / 6) - 40px);
  height: 5vw;
  margin: 4vw 20px;
  background: 50% 50% no-repeat;
  background-size: contain;
}

/**** contact ****/
.contactpage {
  height: 100vh;
  background: #323e48;
  color: #fff;
}
.contactdetails {
  width: 50%;
  height: 100vh;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: flex-start;
  align-items: flex-start;
  -webkit-justify-content: center;
  justify-content: center;
}
.contacttext {
  margin-left: 10vw;
  letter-spacing: 0.02em;
  line-height: 20px;
  font-size: 12px;
}
.contacttext a {
  color: #fff;
  text-decoration: none;
}
.contacttext a:hover {
  text-decoration: underline;
}
.contacttext b {
  font-size: 14px;
  font-weight: 700;
}
.contacttext .smh {
  text-transform: uppercase;
  font-weight: 500;
  font-size: 11px;
  color: #9ab1c6;
}
.map {
  width: 50%;
  height: 100vh;
  position: absolute;
  top: 0;
  right: 0;
}

/**** tax ****/
.taxfooter {
  display: none;
}
.aboutfooter .taxfooter {
  display: inline;
}
.tax {
  min-height: 100vh;
  background: #323e48;
  color: #fff;
}
.tax b {
  font-weight: 700;
}
.taxtext {
  margin-left: 10vw;
  letter-spacing: 0.02em;
  line-height: 20px;
  font-size: 12px;
  width: 75vw;
  max-width: 800px;
  padding-top: 200px;
  padding-bottom: 50px;
}

ol {
  list-style-type: none;
  counter-reset: item;
  margin: 0;
  padding: 0;
}

ol > li {
  display: table;
  counter-increment: item;
  margin-bottom: 0.6em;
}

ol > li:before {
  content: counters(item, ".") ". ";
  display: table-cell;
  padding-right: 0.6em;
}

li ol > li {
  margin: 0;
}

li ol > li:before {
  content: counters(item, ".") " ";
}

.decimalholder {
  margin-left: 0;
  padding-left: 0;
}
ol.decimalholder > li:before {
  display: none !important;
}

/****************************************************
* Misc
****************************/
/*hide social stuff and headings on prettyphoto*/
.ppt {
  display: none !important;
}
.pp_social {
  display: none !important;
}
.pp_description {
  display: none !important;
}

.smallText {
  font-size: 11px;
}
.smallprint {
  font-size: 11px;
  color: #bbbdc0;
}
.smallprint a {
  color: #bbbdc0;
}
.padTop {
  margin-top: 30px;
}
.largeText {
  font-size: 13px;
}

.superscript {
  vertical-align: baseline;
  font-size: 0.8em;
  position: relative;
  top: -0.4em;
}
.subscript {
  vertical-align: baseline;
  font-size: 0.8em;
  position: relative;
  top: 0.4em;
}

.vmiddle {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.caps {
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.num {
  text-align: right;
}

/* #Media Queries
================================================== */

/* biggest desktop */
@media only screen and (max-width: 1230px) {
}

/* bigger desktop */
@media only screen and (max-width: 1229px) {
  .bannertext {
    left: 5vw;
  }
  .introtext {
    padding-left: 5vw;
  }

  /**** home ****/
  .homeoption .text h2 {
    font-size: 16px;
  }
  .homeoptionholder .homeoption .pic {
    flex-grow: 4;
  }
  /*.homeoption.about .pic {flex-grow:4}*/

  /**** about ****/
  .memberrow {
    padding-left: 4vw;
  }
  .member {
    width: 20vw;
  }
  .memberrow.offset {
    padding-left: 48vw;
  }

  /**** real estate ****/
  .recontrolsholder {
    width: 35vw;
  }
}

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 1099px) {
  .homeoption.about .pic p {
    font-size: 20px;
    line-height: 24px;
  }
}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {
  /**** home ****/
  .bartext {
    width: 60vw;
  }
  .homeoption .text h2 {
    font-size: 11px; /*padding-top:1vw*/
  }
  .homeoption .text h2:after {
    top: -3px;
    position: relative;
  }

  /**** about ****/
  .member {
    width: 40vw;
  }

  /**** private equity ****/
  .portfolioitem:hover .portfoliotext {
    flex-grow: 6;
  }

  /**** contact ****/
  .contactdetails {
    width: 100%;
    height: 50vh;
  }
  .map {
    position: relative;
    width: 100%;
    height: 50vh;
  }
}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
  .mobilegap {
    width: 100%;
    height: 40px;
    clear: both;
  }

  /**** nav ****/
  .homelogo {
    width: 80px;
    top: 20px;
    left: 20px;
  }

  .navbutton {
    width: 60px;
    height: 60px;
  }
  .navicon {
    width: 30px;
    height: 2px;
    left: 15px;
    top: 30px;
  }
  .navicon:before {
    width: 30px;
  }
  .navicon:after {
    width: 30px;
  }
  .navholder .nav {
    margin: 0 0 0 5vw;
  }
  .navholder .nav li {
    padding: 3vh 0;
  }

  /**** footer ****/
  .footer {
    padding: 10vw 5vw;
  }
  .footer ul {
    margin: 0 0 50px 0;
  }
  .footer ul li {
    display: block;
    margin: 15px 0;
  }

  /**** holding ****/

  .holdingholder {
    width: 90%;
    min-width: inherit;
    padding: 10vh 0;
  }
  .holdingintro {
    float: none;
    width: 100%;
    margin: 0 0 40px 0;
  }

  .holdingcontact {
    float: none;
    width: 100%;
    margin-top: 80px;
  }
  .holding h1 {
    font-size: 20px;
    line-height: 24px;
    font-weight: 500;
    margin-bottom: 20px;
  }
  .holding h3 {
    font-weight: 300;
    font-size: 14px;
    line-height: 20px;
  }

  .holdinglogo {
    width: 160px;
    height: 50px;
    margin-bottom: 22px;
    background: url("../img/content/logo.svg") top left no-repeat;
  }

  /**** home ****/
  /*.logobar {width:100%;height:25vh;background: #003B71 url("../img/content/logo.svg") no-repeat top 20px left 20px;background-size: 80px auto;}*/
  .bartext {
    font-size: 16px;
    line-height: 20px;
    top: 80px;
    left: 20px;
    width: calc(100% - 40px);
  }

  .homeoptionholder {
    width: 100%;
    -webkit-flex-direction: column;
    flex-direction: column;
    height: 75vh;
  }
  .homeoptionholder .homeoption {
    position: relative;
    width: 100%;
    height: 25vh;
    display: block;
  }
  .homeoption .pic {
    width: 100%;
    height: 100%;
    display: block;
    flex: 0;
    flex-grow: 0;
  }
  .homeoption .text {
    display: inline-block;
    position: absolute;
    bottom: 0;
    left: 0;
    background: #fff;
  }
  .homeoption .text p {
    display: none;
  }
  .homeoptionholder .homeoption .text h2 {
    margin: 0;
    border: none;
    padding: 10px 15px 10px 30px;
    font-size: 13px;
    line-height: 13px;
  }
  .homeoptionholder .homeoption .text h2::after {
    display: none;
  }

  .homeoption.about {
    width: 100%;
    float: none;
    height: auto;
    display: block;
  }
  .homeoption.about .pic {
    width: 100%;
    height: 50vh;
    display: block;
  }
  .homeoption.about .logo {
    position: relative;
    top: auto;
    left: auto;
    margin: 20px;
    clear: both;
    height: 50%;
    max-width: 120px;
  }
  .logobar {
    width: 100%;
    height: 25vh;
  }
  .logobar .logo {
    position: relative;
    top: auto;
    left: auto;
    margin: 20px;
    clear: both;
    height: 30px;
    width: 100%;
  }
  .homeoption.about .text {
    background: transparent;
    display: block;
  }
  /*.homeoption.about .text:hover {}*/
  .homeoption.about .text h2 {
    margin-left: 20px;
  }

  /*.homeoption.about {display:none}*/
  .homeoption.about .pic {
    height: 100%;
  }
  .homeoption.about .pic p {
    font-size: 14px;
    line-height: 18px;
  }

  /**** real estate ****/
  .bannertext p {
    font-size: 12px;
    line-height: 16px;
  }
  .bannertext h1 {
    font-size: 30px;
    line-height: 30px;
  }
  .introtext {
    padding: 5vw 5vw 60px 5vw;
    width: 90vw;
    font-size: 16px;
    line-height: 24px;
  }
  .bigtext {
    font-size: 22px;
    line-height: 34px;
  }

  .textslider .slide {
    width: 90vw;
  }
  .textslider .cycle-pager {
    padding-left: 5vw;
  }

  .leftpadding {
    padding-left: 5vw;
  }
  h2 {
    font-size: 30px;
    line-height: 34px;
    margin-bottom: 30px;
  }
  h2.halfoffset {
    margin-bottom: 30px;
  }
  .halfwidth {
    width: 90vw;
    padding: 0 5vw;
  }

  /*.showmobile {display:block}
		.sliderheading.showmobile { background: #E0E1E2; display: inline-block; padding: 3px; text-transform: uppercase; color: #323E48; margin: 5vw; font-size: 11px;}
		.projectpicholder {width:100%;margin:0 0 0 0;float:none}
		.previewslider {width:100%;overflow:hidden}
		.previewslider .cycle-slideshow {width:200vw}

		.previewslider .cycle-slideshow .slide {margin:0 5vw 0 0;width:95vw}
		.leftpic .previewslider .cycle-slideshow {margin-left:-100vw}

		.projecttextslider {margin:5vw;width:90vw;float:none;height:auto}
		.projecttextslider .slide .holder {display:block;height:auto}
		.projecttextslider .sliderheading {display:none}
		.projecttextslider .propertyname {margin-bottom:20px}

		.cyclecontrols { margin: 20px 5%;  width: 90%;  clear: both;}

		.leftproject .projecttextslider {float: none;  margin: 5%;   width: 90%;   height: auto;}

		.leftproject .leftpadding {padding-left:5%}
		.leftproject .textslider .cycle-pager {padding-left:5%}
		.leftproject .projecttextslider {float: none;  margin: 5%;   width: 90%;   height: auto;}
		.leftproject .projectpicholder {width:100%;margin:0 0 0 5%;float:none}
		.leftproject .cyclecontrols {margin-top:20px;margin-left:5%;width:90%;clear:both}

		.projecttextslider .description {margin-bottom:0}*/

  /**** slick carousel styles ****/
  .sliderheading.showmobile {
    background: #e0e1e2;
    display: inline-block;
    padding: 3px;
    text-transform: uppercase;
    color: #323e48;
    margin: 5vw;
    font-size: 11px;
  }
  .slick-dots button {
    margin-left: 30px;
  }
  .portfoliopic.slick-slider {
    padding-bottom: 30px;
  }
  .portfoliopic .slide {
    height: 60vh;
    width: 95vw;
    margin-left: 6vw;
  }

  .leftslide .picsliderholder {
    width: 100%;
    float: none;
  }
  .leftslide .portfoliopic .slick-prev {
    left: 5vw;
    right: inherit;
  }
  .leftslide .portfoliopic .slick-next {
    left: calc(5vw + 50px);
    right: inherit;
  }
  .leftslide .portfoliopic .slick-dots {
    right: 5vw;
  }

  .textsliderholder {
    width: 90%;
    height: auto;
    float: none;
  }
  .portfoliotextslides .slide {
    height: auto;
  }
  .portfoliotextslides .slidepadding {
    padding: 20px 5vw 0 5vw;
  }
  .portfoliotextslides .sliderheading {
    display: none;
  }
  .portfoliotextslides .propertyname {
    margin-bottom: 20px;
  }

  .rightslide .picsliderholder {
    width: 100%;
    float: none;
  }
  .rightslide .portfoliopic .slide {
    margin-right: 6vw;
    margin-left: 0;
  }
  .rightslide .slick-prev {
    left: 5vw;
  }
  .rightslide .slick-next {
    left: calc(50px + 5vw);
  }
  .rightslide .slick-dots {
    right: 5vw;
  }
  .rightslide .portfoliotextslides .slidepadding {
    padding: 20px 5vw 0 30px;
  }

  /**** new layout slides ****/
  .resliderholder {
    height: auto;
  }
  .recontrolsholder {
    position: relative;
    top: 0;
    width: 100%;
  }
  .recontrols {
    padding: 5vw;
  }
  .recontrols h3 {
    font-size: 20px;
    line-height: 20px;
  }
  .reline {
    margin: 20px 0;
    width: 20%;
    height: 1px;
    background: #979797;
  }
  .repager {
    bottom: 20px;
  }

  .rightcontrols {
    text-align: left;
  }
  .rightcontrols .reline {
    float: none;
  }
  .rightcontrols .recaption {
    clear: both;
  }
  .rightcontrols .reprev,
  .rightcontrols .renext {
    right: auto;
  }
  .rightcontrols .reprev {
    left: 0;
  }
  .rightcontrols .renext {
    left: 43px;
  }

  .reslider {
    width: 100%;
    height: 70vh;
  }

  /**** about ****/

  .member {
    width: 90vw;
  }
  .offsetpic {
    display: none;
  }
  .memberrow.offset {
    padding-left: 5vw;
  }

  .member {
    margin-bottom: 40px;
  }
  .member .member1 {
    height: auto;
    margin-bottom: 5px;
  }

  /**** private equity ****/

  .s3 .introtext {
    width: 80%;
  }
  .portfolioitem {
    width: 50vw;
    flex: 1 1 auto;
  }
  .portfoliobreak {
    display: none;
  }
  .portfoliologo {
    flex: 1 1 auto;
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
    display: block;
    max-width: none;
  }
  .portfoliotext p {
    margin: 10px;
    font-size: 11px;
    line-height: 13px;
  }

  .portfolioitem:hover .portfoliotext {
    flex-grow: 10;
  }

  .partners {
    padding: 10vw 0;
  }
  .partners h1 {
    font-size: 22px;
    line-height: 34px;
  }
  .partnerholder {
    display: flex;
    align-content: flex-start;
    flex-wrap: wrap;
    justify-content: center;
  }
  .partnerlogo {
    display: flex;
    width: calc((100% / 2) - 40px);
    height: 45vw;
  }

  /**** contact ****/
  .contactpage {
    height: auto;
  }
  .contactdetails {
    width: 100%;
    height: auto;
    padding: 100px 0 50px 0;
  }

  /*.map {width:50%;height:100vh;position:absolute;top:0;right:0}*/
}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
  .logobar {
    height: 25vh;
  }
  .homeoptionholder {
    width: 100%;
    -webkit-flex-direction: row;
    flex-direction: row;
    height: 75vh;
  }
  .homeoptionholder .homeoption {
    position: relative;
    width: 100%;
    height: 75vh;
    display: block;
  }

  .portfolioitem {
    height: 85vh;
  }
  .portfoliologo {
    height: 15vh;
  }

  .partnerlogo {
    display: flex;
    width: calc((100% / 2) - 60px);
    height: 10vw;
    margin: 30px;
  }

  .map {
    height: 75vh;
  }

  .navholder .nav {
    font-size: 16px;
    line-height: 16px;
  }
  .navholder .nav li {
    padding: 2vh 0;
  }
}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
}

/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/

/* keyframes */
.wipeon {
  background: #000;
  height: 100vh;
  width: 0;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  animation-duration: 0.25s;
  transition-timing-function: ease-in;
  animation-fill-mode: both;
}
.wipeoff {
  background: #000;
  height: 100vh;
  width: 0;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 9999;
  animation-duration: 0.25s;
  transition-timing-function: ease-in;
  animation-fill-mode: both;
}

.wipe {
  background: #323e48;
  height: 100vh;
  width: 0;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  animation-duration: 0.5s;
  transition-timing-function: ease-in;
  animation-fill-mode: both;
}
@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translate3d(0, 0, 0);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}

@keyframes wipeoff {
  0% {
    width: 100vw;
    right: 0;
    left: inherit;
  }
  100% {
    width: 0;
    right: 0;
    left: inherit;
  }
}
@keyframes wipeon {
  0% {
    width: 0;
    left: 0;
    right: inherit;
  }
  100% {
    width: 100vw;
    left: 0;
    right: inherit;
  }
}

/* for the page animations */
.m-scene .scene-element {
  animation-duration: 0.5s;
  transition-timing-function: ease-in;
  animation-fill-mode: both;
}

.m-scene .scene-element--fadeinup {
  animation-name: fadeInUp;
}
.m-scene .wipeoff {
  animation-name: wipeoff;
  animation-delay: 0s;
}
.m-scene .wipe {
  animation-name: wipeoff;
  animation-delay: 0s;
}

.m-scene.is-exiting .scene-element {
  animation-direction: alternate-reverse;
}
.m-scene.is-exiting .wipeon {
  animation-name: wipeon;
  animation-delay: 0s;
}
.m-scene.is-exiting .wipe {
  animation-name: wipeon;
  animation-delay: 0s;
}
/*.m-scene.is-exiting .wipeon {animation-name:wipeon}*/

/* Cookie banner */

.cookie-banner {
  font-family: "Gotham SSm A", "Gotham SSm B", Arial, sans-serif;
  background-color: #fff;
  color: #323e48;
  width: 300px;
  max-width: 80%;
  position: fixed;
  bottom: 15px;
  right: 15px;
  /* bottom: 1rem;
  right: 1rem; */
  z-index: 1000;
  border-radius: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 2rem;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
}

.cookie-banner svg {
  position: absolute;
  width: 20px;
  top: 10px;
  right: 10px;
  fill: #323e48 !important;
  cursor: pointer;
  transition: all 0.3s ease;
}

.cookie-banner svg:hover {
  opacity: 0.8;
  transition: all 0.3s ease;
}

.cookie-banner p {
  padding: 0;
  margin: 0;
  line-height: 1.4;
  font-size: 14px;
}

.cookie-banner a {
  color: #323e48;
}

.cookie-banner .buttons-wrap {
  display: flex;
  justify-content: space-between;
  margin-top: 1rem;
}

.cookie-banner .buttons-wrap .accept,
.cookie-banner .buttons-wrap .decline {
  width: 40%;
  background-color: #323e48;
  color: #fff;
  padding: 5px 10px;
  border: 0;
  border-radius: 3px;
  text-align: center;
  cursor: pointer;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 1px;
  transition: all 0.3s ease;
}

.cookie-banner .buttons-wrap .accept:hover,
.cookie-banner .buttons-wrap .decline:hover {
  background-color: #68a2b9;
  transition: all 0.3s ease;
  color: white;
}

.hidden {
  display: none;
}

.cookie-policy {
  background-color: #fff;
  color: #323e48;
  padding: 7.5vw 2.5vw;
}

.cookie-policy a {
  color: #68a2b9;
}

.cookie-container {
  /* max-width: 2200px; */
  margin: 0 auto;
}