/*
Theme Name: XPW 2018
Author: Tom Virgin
Author URI: http://www.studio-tom.com/
Description: A custom, modern theme for XponentialWorks.
Version: 1.0
Tags: one-column, responsive, dont-try-this-at-home
Text Domain: xpw

*/
/*

fuchsia  		99366d		rgba(153, 54, 109, 1)
purple			6e3a72		rgba(110, 58, 114, 1)
dark blue		2f4a82		rgba(47, 74, 130, 1)
periwinkle		346caf		rgba(52, 108, 175, 1)
blue			0189bf		rgba(1, 137, 191, 1)
cyan			00accb		rgba(0, 172, 203, 1)
sea green		59c5cf		rgba(89, 197, 207, 1)
midnight		152032		rgba(21, 32, 50, 1)
cold gray		5a6278		rgba(90, 98, 120, 1)
mid gray		5a6278		rgba(90, 98, 120, 0.7)
light gray		acb0bb		rgba(172, 176, 187, 1)
off-white		ecebed		rgba(236, 235, 237, 1)

*/
#menu-button { position: fixed; top: 1rem; right: 1rem; display: block; font-size: 1.4rem; width: 3rem; height: 3rem; border-radius: 2rem; color: white; z-index: 12; cursor: pointer; }

#menu-button::before { content: '\2630'; display: block; width: 100%; height: 100%; padding: 0.27rem 0.85rem; color: inherit; box-sizing: border-box; }

ul.menu { list-style: none; padding-left: 0; }

div#header-wrapper { position: fixed; top: 0; left: 0; width: 100vw; height: auto; z-index: 10; background: white; box-shadow: 0 0 0 3vw #ecebed; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }

div#header-wrapper ul.menu { display: table; width: 100%; }

div#header-wrapper ul.menu li { display: table-cell; }

div#header-wrapper .nav-menu { position: relative; display: block; max-width: 80vw; margin: 0 auto; z-index: 20; color: rgba(90, 98, 120, 0.7); text-align: center; font-size: 1em; }

div#header-wrapper .nav-menu a { display: block; padding: 0.5em; color: rgba(90, 98, 120, 0.7); transition: all 0.4s; border-radius: 3rem; }

div#header-wrapper .nav-menu .current-menu-item a, div#header-wrapper .nav-menu a:hover { background-color: rgba(90, 98, 120, 0.05); }

div#header-wrapper.mobile { height: 140vh; -webkit-transform-origin: 0 calc(-100vw + 8rem); transform-origin: 0 calc(-100vw + 8rem); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); transition: 0; opacity: 0; overflow-y: scroll; font-size: 1.4em; background-color: transparent; }

div#header-wrapper.mobile::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-image: linear-gradient(45deg, #2f4a82 40%, #99366d 100%); }

div#header-wrapper.mobile.active { -webkit-transform: rotate(0); transform: rotate(0); opacity: 0.97; }

div#header-wrapper.mobile .nav-menu { width: 30rem; top: 50vh; left: 50vw; margin: 0; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); color: white; }

div#header-wrapper.mobile .nav-menu a { color: white; }

div#header-wrapper.mobile ul.menu { display: block; }

div#header-wrapper.mobile ul.menu li { display: block; }

body.scrolled #header-wrapper { opacity: 0.97; }

#logo { width: 20em; max-width: 60vw; height: auto; margin-bottom: 4rem; }

body { font-family: 'din-2014'; font-size: 1em; color: #5a6278; line-height: 1.7em; }

h1 { font-size: 2.4em; }

h2 { font-size: 3em; }

h3, blockquote.big { font-size: 2em; }

h4, blockquote { font-size: 1.6em; }

h5, blockquote.small { font-size: 1.4em; }

h6 { font-size: 1.2em; }

h1, h2, h3, h4, h5, h6 { margin: 0.5em 0; margin-top: 2rem; }

h1, h2, h3, blockquote { line-height: 1em; letter-spacing: -0.02em; }

h1 span, h2 span, h3 span, h4 span, h5 span, h6 span { font-family: "merriweather"; display: block; font-weight: normal; letter-spacing: -0.01em; }

h1 span, h2 span { font-size: 0.4em; }

h3 span, h4 span { font-size: 0.5em; }

h5 span, h6 span { font-size: 0.7em; }

h1, h2, h4, h5, h6, strong { font-weight: bold; }

h3, blockquote { font-weight: lighter; }

blockquote { line-height: 1.3em; margin-left: 0; border: none !important; padding: 2rem 0 !important; }

p { color: rgba(90, 98, 120, 0.7); }

@media (min-width: 30em) { body { font-size: 1.1em; } }

@media (min-width: 45em) { h1 { font-size: 3em; } }

@media (min-width: 60em) { body { font-size: 1.3em; }
  blockquote.big { font-size: 3em; } }

@media (min-width: 90em) { body { font-size: 1.5em; }
  blockquote.big { font-size: 4em; } }

a { text-decoration: none; }

p a, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #00accb; }

.fine-print { font-size: 0.6em; line-height: 1.4em; opacity: 0.6; }

a { color: inherit; }

a.down-arrow, a.next-arrow, a.previous-arrow, a.button, .wp-block-button a.wp-block-button__link { display: inline-block; padding: 0.5em; border-radius: 2em; color: #5a6278; box-shadow: inset 0 0 0 2px currentColor; text-decoration: none; background: none; }

a.button, .wp-block-button a.wp-block-button__link { padding: 0.5em 1em 0.5em 2em; }

a.button::after, .wp-block-button a.wp-block-button__link::after { content: '\232a'; position: relative; display: inline-block; vertical-align: middle; width: 0; left: -0.1rem; height: 1em; margin-left: 0; font-size: 1.5rem; line-height: 1em; color: inherit; -webkit-transform: scaleY(0.7); transform: scaleY(0.7); }

a.down-arrow { padding: 0.25em 0.5em 0; }

a.down-arrow::after { content: '\fe40'; font-size: 1em; display: inline-block; vertical-align: middle; position: relative; top: 0.2em; -webkit-transform: scaleX(0.7); transform: scaleX(0.7); }

a.next-arrow { padding: 0.5em 0.6em; }

a.next-arrow::after { content: '\232a'; position: relative; display: inline-block; vertical-align: middle; width: 1em; height: 1em; font-size: 1.5em; line-height: 1em; color: inherit; -webkit-transform: scaleY(0.7) translateX(0.25em); transform: scaleY(0.7) translateX(0.25em); }

a.previous-arrow { padding: 0.5em 0.6em; }

a.previous-arrow::after { content: '\2329'; position: relative; display: inline-block; vertical-align: middle; width: 1em; height: 1em; font-size: 1.5em; line-height: 1em; color: inherit; -webkit-transform: scaleY(0.7) translateX(-0.35em); transform: scaleY(0.7) translateX(-0.35em); }

.wp-block-button a.wp-block-button__link, .advgb-post-readmore a { display: inline-block; padding: 0.5em 1em; border-radius: 2em; color: #5a6278; box-shadow: inset 0 0 0 2px currentColor; text-decoration: none; background: none; transition: all 0.4s; font-size: 1.2rem; line-height: 1rem; }

.wp-block-button a.wp-block-button__link:hover, .advgb-post-readmore a:hover { background-image: linear-gradient(45deg, #2f4a82 40%, #99366d 100%); border: none; box-shadow: none; color: white; }

.wp-block-button a.wp-block-button__link:hover::after, .advgb-post-readmore a:hover::after { margin-left: 0.75em; }

.wp-block-button a.wp-block-button__link::after, .advgb-post-readmore a::after { content: '\232a'; position: relative; display: inline-block; vertical-align: middle; width: 0.5em; left: 0; height: 1em; margin-left: 0.5em; font-size: 1.5em; line-height: 1.1em; color: inherit; -webkit-transform: scaleY(0.7); transform: scaleY(0.7); transition: margin 0.4s; }

h1 img, h2 img, h3 img { display: block; clear: both; height: 1.25em; width: auto; margin: 0 0 0.75em; }

section.right h1 img, section.right h2 img, section.right h3 img { margin: 0 0 0.75em auto; }

h4 img, h5 img, h6 img { display: inline-block; vertical-align: middle; height: 0.85em; width: auto; margin-right: 0.5em; }

.header-image img { max-width: 50vw !important; }

h1.page-title { width: calc(50% + 10vw); min-width: 12rem; padding: 10vw 10vw 0 10vw; }

@media (orientation: portrait) { h1.page-title { padding: 12vw 10vw 0 10vw; } }

@media (max-width: 40em) { h1.page-title { padding-top: 20vw; } }

.section-wrapper h1.page-title { padding: 10vw 0; width: 50%; }

@media (orientation: portrait) { .section-wrapper h1.page-title { padding: 12vw 0 10vw; } }

h1.page-title + section.wp-block-xpw-section-section { padding-top: 2vw; }

section + h1 { padding-top: 10vw !important; width: 100% !important; max-width: 70rem; }

html, body, div { margin: 0; padding: 0; }

html, body { overflow-x: hidden; }

body { height: 100vh; overflow: visible; }

div#body-wrapper { width: 100vw; overflow: visible; opacity: 0; transition: opacity 0.6s 0.3s; }

body.landed div#body-wrapper { opacity: 1; }

p { margin-bottom: 0.5em; }

p img { max-width: 100%; height: auto; }

iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

p iframe { position: relative; height: 60vw; }

section li { margin-bottom: 0.5em; }

ul.bios { list-style: none; padding-left: 0; }

ul.bios { display: block; margin: 0 0 0 auto; clear: both; font-size: 0; }

ul.bios .bio { display: inline-block; width: 100%; text-align: center; font-size: 1rem; }

@media (min-width: 40em) { ul.bios .bio { width: 45%; margin: 2.5%; } }

@media (min-width: 60em) { ul.bios .bio { width: 30%; margin: 1.6%; } }

ul.bios figure { width: 100%; height: auto; background-size: cover; background-position: center center; margin: 0; }

ul.bios figure::after { content: ''; display: block; padding-top: 100%; }

hr.wp-block-separator.is-style-wide { border-bottom-width: 2px; border-bottom-color: #acb0bb; }

figure.banner { background: center center / cover no-repeat; }

.post-list article { position: relative; padding-left: 0; font-size: 0.85em; }

.post-list article figure { z-index: 1; position: relative; display: block; left: 0; top: 2rem; width: 10rem; height: 10rem; margin-bottom: 4rem; }

@media (min-width: 45em) { .post-list article { padding-left: 12rem; }
  .post-list article figure { left: -12rem; margin-bottom: -10rem; } }

article { display: block; margin: 4rem 0; }

article.alignwide, article.alignfull { max-width: 100% !important; }

@media (min-width: 30em) { article { max-width: 65vw; } }

@media (min-width: 60em) { article { max-width: 55vw; } }

@media (min-width: 90em) { article { max-width: 45vw; } }

.gradient-purple::after, .gradient-blue::after, .solid-gray::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; }

.gradient-purple::after { background-image: linear-gradient(45deg, #2f4a82 40%, #99366d 100%); }

.gradient-blue::after { background-image: linear-gradient(45deg, #346caf 0%, #00accb 100%); }

.solid-gray::after { background-color: #5a6278; }

.gradient-purple.overlay::after, .gradient-blue.overlay::after, .solid-gray.overlay::after { opacity: 0.8; }

/*Forms*/
form[id^="gform"] { margin-bottom: 2rem; }

form[id^="gform"] ul { padding: 0; margin-top: 0; list-style-type: none; }

form[id^="gform"] li { list-style-type: none; }

form[id^="gform"] input[type="text"], form[id^="gform"] input[type="email"], form[id^="gform"] input[type="tel"], form[id^="gform"] input[type="checkbox"], form[id^="gform"] input[type="file"], form[id^="gform"] textarea, form[id^="gform"] .ginput_container_text input { display: block; position: relative; color: #222; line-height: 1.5em; font-size: 1rem; font-family: inherit; padding: 1em; border: none; border-radius: 0; background: #fff; box-shadow: none; outline: none; margin: 0; width: 100%; }

form[id^="gform"] input[type="text"]:focus, form[id^="gform"] input[type="email"]:focus, form[id^="gform"] input[type="tel"]:focus, form[id^="gform"] input[type="checkbox"]:focus, form[id^="gform"] input[type="file"]:focus, form[id^="gform"] textarea:focus, form[id^="gform"] .ginput_container_text input:focus { box-shadow: inset 0.25rem 0 0 #16959e; }

form[id^="gform"] textarea { min-height: 4rem; width: 100%; }

form[id^="gform"] div.has_first_name.has_last_name { font-size: 0; }

div.has_first_name.has_last_name > span { display: inline-block; width: calc(50% - 0.25rem); }

div.has_first_name.has_last_name > span:first-child { margin-right: 0.5rem; }

form[id^="gform"] span * { vertical-align: middle; }

form[id^="gform"] select { margin-bottom: 1rem; }

form[id^="gform"] .gfield { margin-bottom: 0.5rem; }

form[id^="gform"] .gfield_label { font-weight: bold; }

form[id^="gform"] .gfield_checkbox, form[id^="gform"] .gfield_radio { margin: 0; }

form[id^="gform"] input[type="checkbox"], form[id^="gform"] input[type="radio"] { position: relative; display: inline; width: auto; margin: 1rem 0.3rem 1rem 0rem; opacity: 0; z-index: 2; }

form[id^="gform"] input[type="checkbox"] + label, form[id^="gform"] input[type="radio"] + label { position: relative; }

form[id^="gform"] input[type="checkbox"] + label::before, form[id^="gform"] input[type="radio"] + label::before { content: ""; position: relative; display: inline-block; top: -0.1rem; height: 1.2rem; width: 1.2rem; left: -1.5rem; vertical-align: middle; z-index: 1; border: solid 2px black; }

form[id^="gform"] input[type="checkbox"]:checked + label::before, form[id^="gform"] input[type="radio"]:checked + label::before { background: black; }

form[id^="gform"] input[type="radio"] + label::before { border-radius: 1rem; left: -1.2rem; }

form[id^="gform"] .gfield_description { position: relative; font-style: italic; font-size: 0.8em; padding: 0.25rem 0.5rem; }

form[id^="gform"] .gfield_description.validation_message { background: red; color: #fff; }

form[id^="gform"] div#ui-datepicker-div { background: white; padding: 1rem; box-shadow: 0 0 1rem rgba(34, 34, 34, 0.4); }

form[id^="gform"].lines input[type="text"], form[id^="gform"].lines input[type="email"], form[id^="gform"].lines input[type="tel"], form[id^="gform"].lines input[type="checkbox"], form[id^="gform"].lines input[type="file"], form[id^="gform"].lines textarea { border: none; background: none; box-shadow: none; padding-left: 0; }

form[id^="gform"].lines input[type="text"]:focus, form[id^="gform"].lines input[type="email"]:focus, form[id^="gform"].lines input[type="tel"]:focus, form[id^="gform"].lines input[type="checkbox"]:focus, form[id^="gform"].lines input[type="file"]:focus, form[id^="gform"].lines textarea:focus { box-shadow: none; background: #fff; padding-left: 1rem; }

form[id^="gform"].lines .gfield { border-bottom: solid 2px rgba(90, 98, 120, 0.2); }

form[id^="gform"].lines .gfield_description { padding: 0.5rem 0; }

.placeholder .gfield_label, .placeholder .name_first label, .placeholder .name_last label, .placeholder .ginput_container_address label { display: none; }

.placeholder ::-webkit-input-placeholder { color: rgba(34, 34, 34, 0.7); }

.placeholder :-moz-placeholder { color: rgba(34, 34, 34, 0.7); }

.placeholder ::-moz-placeholder { color: rgba(34, 34, 34, 0.7); }

.placeholder :-ms-input-placeholder { color: rgba(34, 34, 34, 0.7); }

input[type="submit"], form[id^="gform"] input.gform_button, .form-submit #submit, a.apply-button-enrolled, a.apply-button.signup { display: inline-block; padding: 0.5em 1em 0.5em 1em; border-radius: 2em; color: #5a6278; box-shadow: inset 0 0 0 2px currentColor; text-decoration: none; border: none; background: none; }

#gform_save_1_link { margin-left: 1rem; font-size: 0.8em; color: inherit; opacity: 0.5; }

a.button { float: none !important; }

/* Subscribe */
.footer-signup form[id^="gform"] input { background: rgba(255, 255, 255, 0.2); color: white; }

.footer-signup form[id^="gform"] .gform_body { display: inline-block; width: 100%; margin-left: -20px; }

.footer-signup form[id^="gform"] .gform_footer, .footer-signup form[id^="gform"] input[type=button] { margin-left: -40px; font-size: 0; display: inline-block; width: 24px; height: 24px; background: white; border-radius: 50%; }

.gform_footer { position: relative; z-index: 10; }

.footer-signup .gform_footer::after { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); left: 0.86em; content: '\232a'; display: block; font-size: 12px; line-height: 12px; font-weight: bold; color: blue; opacity: 0.5; z-index: 10; }

.placeholder .footer-signup ::-webkit-input-placeholder { color: rgba(255, 255, 255, 0.8); }

.placeholder .footer-signup :-moz-placeholder { color: rgba(255, 255, 255, 0.8); }

.placeholder .footer-signup ::-moz-placeholder { color: rgba(255, 255, 255, 0.8); }

.placeholder .footer-signup :-ms-input-placeholder { color: rgba(255, 255, 255, 0.8); }

footer { position: relative; display: block; width: 100%; padding: 25vw 0 10vw; z-index: 2; color: white; box-sizing: border-box; }

footer a { color: white; }

#footer-logo { width: 20em; max-width: 60vw; height: auto; margin-bottom: 4rem; }

#footer-bg { display: block; position: relative; width: 100vw; height: 80vw; margin-top: -80vw; bottom: 0; background-color: #152032; z-index: -1; }

.global-footer-block section { padding-top: 0 !important; padding-bottom: 0 !important; }

.footer-square-triangle { height: 135vw; margin-top: calc(-35vw + 40rem); margin-bottom: -119vw; background-color: #152032; overflow: hidden; }

.footer-square-triangle .graphic { position: absolute; width: 70.71vw; height: 70.71vw; }

.footer-square-triangle .graphic.left { top: -50vw; left: 50%; width: 77.8vw; height: 77.8vw; -webkit-transform-origin: 0 0; transform-origin: 0 0; background: white; }

.footer-square-triangle .graphic.right { top: 41.46vw; right: -2.121vw; -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; }

.footer-signup { height: 135vw; height: 30vw; margin-bottom: -15vw; z-index: 3; }

.footer-signup .graphic.center { position: absolute; bottom: -13.54vw; right: 50vw; -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; width: 30rem; height: 30rem; }

.footer-signup article { width: 24rem; max-width: 80vw; position: absolute; display: block; bottom: calc(-13.54vw + 21.21rem); left: 50%; margin: 0 auto; text-align: center; -webkit-transform: translate(-50%, 50%); transform: translate(-50%, 50%); color: white; }

.footer-signup p { color: white; margin-left: auto; margin-right: auto; }

.footer-signup p.fine-print { width: 18rem; }

.footer-signup .gform_footer input[type="submit"] { width: 20px; height: 20px; opacity: 0; top: -8px; position: relative; }

h1, hr, .text-image, .global-footer-block .wp-block-column { transition: all 0.4s; }

h1 { transition-delay: 0.2s; }

.global-footer-block .wp-block-column:nth-child(1) { transition-delay: 0; }

.global-footer-block .wp-block-column:nth-child(2) { transition-delay: 0.1s; }

.global-footer-block .wp-block-column:nth-child(3) { transition-delay: 0.2s; }

hr { -webkit-transform: scaleX(0); transform: scaleX(0); }

hr.activate-animation { -webkit-transform: scaleX(1); transform: scaleX(1); }

h1 { -webkit-transform: translateX(-40px); transform: translateX(-40px); opacity: 0; }

h1.activate-animation { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; }

.global-footer-block .wp-block-column { -webkit-transform: translateY(40px); transform: translateY(40px); opacity: 0; }

.global-footer-block.activate-animation .wp-block-column { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }

.wp-block-image.is-resized { display: inline-block; }

.wp-block-separator { margin: 4vw auto; opacity: 0.3; }

.wp-block-columns { flex-wrap: wrap; }

.wp-block-column { padding-right: 3vw; min-width: 20rem; }

@media (min-width: 600px), all { .has-2-columns .wp-block-column { flex-basis: 50%; }
  .has-3-columns .wp-block-column { flex-basis: 33%; }
  .has-4-columns .wp-block-column { flex-basis: 25%; }
  .has-5-columns .wp-block-column { flex-basis: 20%; } }

#post-navigation { position: relative; margin-top: 10vw; margin-bottom: calc(-30vw + 50rem); margin-left: auto; margin-right: auto; width: 80vw; font-size: 0; z-index: 2; }

#post-navigation a[rel=prev], #post-navigation a[rel=next] { display: block; float: left; width: 50%; min-height: 160px; padding: 3vw; background: #eee; font-size: 1rem; box-shadow: 0 0 0 2px white; transition: all 0.4s; }

#post-navigation a[rel=prev]:hover, #post-navigation a[rel=next]:hover { color: white; background-image: linear-gradient(45deg, #2f4a82 40%, #99366d 100%); }

#post-navigation a[rel=prev]::before { content: '\232a'; position: absolute; left: -3rem; border: solid 1px currentcolor; border-radius: 50%; display: inline-block; width: 2rem; height: 2rem; text-indent: 0.8rem; line-height: 2rem; -webkit-transform: rotate(180deg); transform: rotate(180deg); }

#post-navigation a[rel=next]::before { content: '\232a'; position: absolute; right: -3rem; border: solid 1px currentcolor; border-radius: 50%; display: inline-block; width: 2rem; height: 2rem; text-indent: 0.8rem; line-height: 2rem; }

/* Articles */
.advgb-recent-posts-block, .advgb-recent-posts-block .advgb-recent-posts { width: 100%; }

.advgb-recent-posts-block.grid-view article { display: block; background: white; }

.advgb-recent-posts-block.grid-view img { width: 100%; height: auto; }

.advgb-recent-posts-block.grid-view h2 { font-size: 1em; }

.advgb-post-info { font-size: 0.7em; opacity: 0.7; }

.advgb-post-info a { color: inherit; }