/* =============================================================================
	@colors
	========================================================================== */
.goldie {
  color: #fdbe1c; }

.dj-tan {
  color: #876c3b; }

.dj-green {
  color: #70c989; }

/* =============================================================================
	@images
	========================================================================== */
/* =============================================================================
	@media-sizes
	========================================================================== */
/* =============================================================================
	HTML5 display definitions
	========================================================================== */
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section {
  display: block; }

audio, canvas, video {
  display: inline-block;
  *display: inline;
  *zoom: 1; }

audio:not([controls]) {
  display: none; }

[hidden] {
  display: none; }

/* =============================================================================
	Reset
	========================================================================== */
html, body, div, span, applet, object, iframe, main, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  border: 0;
  padding: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline; }

/* =============================================================================
	Base
	========================================================================== */
html {
  height: 100%;
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%; }

html, button, input, select, textarea {
  font-family: sans-serif;
  color: #222; }

body {
  height: 100%;
  margin: 0; }

::-moz-selection {
  background: black;
  color: #ffffff;
  text-shadow: none; }

::selection {
  background: black;
  color: #ffffff;
  text-shadow: none; }

a {
  text-decoration: none;
  -moz-transition: opacity 500ms ease, color 500ms ease;
  -o-transition: opacity 500ms ease,color 500ms ease;
  -webkit-transition: opacity 500ms ease, color 500ms ease;
  transition: opacity 500ms ease,color 500ms ease; }

*:focus, :focus {
  outline: 0; }

::-webkit-input-placeholder {
  color: #ffffff; }

:-moz-placeholder {
  /* Firefox 18- */
  color: #ffffff; }

::-moz-placeholder {
  /* Firefox 19+ */
  color: #ffffff; }

:-ms-input-placeholder {
  color: #ffffff; }

* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

/* =============================================================================
	Typography
	========================================================================== */
abbr[title] {
  border-bottom: 1px dotted; }

b, strong {
  font-weight: bold; }

blockquote {
  margin: 1em 40px; }

dfn {
  font-style: italic; }

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0; }

ins {
  background: #ff9;
  color: #000;
  text-decoration: none; }

mark {
  background: #ff0;
  color: #000;
  font-style: italic;
  font-weight: bold; }

/* Redeclare monospace font family: h5bp.com/j */
pre, code, kbd, samp {
  font-family: monospace, serif;
  _font-family: 'courier new', monospace;
  font-size: 1em; }

/* Improve readability of pre-formatted text in all browsers */
pre {
  white-space: pre;
  white-space: pre-wrap;
  word-wrap: break-word; }

q {
  quotes: none; }

q:before, q:after {
  content: "";
  content: none; }

small {
  font-size: 85%; }

/* Position subscript and superscript content without affecting line-height: h5bp.com/k */
sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

/* =============================================================================
	Lists
	========================================================================== */
ul, ol {
  margin: 1em 0;
  padding: 0 0 0 40px; }

dd {
  margin: 0 0 0 40px; }

nav ul, nav ol, ul.not-list, ol.not-list {
  list-style: none;
  list-style-image: none;
  margin: 0;
  padding: 0; }

/* =============================================================================
	Embedded content
	========================================================================== */
img {
  border: 0;
  -ms-interpolation-mode: bicubic;
  vertical-align: top; }

svg:not(:root) {
  overflow: hidden; }

/* =============================================================================
	Figures
	========================================================================== */
figure {
  margin: 0; }

/* =============================================================================
	Forms
	========================================================================== */
form {
  margin: 0; }

fieldset {
  border: 0;
  margin: 0;
  padding: 0; }

/* Indicate that 'label' will shift focus to the associated form element */
label {
  cursor: pointer; }

/*
	 * 1. Correct color not inheriting in IE6/7/8/9
	 * 2. Correct alignment displayed oddly in IE6/7
	 */
legend {
  border: 0;
  *margin-left: -7px;
  padding: 0;
  white-space: normal; }

/*
	 * 1. Correct font-size not inheriting in all browsers
	 * 2. Remove margins in FF3/4 S5 Chrome
	 * 3. Define consistent vertical alignment display in all browsers
	 */
button, input, select, textarea {
  font-size: 100%;
  margin: 0;
  vertical-align: baseline;
  *vertical-align: middle; }

/*
	 * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
	 */
button, input {
  line-height: normal; }

/*
	 * 1. Display hand cursor for clickable form elements
	 * 2. Allow styling of clickable form elements in iOS
	 * 3. Correct inner spacing displayed oddly in IE7 (doesn't effect IE6)
	 */
button, input[type="button"], input[type="reset"], input[type="submit"] {
  cursor: pointer;
  -webkit-appearance: button;
  *overflow: visible; }

/*
	 * Re-set default cursor for disabled elements
	 */
button[disabled], input[disabled] {
  cursor: default; }

/*
	 * Consistent box sizing and appearance
	 */
input[type="checkbox"], input[type="radio"] {
  box-sizing: border-box;
  padding: 0;
  *width: 13px;
  *height: 13px; }

input[type="search"] {
  -webkit-appearance: textfield;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box; }

input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none; }

/*
	 * Remove inner padding and border in FF3/4: h5bp.com/l
	 */
button::-moz-focus-inner, input::-moz-focus-inner {
  border: 0;
  padding: 0; }

/*
	 * 1. Remove default vertical scrollbar in IE6/7/8/9
	 * 2. Allow only vertical resizing
	 */
textarea {
  overflow: auto;
  vertical-align: top;
  resize: vertical; }

/* Colors for form validity */
input:invalid, textarea:invalid {
  background-color: #f0dddd; }

/* =============================================================================
	Tables
	========================================================================== */
table {
  border-collapse: collapse;
  border-spacing: 0; }

td {
  vertical-align: top; }

/* ==|== non-semantic helper classes ========================================
	Please define your styles before this section.
	========================================================================== */
/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden {
  display: none !important;
  visibility: hidden; }

.no-txt {
  text-indent: 200%;
  white-space: nowrap;
  overflow: hidden; }

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px !important;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible {
  visibility: hidden; }

.clear-box:before, .clear-box:after {
  content: "";
  display: table; }

.clear-box:after {
  clear: both; }

.clear-box {
  *zoom: 1; }

/* =============================================================================
	@font-declarations
	========================================================================== */
@font-face {
  font-family: 'Didot';
  src: url("../fonts/didot/didot.eot");
  src: url("../fonts/didot/didot.eot?#iefix") format("embedded-opentype"), url("../fonts/didot/didot.woff") format("woff"), url("../fonts/didot/didot.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'dosisregular';
  src: url("../fonts/dosis/regular/Dosis-Regular-webfont.eot");
  src: url("../fonts/dosis/regular/Dosis-Regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/dosis/regular/Dosis-Regular-webfont.woff2") format("woff2"), url("../fonts/dosis/regular/Dosis-Regular-webfont.woff") format("woff"), url("../fonts/dosis/regular/Dosis-Regular-webfont.ttf") format("truetype"), url("../fonts/dosis/regular/Dosis-Regular-webfont.svg#dosisregular") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'dosissemibold';
  src: url("../fonts/dosis/semibold/Dosis-SemiBold-webfont.eot");
  src: url("../fonts/dosis/semibold/Dosis-SemiBold-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/dosis/semibold/Dosis-SemiBold-webfont.woff2") format("woff2"), url("../fonts/dosis/semibold/Dosis-SemiBold-webfont.woff") format("woff"), url("../fonts/dosis/semibold/Dosis-SemiBold-webfont.ttf") format("truetype"), url("../fonts/dosis/semibold/Dosis-SemiBold-webfont.svg#dosissemibold") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'Socicon';
  src: url("../fonts/socicon/Socicon.eot");
  src: url("../fonts/socicon/Socicon.eot?#iefix") format("embedded-opentype"), url("../fonts/socicon/Socicon.woff") format("woff"), url("../fonts/socicon/Socicon.ttf") format("truetype"), url("../fonts/socicon/Socicon.svg#socicon") format("svg");
  font-weight: normal;
  font-style: normal; }

/* =============================================================================
	@font-names
	========================================================================== */
/* =============================================================================
	@font-classes
	========================================================================== */
.txt-title {
  font-family: "Didot", Times, Baskerville, Georgia, serif;
  text-transform: uppercase; }

/* ==document-elements==========================================================
	@document-elements
	========================================================================== */
body {
  background: #fdfdfd;
  background-attachment: fixed;
  position: relative;
  color: black;
  font-family: "dosisregular", Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  -webkit-text-size-adjust: 100%; }
  @media all and (min-width: 1024px) {
    body {
      line-height: 1.625; } }
  @media all and (max-width: 640px) {
    body.no-scroll {
      overflow: hidden; } }
#page {
  position: relative;
  min-height: 100%; }

a,
a:visited {
  color: #876c3b; }

a:hover {
  color: #fdbe1c; }

input[type="text"].not-empty {
  background: #e2e2e2 !important;
  color: #2b2b2b !important;
  border: 1px solid #2b2b2b !important; }

.page-overlay {
  background: black;
  position: fixed;
  z-index: 100;
  width: 0;
  height: 0;
  top: 0;
  left: 0;
  opacity: 0;
  -webkit-transition: opacity 0.65s ease;
  -o-transition: opacity 0.65s ease;
  transition: opacity 0.65s ease; }
  @media all and (max-width: 640px) {
    .page-overlay.opened {
      width: 100%;
      height: 100%;
      opacity: 0.75; } }
p {
  letter-spacing: 0.65px; }

.vert-align {
  position: relative; }

/* ==styling-elements===========================================================
	@styling-elements
	========================================================================== */
.arrow {
  background: #2b2b2b;
  display: block;
  position: relative;
  width: 2px;
  height: 14px;
  border-radius: 2px; }
  .arrow:before, .arrow:after {
    background: #2b2b2b;
    content: '';
    display: block;
    position: absolute;
    width: 2px;
    height: 8px;
    border-radius: 3px; }
  .arrow:before {
    left: -2px; }
  .arrow:after {
    left: 2px; }
  .arrow.down:before {
    bottom: -2px;
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg); }
  .arrow.down:after {
    bottom: -2px;
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg); }
  .arrow.up:before {
    top: -2px;
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg); }
  .arrow.up:after {
    top: -2px;
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg); }

.dots {
  background: url(../images/box-pattern.png) left bottom repeat-x;
  display: block;
  width: 100%;
  height: 18px; }

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg); } }

@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg); } }

.spin-whirl {
  display: block;
  position: absolute;
  width: 300px;
  height: 300px;
  top: 150px;
  right: 150px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-top-color: #70c989;
  z-index: 1002; }
  .spin-whirl:before, .spin-whirl:after {
    content: "";
    position: absolute;
    border-radius: 50%;
    border: 3px solid transparent; }
  .spin-whirl:before {
    top: 5px;
    right: 5px;
    bottom: 5px;
    left: 5px;
    border-top-color: #2b2b2b; }
  .spin-whirl:after {
    top: 15px;
    right: 15px;
    bottom: 15px;
    left: 15px;
    border-top-color: #70c989; }

.section-title {
  position: relative;
  padding-bottom: 10px;
  font-size: 32px;
  line-height: 38px; }
  .section-title:before {
    background: #876c3b;
    content: '';
    display: block;
    position: absolute;
    width: 42px;
    height: 1px;
    bottom: 0;
    left: 0; }
  @media all and (min-width: 1024px) {
    .section-title {
      font-size: 40px;
      line-height: normal; }
      .section-title:before {
        width: 55px; } }
.tray {
  background: #2b2b2b;
  display: block;
  position: relative;
  width: 24px;
  height: 2px;
  border-radius: 2px; }
  .tray:before, .tray:after {
    background: #2b2b2b;
    content: '';
    display: block;
    position: absolute;
    width: 2px;
    height: 6px;
    bottom: 0;
    border-radius: 3px; }
  .tray:before {
    left: 0; }
  .tray:after {
    right: 0; }

/* ==layout=====================================================================
	@layout
	========================================================================== */
.halves {
  display: grid;
  grid-template-columns: [left] 47% [right] 47%;
  grid-template-rows: auto;
  gap: 0 6%; }
  .halves .left {
    grid-column: left / left;
    grid-row: 1 / 1; }
  .halves .right {
    grid-column: right / right;
    grid-row: 1 / 1; }

/* ==header=====================================================================
	@header
	========================================================================== */
#site-header {
  position: fixed;
  width: 100%;
  height: 60px;
  top: 0;
  left: 0;
  z-index: 102;
  text-align: center; }
  @media all and (min-width: 1024px) {
    #site-header {
      display: none; } }
  #site-header.hidden {
    top: -210px; }
  @media all and (max-width: 1024px) {
    #site-header .main-navigation--mobile.opened {
      pointer-events: initial;
      top: 60px; } }
.site-logo {
  background: url(../images/logo-alt.png) 10px 5px no-repeat;
  background-size: contain;
  display: block;
  position: fixed;
  width: 110px;
  height: 80px;
  top: -10px;
  left: -5px;
  z-index: 103; }
  .site-logo .logo-txt-the,
  .site-logo .logo-txt-unt {
    display: none; }
  @media all and (min-width: 1024px) {
    .site-logo {
      background-position: 10px 15px;
      background-size: contain;
      width: 150px;
      height: 150px;
      top: 75px;
      left: 50%;
      margin: 0 0 0 -75px;
      transform: translateY(-50%); }
      .site-logo .logo-txt-the,
      .site-logo .logo-txt-unt {
        display: block;
        position: absolute;
        top: 60px;
        color: #70c989;
        font: normal 30px / 30px "Didot", Times, Baskerville, Georgia, serif;
        text-transform: uppercase; }
      .site-logo .logo-txt-the {
        left: -90px; }
      .site-logo .logo-txt-unt {
        right: -302px; }
      .site-logo:before, .site-logo:after {
        background: #bcbcbc;
        content: '';
        display: block;
        position: absolute;
        width: 1px;
        height: 140px;
        -webkit-transform: rotate(-30deg);
        -o-transform: rotate(-30deg);
        transform: rotate(-30deg); }
      .site-logo:before {
        top: -50px;
        left: 139px; }
      .site-logo:after {
        top: 72px;
        left: 44px; } }
  .site-logo .the-logo {
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0;
    border: none;
    background: transparent; }

.header-bg {
  background: #282028;
  display: block;
  position: fixed;
  width: 100%;
  height: 60px;
  top: 0;
  left: 0;
  -webkit-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease; }
  @media all and (min-width: 1024px) {
    .header-bg {
      display: none; } }
.main-navigation {
  background: #fff;
  background: rgba(255, 255, 255, 0.99);
  position: relative;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15);
  width: 100%;
  top: -250px;
  left: 0;
  text-align: center;
  -webkit-transition: top 0.5s ease;
  -o-transition: top 0.5s ease;
  transition: top 0.5s ease; }
  @media all and (min-width: 1024px) {
    .main-navigation {
      z-index: 10;
      top: 0;
      -webkit-transition: none;
      -o-transition: none;
      transition: none; } }
  .main-navigation--desktop {
    display: none; }
    @media all and (min-width: 1024px) {
      .main-navigation--desktop {
        display: block;
        position: sticky;
        top: 0; }
        .main-navigation--desktop ul {
          flex-flow: row nowrap;
          width: 704px;
          padding: 15px; } }
  .main-navigation--mobile ul {
    flex-flow: row wrap;
    padding: 15px 60px 15px 15px; }
    .main-navigation--mobile ul li.gap {
      display: none; }
  .main-navigation--mobile .page-link__social {
    top: 26px;
    right: 14px; }
  .main-navigation--mobile .page-link__contact {
    top: 86px; }
  .main-navigation ul {
    display: flex;
    background: url(../images/diamond-dots.png) center no-repeat;
    margin: 0 auto; }
    @media all and (min-width: 1024px) {
      .main-navigation ul {
        background: none;
        padding: 0; } }
    .main-navigation ul li {
      display: block;
      width: 50%; }
      @media all and (min-width: 1024px) {
        .main-navigation ul li {
          background: url(../images/diamond-dots.png) 50px center no-repeat;
          width: auto;
          padding-left: 105px; }
          .main-navigation ul li:first-child {
            background: none;
            padding-left: 0; }
          .main-navigation ul li.gap {
            width: 166px;
            background: none; }
          .main-navigation ul li.left-of-logo {
            padding-right: 30px; }
          .main-navigation ul li.right-of-logo {
            background: none;
            padding-left: 30px; } }
      .main-navigation ul li a {
        display: block;
        position: relative;
        padding: 25px 0 23px;
        color: #876c3b;
        font: normal 14px/12px "Didot", Times, Baskerville, Georgia, serif;
        text-transform: uppercase; }
        .main-navigation ul li a:before {
          background: #70c989;
          content: '';
          display: block;
          position: absolute;
          width: 0;
          height: 1px;
          bottom: 14px;
          left: 0;
          -webkit-transition: all 0.3s ease;
          -o-transition: all 0.3s ease;
          transition: all 0.3s ease; }
        @media all and (min-width: 1024px) {
          .main-navigation ul li a:hover, .main-navigation ul li a.active {
            color: #70c989; }
            .main-navigation ul li a:hover:before, .main-navigation ul li a.active:before {
              width: 100%; } }
  .main-navigation .social-links {
    padding: 15px 0;
    border: 1px solid #e5e2e2;
    border-width: 1px 0; }

.page-link {
  display: block;
  position: absolute;
  width: 32px;
  height: 32px;
  top: 14px;
  padding: 0;
  border: none;
  background-color: transparent;
  background-repeat: none;
  background-size: contain; }
  .page-link::before {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: 0;
    background-repeat: none;
    background-size: contain;
    transition: opacity 0.3s ease-in-out; }
  .page-link:hover::before {
    opacity: 1; }
  .page-link__social {
    right: 60px;
    background-image: url(../images/icon__social--blur.png); }
    .page-link__social::before {
      background-image: url(../images/icon__social--focus.png); }
  .page-link__contact {
    right: 14px;
    background-image: url(../images/icon__contact--blur.png); }
    .page-link__contact::before {
      background-image: url(../images/icon__contact--focus.png); }

.nav-toggle {
  display: block;
  position: absolute;
  width: 35px;
  height: 31px;
  top: 15px;
  right: 20px;
  z-index: 102;
  border: none;
  padding: 0;
  background: none; }
  @media all and (min-width: 1024px) {
    .nav-toggle {
      display: none; } }
  .nav-toggle span {
    background: #fff;
    content: '';
    cursor: pointer;
    display: block;
    position: absolute;
    width: 35px;
    height: 3px;
    top: 14px;
    border-radius: 1px;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease; }
    .nav-toggle span:before, .nav-toggle span:after {
      background: #fff;
      content: '';
      cursor: pointer;
      display: block;
      position: absolute;
      width: 35px;
      height: 3px;
      border-radius: 1px;
      -webkit-transform: rotate(0deg);
      -o-transform: rotate(0deg);
      transform: rotate(0deg);
      -webkit-transition: all 0.3s ease;
      -o-transition: all 0.3s ease;
      transition: all 0.3s ease; }
    .nav-toggle span:before {
      top: -8px; }
    .nav-toggle span:after {
      bottom: -8px; }
    .nav-toggle span.opened {
      background: transparent; }
      .nav-toggle span.opened:before, .nav-toggle span.opened:after {
        top: 0; }
      .nav-toggle span.opened:before {
        -webkit-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg); }
      .nav-toggle span.opened:after {
        -webkit-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg); }

/* ==footer=====================================================================
	@footer
	========================================================================== */
#site-footer {
  background: #282028;
  padding: 20px;
  color: #fff;
  text-align: center; }

.logo-words {
  background: url(../images/logo-txt.png) center no-repeat;
  background-size: cover;
  display: block;
  width: 194px;
  height: 30px;
  margin: 5px auto 0; }
  @media all and (min-width: 1024px) {
    .logo-words {
      width: 250px;
      height: 40px; } }
/* ==hero=======================================================================
	@hero
	========================================================================== */
#hero {
  background: url(../images/bg-home-1.jpg) top center no-repeat;
  background-size: cover;
  position: relative;
  height: 100vh; }
  @media all and (min-width: 1024px) {
    #hero {
      background-attachment: fixed;
      height: calc(100vh - 60px); } }
.hero-social-image {
  display: block;
  height: 0;
  width: 0;
  visibility: hidden; }

.hero-text {
  background: rgba(0, 0, 0, 0.75);
  position: absolute;
  width: auto;
  min-width: 350px;
  top: 50%;
  left: 50%;
  margin: 50px 0 0;
  padding: 20px 10px 15px;
  color: #12762e;
  font: normal 60px/50px "Didot", Times, Baskerville, Georgia, serif;
  text-align: center;
  text-transform: uppercase;
  transform: translateX(-50%); }
  @media all and (min-width: 640px) {
    .hero-text {
      min-width: 370px;
      padding: 20px 20px 15px; } }
  .hero-text span {
    display: block;
    width: 0;
    height: 0; }

.scroll-down {
  background: none;
  display: block;
  position: absolute;
  width: 50px;
  height: 50px;
  bottom: 20px;
  left: 50%;
  margin-left: -25px;
  border: 2px solid #876c3b;
  border-radius: 25px; }
  .scroll-down:before, .scroll-down:after {
    background: white;
    content: '';
    display: block;
    position: absolute;
    width: 4px;
    height: 16px;
    top: 16px; }
  .scroll-down:before {
    left: 17px;
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg); }
  .scroll-down:after {
    left: 26px;
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg); }
  @media all and (min-width: 1024px) {
    .scroll-down {
      width: 70px;
      height: 70px;
      bottom: 100px;
      margin-left: -35px;
      border-radius: 35px; }
      .scroll-down:before, .scroll-down:after {
        width: 6px;
        height: 24px;
        top: 23px; }
      .scroll-down:before {
        left: 24px; }
      .scroll-down:after {
        left: 37px; } }
/* ==bio========================================================================
	@bio
	========================================================================== */
#biography {
  background: url(../images/box-pattern.png) left bottom repeat-x;
  position: relative;
  padding: 60px 0;
  margin: auto;
  overflow: hidden; }
  @media all and (min-width: 1024px) {
    #biography {
      padding: 120px 0; } }
.bio-content {
  max-width: 1200px;
  margin: auto; }

.vinyl {
  background: url(../images/white-vinyl.png) center no-repeat;
  background-size: cover;
  display: block;
  position: absolute;
  width: 600px;
  height: 600px;
  top: 50%;
  left: 100%;
  z-index: -1;
  margin: -300px 0 0 -300px;
  opacity: 0.25; }
  @media all and (min-width: 1024px) {
    .vinyl {
      opacity: 0.65; } }
.section-hdr {
  font: italic 310%/62px TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif;
  text-align: center; }
  @media all and (min-width: 1024px) {
    .section-hdr {
      font-size: 72px; } }
  .section-hdr .dots {
    background: url(../images/diamond-dots.png) center no-repeat;
    display: inline-block;
    position: relative;
    width: 5px;
    height: 5px; }

.open-lines, .bio-bot .bio-outro p, .bio-intro p {
  position: relative;
  padding-left: 20px;
  margin-bottom: 20px; }
  @media all and (min-width: 1024px) {
    .open-lines, .bio-bot .bio-outro p, .bio-intro p {
      padding-left: 12px;
      margin-bottom: 15px; } }
  .open-lines:before, .bio-bot .bio-outro p:before, .bio-intro p:before {
    content: '...';
    position: absolute;
    left: 0; }

.bio-intro {
  display: grid;
  grid-template-columns: [header] 120px [bio] auto;
  grid-template-rows: auto auto auto auto;
  gap: 0 20px;
  margin: 20px 0 40px;
  padding: 0 20px; }
  @media all and (min-width: 1024px) {
    .bio-intro {
      grid-template-columns: [header] 35% [bio] 65%;
      margin: 80px 0 60px;
      padding: 0 10%; } }
  .bio-intro .bio-header {
    grid-column: header / header;
    grid-row: 1 / 1; }
  .bio-intro p:nth-of-type(1) {
    grid-column: bio / bio;
    grid-row: 1 / 1;
    margin-top: 15px; }
    @media all and (min-width: 1024px) {
      .bio-intro p:nth-of-type(1) {
        margin-top: 25px; } }
  .bio-intro p:nth-of-type(2) {
    grid-column: 1 / 3;
    grid-row: 2 / 3; }
    @media all and (min-width: 1024px) {
      .bio-intro p:nth-of-type(2) {
        grid-column: bio / bio;
        grid-row: 2 / 3; } }
  .bio-intro p:nth-of-type(3) {
    grid-column: 1 / 3;
    grid-row: 3 / 4; }
    @media all and (min-width: 1024px) {
      .bio-intro p:nth-of-type(3) {
        grid-column: bio / bio;
        grid-row: 3 / 4; } }
  .bio-intro p:nth-of-type(4) {
    grid-column: 1 / 3;
    grid-row: 4 / 5; }
    @media all and (min-width: 1024px) {
      .bio-intro p:nth-of-type(4) {
        grid-column: bio / bio;
        grid-row: 4 / 5; } }
.bio-more {
  height: auto;
  max-height: 0;
  overflow: hidden;
  -webkit-transition: height 1.75s ease;
  -o-transition: height 1.75s ease;
  transition: height 1.75s ease; }
  @media all and (min-width: 1024px) {
    .bio-more {
      max-height: none; } }
  .bio-more.expanded {
    max-height: none; }

.btn-bio-more {
  background: #2b2b2b;
  display: block;
  width: 162px;
  height: 52px;
  border-radius: 26px;
  margin: auto;
  color: #70c989;
  text-align: center; }
  .btn-bio-more:before, .btn-bio-more:after {
    background: #fdfdfd;
    position: relative;
    content: '';
    display: inline-block;
    width: 32px;
    height: 32px;
    top: 10px;
    border-radius: 16px; }
  .btn-bio-more:before {
    margin-right: 7px; }
  .btn-bio-more:after {
    margin-left: 7px; }
  @media all and (min-width: 1024px) {
    .btn-bio-more {
      display: none; } }
.bio-main {
  padding: 0 20px;
  margin-bottom: 40px; }
  @media all and (min-width: 1024px) {
    .bio-main {
      padding: 0 10%;
      margin-bottom: 60px; } }
  .bio-main .bio-pic {
    float: left;
    width: 480px;
    height: 320px;
    margin: 5px 40px 40px -13%;
    overflow: hidden; }
    .bio-main .bio-pic img {
      width: 100%;
      height: auto; }
  .bio-main p {
    margin-bottom: 15px; }

.bio-bot .bio-outro {
  position: relative;
  padding: 0 20px; }
  @media all and (min-width: 1024px) {
    .bio-bot .bio-outro {
      float: left;
      width: 50%;
      padding: 0 0 0 10%; } }
.bio-bot .right {
  width: 100%;
  font-size: 28px;
  line-height: normal; }
  @media all and (min-width: 1024px) {
    .bio-bot .right {
      position: absolute;
      width: 360px;
      bottom: 0;
      left: 115%;
      font-size: 36px; } }
/* ==events=====================================================================
	@events
	========================================================================== */
#events {
  background: #443b37;
  position: relative;
  padding: 40px 0;
  overflow: hidden; }
  @media all and (min-width: 1024px) {
    #events {
      padding: 75px 0; } }
  #events .section-content {
    background: url(../images/bg-events.jpg) center no-repeat;
    background-size: cover;
    position: relative;
    min-height: 100vh;
    overflow: hidden; }
  #events .dots {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 4; }

.event-hdr {
  padding: 50px 20px 0; }
  @media all and (min-width: 1024px) {
    .event-hdr {
      position: absolute;
      width: 35%;
      bottom: 240px;
      left: 30%;
      padding: 0 20px; } }
  .event-hdr .section-title {
    background: rgba(255, 255, 255, 0.9);
    width: 186px;
    margin: 0 auto 60px;
    color: #443b37; }
  .event-hdr .events-blurb {
    font-size: 18px;
    line-height: 32px;
    text-align: center; }

.close-events,
.far-events {
  background: #443b37;
  background: rgba(68, 59, 55, 0.9);
  width: 80%;
  margin-left: 10%;
  padding: 30px 0; }
  @media all and (min-width: 1024px) {
    .close-events,
    .far-events {
      position: absolute;
      width: 28%;
      min-width: 300px;
      top: 100%;
      margin-left: 0; } }
  .close-events .monthly-calendar,
  .far-events .monthly-calendar {
    position: relative;
    min-height: 125px;
    left: 0;
    -webkit-transition: all 750ms ease;
    -o-transition: all 750ms ease;
    transition: all 750ms ease; }
    @media all and (min-width: 1024px) {
      .close-events .monthly-calendar,
      .far-events .monthly-calendar {
        position: relative;
        min-height: inherit; } }
    .close-events .monthly-calendar .monthly-events,
    .far-events .monthly-calendar .monthly-events {
      padding-bottom: 11px;
      margin-bottom: 30px; }
      .close-events .monthly-calendar .monthly-events:before,
      .far-events .monthly-calendar .monthly-events:before {
        background: #876c3b;
        content: '';
        display: block;
        position: absolute;
        height: 1px;
        right: 20px;
        bottom: 0;
        left: 20px; }
      .close-events .monthly-calendar .monthly-events:last-child,
      .far-events .monthly-calendar .monthly-events:last-child {
        margin-bottom: 0; }
      .close-events .monthly-calendar .monthly-events .events-wrapper,
      .far-events .monthly-calendar .monthly-events .events-wrapper {
        background: #f1f1f1;
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        right: 100%;
        z-index: 4;
        padding-top: 60px;
        opacity: 0;
        -webkit-transition: all 500ms ease;
        -o-transition: all 500ms ease;
        transition: all 500ms ease;
        text-align: left; }
        @media all and (min-width: 1024px) {
          .close-events .monthly-calendar .monthly-events .events-wrapper,
          .far-events .monthly-calendar .monthly-events .events-wrapper {
            position: absolute;
            top: -48px;
            height: -webkit-calc(100% + 96px);
            height: calc(100% + 96px);
            padding-top: 0; } }
        .close-events .monthly-calendar .monthly-events .events-wrapper.open,
        .far-events .monthly-calendar .monthly-events .events-wrapper.open {
          right: 0;
          opacity: 1; }
        .close-events .monthly-calendar .monthly-events .events-wrapper .events-header,
        .far-events .monthly-calendar .monthly-events .events-wrapper .events-header {
          background: #443b37;
          position: relative;
          padding: 10px 10px 15px 20px;
          border-bottom: 1px solid #876c3b; }
          .close-events .monthly-calendar .monthly-events .events-wrapper .events-header h4,
          .far-events .monthly-calendar .monthly-events .events-wrapper .events-header h4 {
            color: #876c3b;
            font: italic 32px/30px TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif; }
          .close-events .monthly-calendar .monthly-events .events-wrapper .events-header .events-close,
          .far-events .monthly-calendar .monthly-events .events-wrapper .events-header .events-close {
            display: block;
            position: absolute;
            width: 32px;
            height: 32px;
            top: 11px;
            right: 4px;
            padding: 0;
            border: 0;
            background: none; }
            .close-events .monthly-calendar .monthly-events .events-wrapper .events-header .events-close:before, .close-events .monthly-calendar .monthly-events .events-wrapper .events-header .events-close:after,
            .far-events .monthly-calendar .monthly-events .events-wrapper .events-header .events-close:before,
            .far-events .monthly-calendar .monthly-events .events-wrapper .events-header .events-close:after {
              background: white;
              content: '';
              display: block;
              position: absolute;
              width: 4px;
              height: 20px;
              top: 7px;
              left: 15px;
              transition: background-color 0.3s ease; }
            .close-events .monthly-calendar .monthly-events .events-wrapper .events-header .events-close:before,
            .far-events .monthly-calendar .monthly-events .events-wrapper .events-header .events-close:before {
              -webkit-transform: rotate(-45deg);
              -o-transform: rotate(-45deg);
              transform: rotate(-45deg); }
            .close-events .monthly-calendar .monthly-events .events-wrapper .events-header .events-close:after,
            .far-events .monthly-calendar .monthly-events .events-wrapper .events-header .events-close:after {
              -webkit-transform: rotate(45deg);
              -o-transform: rotate(45deg);
              transform: rotate(45deg); }
            .close-events .monthly-calendar .monthly-events .events-wrapper .events-header .events-close:hover:before, .close-events .monthly-calendar .monthly-events .events-wrapper .events-header .events-close:hover:after,
            .far-events .monthly-calendar .monthly-events .events-wrapper .events-header .events-close:hover:before,
            .far-events .monthly-calendar .monthly-events .events-wrapper .events-header .events-close:hover:after {
              background-color: #e21f48; }
        .close-events .monthly-calendar .monthly-events .events-wrapper .no-events,
        .far-events .monthly-calendar .monthly-events .events-wrapper .no-events {
          display: flex;
          flex-flow: column nowrap;
          justify-content: center;
          height: -webkit-calc(100% - 60px);
          height: calc(100% - 60px);
          padding: 0 20px;
          font-size: 16px;
          line-height: 26px;
          text-align: center; }
        .close-events .monthly-calendar .monthly-events .events-wrapper .events-list.filled,
        .far-events .monthly-calendar .monthly-events .events-wrapper .events-list.filled {
          height: -webkit-calc(100% - 60px);
          height: calc(100% - 60px);
          overflow-x: hidden;
          overflow-y: scroll; }
  .close-events h3,
  .far-events h3 {
    cursor: pointer;
    position: relative;
    padding-left: 15px;
    margin-bottom: 15px;
    color: #876c3b;
    font: italic 32px/30px TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif;
    -webkit-transition: color 350ms ease;
    -o-transition: color 350ms ease;
    transition: color 350ms ease; }
    .close-events h3:before,
    .far-events h3:before {
      background: #70c989;
      content: '';
      display: block;
      position: absolute;
      width: 1px;
      height: 40px;
      top: 16px;
      left: 3px;
      -webkit-transform: rotate(-40deg);
      -o-transform: rotate(-40deg);
      transform: rotate(-40deg); }
    .close-events h3:hover, .close-events h3.active,
    .far-events h3:hover,
    .far-events h3.active {
      color: #70c989; }
  .close-events .single-event,
  .far-events .single-event {
    display: flex;
    flex-flow: row wrap;
    position: relative;
    width: 100%;
    min-height: 64px;
    padding: 10px 36px 7px 5px;
    border-bottom: 1px solid #e3e3e3;
    color: #2b2b2b;
    -webkit-transition: background 500ms ease;
    -o-transition: background 500ms ease;
    transition: background 500ms ease; }
    .close-events .single-event.no-events,
    .far-events .single-event.no-events {
      padding: 0 35px; }
    .close-events .single-event.clickable:hover .date-wrap .date,
    .far-events .single-event.clickable:hover .date-wrap .date {
      color: #2b2b2b; }
    .close-events .single-event.clickable:hover .date-wrap .day,
    .far-events .single-event.clickable:hover .date-wrap .day {
      color: #2b2b2b; }
    .close-events .single-event.events-scratch .date-wrap:before,
    .far-events .single-event.events-scratch .date-wrap:before {
      background: #fdbe1c;
      content: '';
      display: block;
      position: absolute;
      width: 5px;
      height: 100%;
      top: 0;
      left: -5px; }
    .close-events .single-event.events-scratch.clickable:hover,
    .far-events .single-event.events-scratch.clickable:hover {
      background: #fdbe1c; }
    .close-events .single-event.events-self .date-wrap:before,
    .far-events .single-event.events-self .date-wrap:before {
      background: #70c989;
      content: '';
      display: block;
      position: absolute;
      width: 5px;
      height: 100%;
      top: 0;
      left: -5px; }
    .close-events .single-event.events-self.clickable:hover,
    .far-events .single-event.events-self.clickable:hover {
      background: #70c989; }
    .close-events .single-event .date-wrap,
    .far-events .single-event .date-wrap {
      display: block;
      position: relative;
      width: 50px;
      height: 47px;
      padding: 0 10px; }
      .close-events .single-event .date-wrap .date,
      .far-events .single-event .date-wrap .date {
        position: absolute;
        top: -6px;
        left: 10px;
        color: #70c989;
        font-size: 24px;
        -webkit-transition: color 500ms ease;
        -o-transition: color 500ms ease;
        transition: color 500ms ease; }
      .close-events .single-event .date-wrap .day,
      .far-events .single-event .date-wrap .day {
        position: absolute;
        top: 25px;
        left: 10px;
        color: #876c3b;
        -webkit-transition: color 500ms ease;
        -o-transition: color 500ms ease;
        transition: color 500ms ease; }
    .close-events .single-event .title-wrap,
    .far-events .single-event .title-wrap {
      width: calc(100% - 50px);
      height: 47px;
      padding-left: 10px; }
      .close-events .single-event .title-wrap .title,
      .far-events .single-event .title-wrap .title {
        display: block; }
    .close-events .single-event .locale,
    .far-events .single-event .locale {
      display: block;
      color: #2b2b2b;
      text-align: left; }
      .close-events .single-event .locale .map-icon,
      .far-events .single-event .locale .map-icon {
        background: transparent;
        content: '';
        display: inline-block;
        position: absolute;
        width: 20px;
        height: 20px;
        top: 20px;
        right: 10px;
        margin-left: 5px;
        border: 6px solid #f33;
        border-radius: 14px 14px 14px 0;
        -webkit-box-shadow: -1px 1px 2px rgba(0, 0, 0, 0.2);
        -moz-box-shadow: -1px 1px 2px rgba(0, 0, 0, 0.2);
        box-shadow: -1px 1px 2px rgba(0, 0, 0, 0.2);
        -webkit-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg);
        -webkit-transition: border-color 500ms ease;
        -o-transition: border-color 500ms ease;
        transition: border-color 500ms ease; }
    .close-events .single-event .end-date,
    .far-events .single-event .end-date {
      display: block;
      margin-top: 10px; }

.close-events {
  background: white;
  background: rgba(255, 255, 255, 0.9); }
  @media all and (min-width: 1024px) {
    .close-events {
      top: 70%;
      left: 3%; } }
  .close-events p {
    padding: 0 20px;
    margin: 0;
    text-align: center; }
    .close-events p span {
      background-color: #2b2b2b;
      color: white;
      padding: 1px 4px; }

.far-events {
  position: relative;
  text-align: right; }
  .far-events .monthly-prev,
  .far-events .monthly-next {
    background: #443b37;
    background: rgba(68, 59, 55, 0.83);
    display: block;
    position: absolute;
    width: 30px;
    height: 50px;
    top: 50%;
    margin-top: -25px; }
    .far-events .monthly-prev:before, .far-events .monthly-prev:after,
    .far-events .monthly-next:before,
    .far-events .monthly-next:after {
      background: #70c989;
      content: '';
      display: block;
      position: absolute;
      width: 1px;
      height: 16px; }
    .far-events .monthly-prev:before,
    .far-events .monthly-next:before {
      -webkit-transform: rotate(40deg);
      -o-transform: rotate(40deg);
      transform: rotate(40deg); }
    .far-events .monthly-prev:after,
    .far-events .monthly-next:after {
      -webkit-transform: rotate(-40deg);
      -o-transform: rotate(-40deg);
      transform: rotate(-40deg); }
  .far-events .monthly-prev {
    display: none;
    left: -13%; }
    .far-events .monthly-prev:before, .far-events .monthly-prev:after {
      right: 15px; }
    .far-events .monthly-prev:before {
      top: 11px; }
    .far-events .monthly-prev:after {
      top: 23px; }
  .far-events .monthly-next {
    right: -13%; }
    .far-events .monthly-next:before, .far-events .monthly-next:after {
      left: 15px; }
    .far-events .monthly-next:before {
      top: 23px; }
    .far-events .monthly-next:after {
      top: 11px; }
  @media all and (min-width: 1024px) {
    .far-events {
      position: absolute;
      top: 50%;
      right: 3%;
      padding: 48px 0;
      transform: translateY(-50%); }
      .far-events .monthly-prev,
      .far-events .monthly-next {
        display: none; } }
  .far-events h3 {
    padding: 0 15px 0 0; }
    .far-events h3:before {
      left: initial;
      right: 3px;
      -webkit-transform: rotate(40deg);
      -o-transform: rotate(40deg);
      transform: rotate(40deg); }

.alt-event-positioning p {
  padding: 0 65px 0 20px; }
  .alt-event-positioning p .date {
    left: initial;
    right: 25px; }
  .alt-event-positioning p .day {
    left: initial;
    right: 25px; }

/* ==gallery====================================================================
	@gallery
	========================================================================== */
#gallery {
  position: relative;
  padding: 60px 0; }
  @media all and (min-width: 1024px) {
    #gallery {
      min-height: 100vh;
      padding: 160px 0 120px; } }
  #gallery .event-hdr {
    width: 100%;
    top: 60px;
    bottom: initial;
    left: 0;
    z-index: 9;
    padding: 5px 20px;
    background: white;
    background: rgba(255, 255, 255, 0.9); }
    @media all and (min-width: 1024px) {
      #gallery .event-hdr {
        position: sticky;
        padding: 5px 60px; } }
    #gallery .event-hdr .hdr-inside {
      display: flex;
      flex-flow: column nowrap;
      max-width: 716px;
      margin: auto; }
      @media all and (min-width: 1024px) {
        #gallery .event-hdr .hdr-inside {
          flex-direction: row;
          justify-content: space-between; } }
    #gallery .event-hdr .section-title {
      width: 180px;
      height: 45px;
      margin: 0 auto 20px;
      background: none; }
      @media all and (min-width: 1024px) {
        #gallery .event-hdr .section-title {
          width: auto;
          height: 60px;
          margin: 0; } }
    #gallery .event-hdr .more {
      position: relative;
      font-size: 18px;
      text-align: center; }
      @media all and (min-width: 1024px) {
        #gallery .event-hdr .more {
          top: 20px;
          text-align: left; } }
    #gallery .event-hdr.gallery-open {
      position: fixed;
      top: 0;
      z-index: 9; }
      @media all and (min-width: 1024px) {
        #gallery .event-hdr.gallery-open {
          z-index: 11; } }
  #gallery .btn-close {
    background: white;
    background: rgba(255, 255, 255, 0.9);
    display: block;
    position: absolute;
    width: 32px;
    height: 32px;
    top: 0;
    right: 0;
    z-index: 13;
    padding: 0;
    border: none; }
    #gallery .btn-close:before, #gallery .btn-close:after {
      background: #2b2b2b;
      content: '';
      display: block;
      position: absolute;
      width: 2px;
      height: 16px;
      top: 8px;
      right: 15px; }
    #gallery .btn-close:before {
      -webkit-transform: rotate(45deg);
      -o-transform: rotate(45deg);
      transform: rotate(45deg); }
    #gallery .btn-close:after {
      -webkit-transform: rotate(-45deg);
      -o-transform: rotate(-45deg);
      transform: rotate(-45deg); }
    @media all and (min-width: 1024px) {
      #gallery .btn-close {
        width: 70px;
        height: 70px;
        top: 70px; }
        #gallery .btn-close:before, #gallery .btn-close:after {
          width: 2px;
          height: 32px;
          top: 21px;
          right: 35px; } }
.acronym {
  display: flex;
  flex-flow: row nowrap;
  padding: 0; }
  @media all and (min-width: 1024px) {
    .acronym {
      padding: 20px; } }
.acronym-spot {
  flex-shrink: 0;
  flex-grow: 0;
  width: 25%;
  position: relative;
  padding: 10% 0;
  overflow: hidden;
  text-align: center; }
  @media all and (min-width: 1024px) {
    .acronym-spot {
      cursor: pointer; } }
  .acronym-spot span {
    display: block; }
    .acronym-spot span.letter {
      display: inline-block;
      position: relative;
      font-family: TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif;
      font-size: 60px;
      line-height: 42px;
      text-align: center; }
      .acronym-spot span.letter img {
        width: 100%;
        height: auto; }
      .acronym-spot span.letter:before, .acronym-spot span.letter:after {
        background: #2b2b2b;
        content: '';
        display: block;
        position: absolute;
        border-radius: 2px;
        -webkit-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg); }
      .acronym-spot span.letter:before {
        width: 6px;
        height: 6px;
        bottom: 15px;
        right: 5px;
        z-index: 2;
        border: 2px solid #ffff00; }
      .acronym-spot span.letter:after {
        background: #00ff00;
        width: 12px;
        height: 12px;
        bottom: 13px;
        right: 3px;
        z-index: 1;
        border: 1px solid #2b2b2b; }
      @media all and (min-width: 1024px) {
        .acronym-spot span.letter {
          font-size: 102px;
          line-height: 70px; }
          .acronym-spot span.letter:before {
            width: 10px;
            height: 10px;
            bottom: 17px;
            right: -6px; }
          .acronym-spot span.letter:after {
            width: 16px;
            height: 16px;
            bottom: 15px;
            right: -8px; }
          .acronym-spot span.letter.letter-e:before {
            right: 2px; }
          .acronym-spot span.letter.letter-e:after {
            right: 0; }
          .acronym-spot span.letter img {
            width: initial;
            height: initial; } }
    .acronym-spot span.meaning {
      margin-top: 5px;
      font-size: 17px; }
      @media all and (min-width: 1024px) {
        .acronym-spot span.meaning {
          margin-top: 25px;
          font-size: 20px; } }
    .acronym-spot span.acronym-img {
      position: absolute;
      background-clip: content-box;
      background-position: center;
      background-size: cover;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      z-index: 3;
      opacity: 0;
      -webkit-transform: scale(0.65, 0.65);
      -o-transform: scale(0.65, 0.65);
      transform: scale(0.65, 0.65);
      -webkit-transition: all 0.65s ease;
      -o-transition: all 0.65s ease;
      transition: all 0.65s ease; }
  @media all and (min-width: 1024px) {
    .acronym-spot:hover span.acronym-img {
      opacity: 1;
      -webkit-transform: scale(1, 1);
      -o-transform: scale(1, 1);
      transform: scale(1, 1); } }
.divides-frame {
  width: 100%;
  padding-bottom: 20px;
  overflow: scroll; }
  .divides-frame .the-divides {
    display: flex;
    flex-flow: row nowrap;
    position: relative;
    width: 1232px;
    margin: 0 2px; }
    @media all and (min-width: 1024px) {
      .divides-frame .the-divides {
        display: block;
        width: initial;
        margin: 0; } }
    .divides-frame .the-divides-box {
      display: flex;
      flex-flow: row wrap;
      width: 308px;
      height: 308px; }
      @media all and (min-width: 1024px) {
        .divides-frame .the-divides-box {
          width: auto;
          height: auto;
          margin: 20px 20px 0;
          overflow: hidden;
          border-radius: 5px;
          text-align: center; } }
      .divides-frame .the-divides-box .img-wrap {
        background-position: center;
        background-size: cover;
        cursor: pointer;
        display: block;
        position: relative;
        margin: 2px; }
        @media all and (min-width: 1024px) {
          .divides-frame .the-divides-box .img-wrap {
            height: 0;
            margin: 0;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box; }
            .divides-frame .the-divides-box .img-wrap:before {
              background: white;
              content: '';
              display: block;
              position: absolute;
              width: 20px;
              height: 100%;
              top: 0;
              left: -10px;
              z-index: 3; }
            .divides-frame .the-divides-box .img-wrap:first-child:before {
              display: none; }
            .divides-frame .the-divides-box .img-wrap:after {
              background: black;
              background: rgba(0, 0, 0, 0.8);
              content: '';
              display: block;
              position: absolute;
              width: 100%;
              height: 100%;
              z-index: 1;
              opacity: 0;
              -webkit-transition: opacity 450ms ease;
              -o-transition: opacity 450ms ease;
              transition: opacity 450ms ease; }
            .divides-frame .the-divides-box .img-wrap .mag-glass {
              display: block;
              position: absolute;
              width: 14px;
              height: 14px;
              top: 50%;
              left: 50%;
              z-index: 2;
              border: 3px solid white;
              border-radius: 7px;
              margin: -7px 0 0 -7px;
              opacity: 0;
              -webkit-transition: opacity 450ms ease;
              -o-transition: opacity 450ms ease;
              transition: opacity 450ms ease; }
              .divides-frame .the-divides-box .img-wrap .mag-glass:before {
                background: white;
                content: '';
                display: block;
                position: absolute;
                width: 3px;
                height: 7px;
                bottom: -6px;
                right: -4px;
                border-radius: 4px;
                -webkit-transform: rotate(-45deg);
                -o-transform: rotate(-45deg);
                transform: rotate(-45deg); } }
        .divides-frame .the-divides-box .img-wrap img {
          display: none;
          position: absolute;
          width: 100%;
          height: auto;
          top: 0;
          left: 0; }
        .divides-frame .the-divides-box .img-wrap p {
          margin-top: 6px;
          font-family: "dosissemibold", Arial, sans-serif;
          font-size: 14px;
          text-transform: uppercase; }
        .divides-frame .the-divides-box .img-wrap:hover .mag-glass {
          opacity: 1; }
        .divides-frame .the-divides-box .img-wrap:hover:after {
          opacity: 1; }
      .divides-frame .the-divides-box.fourth .img-wrap {
        width: 150px;
        height: 150px; }
        @media all and (min-width: 1024px) {
          .divides-frame .the-divides-box.fourth .img-wrap {
            float: left;
            width: 25%;
            height: 0px;
            padding-bottom: 25%; } }
      .divides-frame .the-divides-box.third .img-wrap {
        width: 150px;
        height: 120px; }
        .divides-frame .the-divides-box.third .img-wrap:first-child {
          width: 304px;
          height: 180px; }
        @media all and (min-width: 1024px) {
          .divides-frame .the-divides-box.third .img-wrap {
            padding-bottom: 25%; }
            .divides-frame .the-divides-box.third .img-wrap:first-child, .divides-frame .the-divides-box.third .img-wrap:nth-child(3) {
              width: 33%; }
            .divides-frame .the-divides-box.third .img-wrap:nth-child(2) {
              width: 34%; } }
      .divides-frame .the-divides-box.half .img-wrap {
        width: 304px;
        height: 150px; }
        @media all and (min-width: 1024px) {
          .divides-frame .the-divides-box.half .img-wrap {
            width: 50%;
            height: 0;
            padding-bottom: 34%; } }
      .divides-frame .the-divides-box.whole .img-wrap {
        width: 304px;
        height: 304px; }
        @media all and (min-width: 1024px) {
          .divides-frame .the-divides-box.whole .img-wrap {
            width: 100%;
            height: 0;
            padding-bottom: 34%; } }
.divides-scroll {
  margin-top: 15px;
  text-align: center;
  text-transform: uppercase; }
  .divides-scroll:before {
    content: '\21E0';
    display: inline-block;
    margin-right: 7px; }
  .divides-scroll:after {
    content: '\21E2';
    display: inline-block;
    margin-left: 5px; }
  @media all and (min-width: 1024px) {
    .divides-scroll {
      display: none; } }
.slide-1 {
  background-image: url("../images/gallery/01.jpg"); }

.slide-2 {
  background-image: url("../images/gallery/02.jpg"); }

.slide-3 {
  background-image: url("../images/gallery/03.jpg"); }

.slide-4 {
  background-image: url("../images/gallery/04.jpg"); }

.slide-5 {
  background-image: url("../images/gallery/05.jpg"); }

.slide-6 {
  background-image: url("../images/gallery/06.jpg"); }

.slide-7 {
  background-image: url("../images/gallery/07.jpg"); }

.slide-8 {
  background-image: url("../images/gallery/08.jpg"); }

.slide-9 {
  background-image: url("../images/gallery/09.jpg"); }

.slide-10 {
  background-image: url("../images/gallery/10.jpg"); }

.slide-11 {
  background-image: url("../images/gallery/11.jpg"); }

.slide-12 {
  background-image: url("../images/gallery/12.jpg"); }

.slide-13 {
  background-image: url("../images/gallery/13.jpg"); }

.slide-14 {
  background-image: url("../images/gallery/14.jpg"); }

.slideshow {
  background: white;
  position: fixed;
  z-index: 10;
  width: 100%;
  height: 100%;
  top: -150%;
  left: 0;
  overflow: hidden;
  -webkit-transition: top 0.95s ease;
  -o-transition: top 0.95s ease;
  transition: top 0.95s ease; }
  @media all and (min-width: 1024px) {
    .slideshow {
      display: block; } }
  .slideshow.show {
    top: 0; }
  .slideshow-box {
    position: absolute;
    width: 1400%;
    height: 100%;
    top: 0;
    -webkit-transition: all 750ms ease;
    -o-transition: all 750ms ease;
    transition: all 750ms ease; }
    .slideshow-box.position-1 {
      left: 0; }
    .slideshow-box.position-2 {
      left: -100%; }
    .slideshow-box.position-3 {
      left: -200%; }
    .slideshow-box.position-4 {
      left: -300%; }
    .slideshow-box.position-5 {
      left: -400%; }
    .slideshow-box.position-6 {
      left: -500%; }
    .slideshow-box.position-7 {
      left: -600%; }
    .slideshow-box.position-8 {
      left: -700%; }
    .slideshow-box.position-9 {
      left: -800%; }
    .slideshow-box.position-10 {
      left: -900%; }
    .slideshow-box.position-11 {
      left: -1000%; }
    .slideshow-box.position-12 {
      left: -1100%; }
    .slideshow-box.position-13 {
      left: -1200%; }
    .slideshow-box.position-14 {
      left: -1300%; }
    .slideshow-box .slide {
      width: 7.1425%;
      height: 100%;
      float: left;
      position: relative; }
      .slideshow-box .slide span {
        background-clip: content-box;
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
        display: block;
        width: 100%;
        height: 100%; }
  .slideshow img {
    width: auto;
    height: 100%; }
  .slideshow p {
    background: white;
    background: rgba(255, 255, 255, 0.9);
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    padding: 20px 20px 35px;
    color: #2b2b2b;
    text-align: center; }
  .slideshow .slide-arrow {
    background: white;
    background: rgba(255, 255, 255, 0.9);
    cursor: pointer;
    display: block;
    position: absolute;
    width: 32px;
    height: 100%;
    top: 0px;
    z-index: 12;
    padding: 0;
    border: none; }
    @media all and (min-width: 1024px) {
      .slideshow .slide-arrow {
        width: 70px; } }
    .slideshow .slide-arrow .arrow-icon {
      position: absolute;
      pointer-events: none;
      width: 22px;
      height: 20px;
      top: 50%;
      left: 50%;
      margin-top: -10px;
      margin-left: -11px;
      color: #2b2b2b;
      font-size: 22px;
      line-height: 20px; }
    .slideshow .slide-arrow-left.hidden, .slideshow .slide-arrow-right.hidden {
      display: none;
      pointer-events: none; }
    .slideshow .slide-arrow-left {
      left: 0; }
      .slideshow .slide-arrow-left .arrow-icon {
        left: 50%; }
        .slideshow .slide-arrow-left .arrow-icon:before {
          content: '\21E0'; }
    .slideshow .slide-arrow-right {
      right: 0; }
      .slideshow .slide-arrow-right .arrow-icon {
        right: 50%; }
        .slideshow .slide-arrow-right .arrow-icon:before {
          content: '\21E2'; }
  .slideshow .slide-nav {
    display: flex;
    flex-flow: row nowrap;
    position: absolute;
    bottom: 15px;
    left: 50%;
    margin-left: -107px; }
    .slideshow .slide-nav-item {
      background: #282028;
      cursor: pointer;
      display: block;
      width: 6px;
      height: 6px;
      border-radius: 3px;
      margin-left: 10px; }
      .slideshow .slide-nav-item:first-child {
        margin-left: 0; }
      .slideshow .slide-nav-item.nav-selected {
        background: #70c989; }

/* ==media======================================================================
	@media
	========================================================================== */
#media {
  background: url(../images/bg-media.jpg) center no-repeat;
  background-size: cover;
  position: relative;
  padding: 120px 20px 40px; }
  @media all and (min-width: 1024px) {
    #media {
      display: grid;
      grid-template-columns: [playlist] auto [header] 150px [gap] 10%;
      grid-template-rows: auto;
      gap: 0;
      background-attachment: fixed;
      min-height: 100vh;
      padding: 120px 0 60px; } }
@media all and (min-width: 1024px) {
  .header-column {
    grid-column: header / header;
    grid-row: 1 / 1; } }

.media-hdr {
  background: #fdfdfd;
  background: rgba(253, 253, 253, 0.8);
  width: 150px;
  border-radius: 4px;
  padding: 0 0 10px 20px; }
  @media all and (min-width: 1024px) {
    .media-hdr {
      position: sticky;
      top: 120px;
      padding-right: 10px; } }
  .media-hdr .section-title {
    width: 120px; }

.media-content {
  background: #fdfdfd;
  background: rgba(253, 253, 253, 0.83);
  position: relative;
  border-radius: 2px;
  margin-top: 20px;
  padding: 10px; }
  @media all and (min-width: 1024px) {
    .media-content {
      grid-column: playlist / playlist;
      grid-row: 1 / 1;
      width: 50%;
      left: 30px;
      margin-top: 0; } }
.media-soundcloud {
  display: block;
  position: relative;
  margin-top: 64px;
  padding-left: 64px;
  color: #000;
  transition: color 0.3s ease; }
  .media-soundcloud::before {
    content: '';
    display: block;
    position: absolute;
    width: 50px;
    height: 29px;
    top: 8px;
    left: 0;
    background-image: url(../images/logo__soundcloud.png);
    background-size: contain; }
    @media all and (min-width: 1024px) {
      .media-soundcloud::before {
        top: 4px; } }
  .media-soundcloud:hover {
    color: #70c989; }
    .media-soundcloud:hover span {
      color: #70c989; }
  .media-soundcloud span {
    color: #fd511c;
    transition: color 0.3s ease; }

.playlist {
  padding-bottom: 24px; }
  .playlist .direct__hdr {
    margin-bottom: 0;
    padding: 8px 0 0 8px; }

.track {
  cursor: pointer;
  display: grid;
  grid-template-columns: [list] 28px [album] 32px [name] auto [select] 40px;
  grid-template-rows: auto;
  align-items: center;
  margin-top: 12px;
  padding: 12px 0;
  border-radius: 5px;
  background: #443b37;
  background: rgba(68, 59, 55, 0.9); }
  .track.active .track__number, .track.active .track__length, .track.active .track__title, .track:hover .track__number, .track:hover .track__length, .track:hover .track__title {
    color: #fdfdfd; }
  .track.active .track__title--highlight, .track:hover .track__title--highlight {
    color: #70c989; }
  .track.active .track__play, .track:hover .track__play {
    border-color: #70c989;
    background-color: #70c989; }
    .track.active .track__play .triangle, .track:hover .track__play .triangle {
      background-color: #fff; }
  .track__number, .track__length {
    transition: color 0.3s ease;
    color: #e9cc83; }
  .track__number {
    font-family: "dosissemibold", Arial, sans-serif;
    font-size: 14px;
    text-align: center; }
  .track__image {
    width: 32px;
    height: 32px;
    border-radius: 4px; }
  .track__info {
    padding-left: 8px;
    font-size: 14px; }
    @media all and (min-width: 1024px) {
      .track__info {
        display: flex;
        flex-flow: row nowrap;
        padding-left: 14px;
        font-size: 16px; } }
  .track__title {
    color: #e9cc83;
    font-weight: bold;
    letter-spacing: 0.5px;
    transition: color 0.3s ease; }
    @media all and (min-width: 1024px) {
      .track__title {
        width: calc(100% - 50px); } }
    .track__title--highlight {
      color: #e9cc83;
      transition: color 0.3s ease; }
  .track__play {
    position: relative;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid #cdcdcd;
    border-radius: 3px;
    background-color: #f1f4f7;
    transition: background-color 0.3s ease, border-color 0.3s ease; }
    .track__play .triangle {
      display: block;
      position: relative;
      width: 6px;
      height: 6px;
      border-top-right-radius: 30%;
      background-color: #70c989;
      transform: rotate(30deg) skewX(-30deg) scale(1, 0.866) translate(-70%, -40%);
      transition: background-color 0.4s ease;
      text-align: left; }
      .track__play .triangle:before, .track__play .triangle:after {
        content: '';
        position: absolute;
        width: 6px;
        height: 6px;
        border-top-right-radius: 30%;
        background-color: inherit; }
      .track__play .triangle:before {
        transform: rotate(-135deg) skewX(-45deg) scale(1.414, 0.707) translate(0, -50%); }
      .track__play .triangle:after {
        transform: rotate(135deg) skewY(-45deg) scale(0.707, 1.414) translate(50%); }
    .track__play .triangle {
      position: absolute;
      top: 50%;
      left: 50%; }

.media__audio {
  position: relative;
  width: 100%; }

.player.direct__hdr {
  margin: 32px auto 0;
  text-align: center; }

.audio-player {
  width: 238px;
  margin: 16px auto 0; }
  .audio-player__header {
    position: relative; }
  .audio-player__title {
    position: absolute;
    width: calc(100% - 16px);
    top: 60%;
    left: 50%;
    padding: 4px;
    border-radius: 3px;
    background-color: #f1f4f7;
    transform: translateX(-50%);
    text-align: center; }
  .audio-player__image {
    width: 100%;
    height: 100%;
    border-radius: 3px 3px 0 0; }
  .audio-player__body {
    padding: 4px;
    border-radius: 0 0 5px 5px;
    background-color: #f1f4f7; }
  .audio-player__controls {
    display: flex;
    flex-flow: row nowrap;
    position: relative;
    width: 230px; }
    .audio-player__controls-icon {
      padding: 0;
      background-color: #fff;
      box-shadow: 0;
      transition: background-color 0.4s ease-in-out, box-shadow 0.4s ease-in-out; }
      .audio-player__controls-icon:hover {
        background-color: #70c989;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); }
    .audio-player__controls-play {
      position: absolute;
      width: 60px;
      height: 60px;
      top: 0;
      left: 50%;
      z-index: 2;
      border: 3px solid #f1f4f7;
      border-radius: 50%;
      transform: translate(-50%, -45%); }
      .audio-player__controls-play:hover .triangle {
        background-color: #fff; }
      .audio-player__controls-play:hover .lines::after, .audio-player__controls-play:hover .lines::before {
        background-color: #fff; }
      .audio-player__controls-play .triangle {
        display: block;
        position: relative;
        width: 10px;
        height: 10px;
        border-top-right-radius: 30%;
        background-color: #2b2b2b;
        transform: rotate(30deg) skewX(-30deg) scale(1, 0.866) translate(-70%, -40%);
        transition: background-color 0.4s ease;
        text-align: left; }
        .audio-player__controls-play .triangle:before, .audio-player__controls-play .triangle:after {
          content: '';
          position: absolute;
          width: 10px;
          height: 10px;
          border-top-right-radius: 30%;
          background-color: inherit; }
        .audio-player__controls-play .triangle:before {
          transform: rotate(-135deg) skewX(-45deg) scale(1.414, 0.707) translate(0, -50%); }
        .audio-player__controls-play .triangle:after {
          transform: rotate(135deg) skewY(-45deg) scale(0.707, 1.414) translate(50%); }
      .audio-player__controls-play .triangle {
        position: absolute;
        top: 50%;
        left: 50%; }
      .audio-player__controls-play .lines {
        display: block;
        position: absolute;
        width: 9px;
        height: 14px;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%); }
        .audio-player__controls-play .lines::after, .audio-player__controls-play .lines::before {
          content: '';
          display: block;
          position: absolute;
          width: 3px;
          height: 14px;
          top: 0;
          border-radius: 3px;
          background-color: #2b2b2b;
          transition: background-color 0.4s ease; }
        .audio-player__controls-play .lines::before {
          left: 0; }
        .audio-player__controls-play .lines::after {
          right: 0; }
      .audio-player__controls-play.play .triangle {
        display: block; }
      .audio-player__controls-play.play .lines {
        display: none; }
      .audio-player__controls-play.paused .triangle {
        display: none; }
      .audio-player__controls-play.paused .lines {
        display: block; }
    .audio-player__controls-stop, .audio-player__controls-download {
      position: relative;
      width: 50%;
      height: 40px;
      z-index: 1;
      border: none; }
    .audio-player__controls-download {
      border-radius: 0 5px 5px 0; }
      .audio-player__controls-download::before {
        content: '';
        display: block;
        position: absolute;
        width: 16px;
        height: 3px;
        top: 25px;
        left: 64px;
        border-radius: 2px;
        background-color: #2b2b2b;
        transition: background-color 0.4s ease; }
      .audio-player__controls-download:hover::before {
        background-color: #fff; }
      .audio-player__controls-download:hover .audio-player__controls-download-arrow {
        background-color: #fff; }
        .audio-player__controls-download:hover .audio-player__controls-download-arrow::after, .audio-player__controls-download:hover .audio-player__controls-download-arrow::before {
          background-color: #fff; }
      .audio-player__controls-download-arrow {
        display: block;
        position: absolute;
        width: 12px;
        height: 3px;
        top: 15px;
        right: 37px;
        border-radius: 2px;
        background-color: #2b2b2b;
        transform: rotate(90deg);
        transition: background-color 0.4s ease; }
        .audio-player__controls-download-arrow::after, .audio-player__controls-download-arrow::before {
          content: '';
          display: block;
          position: absolute;
          width: 8px;
          height: 3px;
          right: -2px;
          border-radius: 2px 0 0 2px;
          background-color: #2b2b2b;
          transition: background-color 0.4s ease;
          transform-origin: 7px center; }
        .audio-player__controls-download-arrow::after {
          transform: rotate(45deg); }
        .audio-player__controls-download-arrow::before {
          transform: rotate(-45deg); }
    .audio-player__controls-stop {
      border-radius: 5px 0 0 5px; }
      .audio-player__controls-stop::before {
        content: '';
        display: block;
        position: absolute;
        width: 12px;
        height: 12px;
        top: 50%;
        left: 40px;
        border-radius: 2px;
        background-color: #2b2b2b;
        transform: translateY(-50%);
        transition: background-color 0.4s ease; }
      .audio-player__controls-stop:hover::before {
        background-color: #fff; }
  .audio-player__time {
    display: flex;
    flex-flow: row nowrap;
    margin-top: 8px;
    padding: 0 4px; }
    .audio-player__time-bar {
      align-self: center;
      display: block;
      position: relative;
      width: calc(100% - 100px);
      height: 6px;
      border-radius: 3px;
      overflow: hidden;
      background-color: #cdcdcd; }
      .audio-player__time-bar--played {
        display: block;
        position: absolute;
        width: 0;
        height: 100%;
        top: 0;
        left: 0;
        border-radius: 3px;
        background-color: #70c989; }
    .audio-player__time-current, .audio-player__time-total {
      width: 50px;
      font-family: Helvetica, sans-serif;
      font-size: 11px; }
      @media all and (min-width: 1024px) {
        .audio-player__time-current, .audio-player__time-total {
          font-size: 12px; } }
    .audio-player__time-total {
      text-align: right; }

/* ==social=====================================================================
	@social
	========================================================================== */
#social {
  background: #282028;
  position: relative; }
  #social:before {
    content: '#';
    position: absolute;
    top: 0;
    left: 20%;
    opacity: 0.03;
    color: #fdfdfd;
    font-size: 360px;
    line-height: 280px; }

#short-tweets ul {
  display: none;
  margin: 0;
  padding: 0; }

.tweet-text, .pics-words li.two-tweets > div, .pics-words li.his-tweets, .pics-words li.his-grams a .gram-text {
  color: #fdfdfd;
  font-size: 18px;
  line-height: 22px; }
  .tweet-text a, .pics-words li.two-tweets > div a, .pics-words li.his-tweets a, .pics-words li.his-grams a .gram-text a {
    color: #fdbe1c;
    font-size: 16px;
    line-height: 16px;
    word-break: break-word; }
    .tweet-text a:hover, .pics-words li.two-tweets > div a:hover, .pics-words li.his-tweets a:hover, .pics-words li.his-grams a .gram-text a:hover {
      color: #876c3b; }

.twitter-title:before, .pics-words li.two-tweets:before, .pics-words li.his-tweets:before {
  content: 'Twitter';
  position: absolute;
  bottom: 10px;
  right: 10px;
  color: #876c3b;
  font: bold 11px/11px Arial, sans-serif;
  text-transform: uppercase; }

.pics-words {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  padding: 0;
  margin: 0; }
  .pics-words li {
    display: block;
    position: relative;
    width: 25%;
    padding-bottom: 50px;
    overflow: hidden; }
    @media all and (max-width: 640px) {
      .pics-words li {
        width: 100%; } }
    .pics-words li.social-hdr {
      width: 100%;
      height: 290px;
      padding: 30px 30px 30px 5%; }
      .pics-words li.social-hdr .section-title {
        color: #fdfdfd; }
      @media all and (min-width: 1024px) {
        .pics-words li.social-hdr {
          width: 50%; } }
    @media all and (min-width: 641px) and (max-width: 1024px) {
      .pics-words li.his-grams {
        width: 50%;
        border: 1px solid #876c3b;
        border-width: 0 0 1px 1px;
        padding-bottom: 0; }
        .pics-words li.his-grams a .gram-text {
          min-height: 180px; } }
    .pics-words li.his-grams a {
      width: 100%;
      height: 100%;
      display: block; }
      @media all and (min-width: 1024px) {
        .pics-words li.his-grams a {
          padding-top: 50px; } }
      .pics-words li.his-grams a .gram-text {
        background: #282028;
        background: rgba(40, 32, 40, 0.8);
        content: attr(data-title);
        display: block;
        width: 100%;
        height: 100%;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-transition: top 0.65s ease;
        -o-transition: top 0.65s ease;
        transition: top 0.65s ease;
        font-size: 16px;
        letter-spacing: 0.7px; }
        @media all and (min-width: 1024px) {
          .pics-words li.his-grams a .gram-text {
            position: absolute;
            top: calc(100% - 50px);
            left: 0; } }
        .pics-words li.his-grams a .gram-text.empty-text .gram-post {
          padding: 0; }
        .pics-words li.his-grams a .gram-text .gram-title {
          background: #876c3b;
          background: rgba(135, 108, 59, 0.95);
          display: block;
          padding: 30px 20px 10px;
          color: #282028;
          font: bold 11px/11px Arial, sans-serif;
          letter-spacing: 0;
          text-transform: uppercase; }
        .pics-words li.his-grams a .gram-text .gram-post {
          margin: 0;
          padding: 20px 20px 40px; }
      .pics-words li.his-grams a:hover .gram-text:not(.empty-text) {
        top: 0; }
      .pics-words li.his-grams a img {
        width: 100%;
        height: auto; }
    .pics-words li.his-tweets {
      position: relative;
      padding: 20px 20px 40px;
      border-top: 1px solid #876c3b; }
      @media all and (min-width: 1024px) {
        .pics-words li.his-tweets {
          padding: 30px;
          border: none; } }
      @media all and (min-width: 641px) and (max-width: 1024px) {
        .pics-words li.his-tweets {
          border-top: 0;
          border-bottom: 1px solid #876c3b; } }
    .pics-words li.two-tweets {
      align-self: center;
      width: 100%;
      position: relative;
      border-top: 1px solid #876c3b; }
      @media all and (min-width: 641px) and (max-width: 1024px) {
        .pics-words li.two-tweets {
          width: 50%;
          border-top: 0;
          border-bottom: 1px solid #876c3b; } }
      .pics-words li.two-tweets > div {
        position: relative;
        height: 50%;
        padding: 50px; }
        .pics-words li.two-tweets > div:first-child:before {
          background: #fdfdfd;
          content: '';
          display: block;
          position: absolute;
          height: 1px;
          bottom: 0;
          left: 30px;
          right: 30px; }
      @media all and (min-width: 1024px) {
        .pics-words li.two-tweets {
          width: 50%;
          border: none; } }
.social-links {
  display: flex;
  flex-flow: row nowrap;
  position: relative;
  z-index: 2;
  padding: 30px 0; }
  .social-links.green-alt a {
    color: #70c989; }
    .social-links.green-alt a:hover {
      color: #fff; }
    .social-links.green-alt a.social-pk {
      font-size: 16px; }
  .social-links a {
    display: block;
    width: calc(100% / 6);
    padding: 20px 0 19px;
    color: #fdfdfd;
    font: normal 24px/26px "Socicon";
    text-align: center;
    -webkit-font-smoothing: antialiased;
    -webkit-transition: background-color 0.5s ease, color 0.5s ease;
    -o-transition: background-color 0.5s ease, color 0.5s ease;
    transition: background-color 0.5s ease, color 0.5s ease; }
    .social-links a::before {
      display: inline-block; }
    .social-links a.social-fb::before {
      content: '\e028'; }
    .social-links a.social-fb:hover {
      background-color: #507cc7; }
    .social-links a.social-twt::before {
      content: '\e08d'; }
    .social-links a.social-twt:hover {
      background-color: #62cdf1; }
    .social-links a.social-ig::before {
      content: '\e044'; }
    .social-links a.social-ig:hover {
      background-color: #8744b8;
      color: #f3a452; }
    .social-links a.social-twc::before {
      content: '\e08c'; }
    .social-links a.social-twc:hover {
      background-color: #6c2498; }
    .social-links a.social-yt::before {
      content: '\e0a5'; }
    .social-links a.social-yt:hover {
      background-color: #d21d28; }
    .social-links a.social-pk {
      min-width: 74px;
      font: bold 20px/24px "dosisregular", Arial, sans-serif;
      letter-spacing: 0.25px;
      text-align: center;
      text-transform: uppercase; }
      .social-links a.social-pk:hover {
        background-color: #70c989;
        color: #2b2b2b; }

.the-links {
  max-width: 1200px;
  padding: 30px 0 0; }
  @media all and (min-width: 1024px) {
    .the-links {
      padding-top: 80px; } }
  .the-links .section-title {
    width: 140px;
    margin: 0 20px; }
    @media all and (min-width: 1024px) {
      .the-links .section-title {
        width: 160px;
        margin-left: 10%; } }
  .the-links .social-links {
    padding: 10px 0; }
    @media all and (min-width: 1024px) {
      .the-links .social-links {
        margin-top: 30px;
        padding: 10px 3%; } }
/* ==contact====================================================================
	@contact
	========================================================================== */
#contact {
  background: #282028;
  position: relative;
  padding: 60px 0;
  color: #fff; }
  #contact .section-title {
    margin-bottom: 45px; }
  #contact .bg {
    background: url(../images/bg-contact.jpg);
    background-position: center;
    background-size: cover;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 0;
    opacity: 0.025; }
    @media all and (max-width: 640px) {
      #contact .bg {
        background-attachment: fixed; } }
.contact-main {
  position: relative;
  width: 100%;
  z-index: 1;
  padding: 0 20px; }
  @media all and (min-width: 640px) {
    .contact-main {
      display: grid;
      grid-template-columns: [list] 35% [form] 65%;
      grid-template-rows: [header] auto [content] auto;
      gap: 45px 15px; } }
  @media all and (min-width: 1024px) {
    .contact-main {
      padding: 0 10%; } }
.direct__hdr {
  margin-bottom: 20px;
  color: #876c3b;
  font-size: 24px;
  line-height: 26px;
  text-transform: uppercase; }
  @media all and (min-width: 1024px) {
    .direct__hdr {
      margin-bottom: 40px; } }
  .direct__hdr span {
    color: #70c989;
    font-size: 18px;
    text-transform: none; }

@media all and (min-width: 640px) {
  .section-title {
    grid-column: 1 / 3;
    grid-row: header / header; } }

@media all and (min-width: 640px) {
  .direct-contact {
    grid-column: list / list;
    grid-row: content / content; } }

.direct-info {
  position: relative;
  padding-left: 50px;
  margin-bottom: 30px; }
  .direct-info:before {
    position: absolute;
    text-align: center; }
  .direct-info.locale:before {
    background: transparent;
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    top: 3px;
    left: 0;
    border: 6px solid #70c989;
    margin-left: 5px;
    border-radius: 16px 16px 16px 0;
    -webkit-box-shadow: -1px 1px 2px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: -1px 1px 2px rgba(0, 0, 0, 0.2);
    box-shadow: -1px 1px 2px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transition: border-color 500ms ease;
    -o-transition: border-color 500ms ease;
    transition: border-color 500ms ease; }
  .direct-info.postman:before {
    content: '\e050';
    top: 0;
    left: 6px;
    color: #70c989;
    font: 28px/32px "Socicon"; }
  .direct-info.twt-handle:before {
    content: '\e08d';
    top: 0;
    left: 6px;
    color: #70c989;
    font: 28px/32px "Socicon"; }
  .direct-info .direct__main {
    font: 18px/24px "Didot", Times, Baskerville, Georgia, serif; }
  .direct-info a.direct__main {
    color: #fff; }
    .direct-info a.direct__main:hover {
      color: #876c3b; }

.input-box {
  position: relative;
  margin-bottom: 32px; }
  .input-box .input__label {
    display: block;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    height: 20px;
    font-family: "dosissemibold", Arial, sans-serif;
    text-transform: uppercase;
    opacity: 1;
    -webkit-transition: all 0.35s ease;
    -o-transition: all 0.35s ease;
    transition: all 0.35s ease; }
    .input-box .input__label.filled, .input-box .input__label.focus {
      top: -18px;
      font-size: 11px; }
    .input-box .input__label.focus {
      color: #70c989; }
  .input-box .input__field {
    background: none;
    display: block;
    position: relative;
    z-index: 1;
    width: 100%;
    padding: 2px 2px 4px;
    border-bottom: 3px solid #bcbcbc;
    border-width: 0 0 3px;
    color: white;
    font: 16px/22px "dosisregular", Arial, sans-serif; }
    .input-box .input__field:required:valid {
      border-color: #70c989; }
  .input-box .error {
    display: none;
    position: absolute;
    bottom: -20px;
    color: #e21f48;
    font-size: 12px; }

.btn-clear,
.btn-submit {
  background: white;
  display: block;
  float: right;
  position: relative;
  top: -3px;
  left: -3px;
  border: none;
  overflow: hidden;
  padding: 7px 20px;
  outline: 3px solid #2b2b2b;
  margin-left: 40px;
  color: #2b2b2b;
  font: 16px/18px "dosissemibold", Arial, sans-serif;
  text-align: center;
  -webkit-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease; }
  .btn-clear:before,
  .btn-submit:before {
    display: block;
    position: absolute;
    width: 37px;
    height: 37px;
    top: 0;
    left: -37px;
    z-index: 1;
    color: white;
    font-size: 26px;
    line-height: 30px;
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease; }
  .btn-clear:hover,
  .btn-submit:hover {
    padding-left: 50px;
    color: white; }
    .btn-clear:hover:before, .btn-clear:hover:after,
    .btn-submit:hover:before,
    .btn-submit:hover:after {
      left: 0; }
  .btn-clear.disabled,
  .btn-submit.disabled {
    pointer-events: none;
    border-color: #9b9b9b;
    outline-color: #535353;
    opacity: 0.3; }

.btn-clear {
  border-bottom: 5px solid #876c3b; }
  .btn-clear:before {
    background: #876c3b;
    content: '\00d7'; }
  .btn-clear:hover {
    background: #876c3b; }

.btn-submit {
  border-bottom: 5px solid #70c989;
  border-width: 0 0 5px; }
  .btn-submit:before {
    content: '\00ac';
    top: -3px;
    -webkit-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg); }
  .btn-submit:after {
    content: '';
    display: block;
    position: absolute;
    width: 37px;
    height: 37px;
    top: 0;
    left: -37px;
    background: #70c989;
    color: white;
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease; }
  .btn-submit:hover {
    background: #70c989; }
  .btn-submit input {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0; }

#form-booking {
  position: relative;
  border-top: 1px solid #876c3b;
  margin-top: 40px;
  padding-top: 40px; }
  @media all and (min-width: 640px) {
    #form-booking {
      border-top: 0;
      margin-top: 0;
      padding-top: 0; } }
  @media all and (min-width: 640px) {
    #form-booking {
      grid-column: form / form;
      grid-row: content / content; } }
  #form-booking .btn-clear,
  #form-booking .btn-submit {
    width: 120px; }
  #form-booking .btn-clear {
    margin-left: 0; }

#form-subscribe {
  padding: 0 10%; }
  #form-subscribe .subscribe__box {
    display: flex;
    flex-flow: row nowrap;
    border-top: 1px solid #876c3b;
    margin-top: 40px;
    padding-top: 60px; }
    #form-subscribe .subscribe__box .input-box {
      width: 22%;
      margin-right: 5%; }
    #form-subscribe .subscribe__box .btn-submit {
      display: block;
      width: 120px;
      margin: 0; }

.form__notifications {
  background: #70c989;
  display: none;
  position: absolute;
  width: 100%;
  height: 101%;
  top: 0;
  left: 0;
  z-index: 2;
  border-radius: 5px;
  padding: 30px 23%;
  color: #fff;
  text-align: center; }
  .form__notifications.show {
    display: block; }
  .form__notifications.form__failure {
    background-color: #9f3956; }
    .form__notifications.form__failure .main-message {
      color: #000; }
  .form__notifications .message-container {
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
    width: 100%;
    height: 100%; }
  .form__notifications .main-message {
    margin-bottom: 30px;
    color: #2b2b2b;
    font: 24px/30px "Didot", Times, Baskerville, Georgia, serif; }
  .form__notifications p {
    font-size: 18px;
    line-height: 24px; }