/*
Colors:
green: #00A9B7
dark green: #00677F
dark blue: #00263E     
font: abril-display 400,600,700
font: soleil 400,500,600,700
font: leander-script-pro 400,700
font: Merriweather 300	
*/


html {-webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */}
body {font-family:soleil; color:#00263E; font-size:14px; line-height:1.65; font-weight:400; -webkit-font-smoothing: antialiased;}
h1 {color:#fff; font-family:Merriweather; font-size:2.5em; line-height:1.25; font-weight:300; margin-bottom:1em;}
h2 {font-family:Merriweather; font-size:1.75em; line-height:1.25; font-weight:300; text-transform:capitalize;}
h3, h4, h5 {font-family:Merriweather; font-size:1.1em; line-height:1.5; font-weight:300; text-transform:capitalize;}
a {color:#00263E; text-decoration:none; transition:color .2s;}
a:hover {color:#00A9B7; text-decoration:none; transition:color .2s;}
img {display:block;}
p {margin-bottom:2em;}
strong {font-weight:bold;}
.no-ws {white-space:nowrap;}
.max-width {width:calc(100% - 10vw); max-width:1280px; margin:0 auto;}
.inset {width:80%; margin:0 auto;}
blockquote {font-size:1.35em; margin-bottom:2em; color:#00677F;}
blockquote p:last-child {margin:0;}
em {text-decoration:underline;}
.intro p a {text-decoration:underline; color:#00A9B7;}
.intro p a:hover {text-decoration:underline; color:#00677F;}

/* -- Header -- */
header {position:fixed; top:0; left:0; right:0; background-color:#fff; box-shadow:0 0.1vw 1vw rgba(0,0,0,.1); z-index:999;}
.nav-main {}
.nav-main-wrapper {display:flex; justify-content:space-between; align-items:center; padding:32px 0;}
.nav-main-left {margin-right:5%;}
.header-logo {text-align:center;}
.header-logo img {height:66px; width:auto;}
.header-logo div {font-size:.7em; font-style:italic; white-space:nowrap; color:#777; margin-top:.5em;}
.nav-main-right {display:flex; justify-content:flex-end; align-items:center;}

/* -- Main Content -- */
#main-content {margin-top:130px; position:relative;}

/* -- Navigation -- */
.nav-main #main-menu {display:-webkit-box;display:-ms-flexbox;display:flex; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; list-style:none; font-size:.9em;}
.nav-main #main-menu a {color:#222; text-decoration:none; position:relative; display:inline-block; line-height:1; padding:.5em 0; margin:.5em 0;}
.nav-main #main-menu a:after {content:''; display:block; position:absolute; bottom:0; left:50%; height:2px; width:0; background:transparent; transition: width .2s ease, background-color .2s ease, left .2s ease;}
.nav-main #main-menu a:hover:after {width: 100%; left: 0; background: #00A9B7;}

.nav-main #main-menu > li {margin-right:4em; position:relative;}
.nav-main #main-menu > li:hover .sub-menu {display:-webkit-box;display:-ms-flexbox;display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; position:absolute; left:0;}
.nav-main #main-menu > li:last-child:hover .sub-menu, .nav-main #main-menu > li:nth-last-child(2):hover .sub-menu {left:auto; right:0;}
.nav-main .sub-menu {display:none; list-style:none; background:#fff; padding:1em 2em 1.5em; box-shadow:0 0.1vw 1vw rgba(0,0,0,.35);}
.nav-main .sub-menu li {border-top:1px solid #eee;}
	.nav-main .sub-menu li:first-child {border:none;}
.nav-main .sub-menu a {display:block; white-space:nowrap;}
.nav-main #main-menu li.current-menu-item > a:after, .nav-main #main-menu li.current-page-ancestor > a:after  {width: 100%; left: 0; background: #00A9B7;}
/* Hide Search for now */
.nav-main #main-menu > li:last-child {margin-right:0;}

/* -- Mobile Menu -- */
.mobile-menu {display:block; position:fixed; top:-100%; left:0; right:0; height:calc(100% - 90px); text-align:center; background:#ddd; z-index:99; font-size:1.25em; line-height:1.25; text-transform:uppercase;}
.mobile-menu-wrapper {position:absolute; top:0; left:0; right:0; bottom:0; padding:10vw 0; overflow-y:auto; background-image:url('../images/key-bg-3.png'); background-size:100%;}
.mobile-menu.active {top:90px; -webkit-transition:top .5s ease-in-out; -o-transition:top .5s ease-in-out; transition:top .5s ease-in-out;}
.mobile-menu {list-style:none;}
.mobile-menu a {display:inline-block; margin:.75em .5em;}
.mobile-menu .fa-chevron-down {margin-left:1em; color:#00A9B7;}
.mobile-menu .fa-chevron-down.active {transform:rotate(180deg);}
.mobile-menu li {padding:0 5%;}
.mobile-menu .sub-menu {display:none; list-style:none; background:rgba(255,255,255,.25); padding:.5em 0;}
.mobile-menu li.current-menu-item > a, .mobile-menu li.current-page-ancestor > a  {color:#00A9B7;}
.mobile-contact {margin:3em 0 1em;}
.mobile-contact a {display:block;}
.mobile-email {text-transform:lowercase; font-size:.85em;}
.mobile-phone {font-size:1.2em; letter-spacing:.05em;}

/* -- Feature Animation -- */
.feature {position:relative; width:100%; padding-bottom:47.857142%; height:0; z-index:1; overflow:hidden;}
.overlay {position:absolute; top:0; left:0; right:0; bottom:0; background-color:#00677f; opacity:.7;}
.copy-block {position:absolute; top:0; left:0; right:0; bottom:10vw; z-index: 2; color:#fff; display:flex; justify-content:flex-start; align-items:center;}
.copy-block > div {margin-left:5vw;}
.copy-block h2 {font-family:Merriweather; font-size:3em; font-weight:300; letter-spacing:.05em; margin-bottom:0; text-transform: none;}
	.home .feature h2 {font-family:leander-script-pro; font-weight: 700; font-size:4em; letter-spacing: normal; white-space: nowrap;}
.copy-block h3 {font-family:soleil; font-size:1.75em; font-weight:400; text-transform: none;}
.captions {position:absolute; bottom:0; right:0; transform:rotate(-90deg); background-color:#00263E;}
.anim-text {display:none;}
.button {font-family:soleil; font-size:.85em; font-weight:300; padding:.5em 2em; border:2px solid #fff; border-radius:2em; display:inline-block; margin-top:2em; background-color:transparent; color:#fff !important; transition: background-color .2s;}
.button:hover {background-color:#00A9B7; cursor:pointer; transition: background-color .2s;}
.feature-images {width:100%;}
.feature-images div {position:absolute; top:0; left:0; bottom:0; right:0; width:100%;}
.feature-images div img {width:100%; height:100%; object-fit:cover; opacity:0;}
.slide-overlay {position:absolute; top:0; left:0; right:0; bottom:0; width:100%; height:auto; background-color:#00677f; background-image:url('/wp-content/themes/jaffeblog/images/key-bg.png'); background-repeat:repeat-y; background-size:100%;}

.home .intro-left-content {display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap;}
.home .intro-left-content h2 {font-size:1em; margin-left:5vw; text-transform:none;}
.home .intro-left-content > div:first-child {width:calc(25% - 1.5vw);}
.home .intro-left-content > div:last-child {width:calc(75% - 1.5vw);}
.more-arrow {display:flex; align-items:center;}
.more-arrow i {font-size:1.25em; margin:.2em 0 0 .5em;}

/* -- Page Content -- */
.testimonial-block {margin:5vw 0;}
.fullwidth-image {width:100%; height:28vw; background-color:#444; position:relative;}
	.home .fullwidth-image {width:100%; height:38vw; min-height:232px; background-color:#444;}
.fullwidth-image img {width:100%; height:100%; object-fit:cover;}
.fullwidth-title {position:absolute; top:0; left:0; right:0; bottom:0; display:flex; justify-content:flex-start; align-items:center;}
.fullwidth-title > div {margin-left:5vw;}
.fullwidth-title h2 {font-size:3em; color:#fff;}
.fullwidth-title span {margin-top:1.35em; color:#fff;}
.fullwidth-title span a {color:#fff;}
.fullwidth-title span a:hover {color:#00A9B7; transition:color .2s;}

.testimonial-block {display:flex; justify-content:center; align-items:flex-start; flex-wrap:wrap; margin-left:5vw; margin-right:5vw;}
.testimonial-item {width:calc(50% - 1vw); background-color:#00263E; border-radius:1rem; color:#fff; background-image:url('../images/key-bg-2.png'); background-size:100%; margin:0 1vw 5vw; padding:5vw; box-sizing:border-box; font-size:.85em;}
.testimonial-item.item-video {background-image:none;}
.testimonial-item:nth-child(odd) {margin-left:0;}
.testimonial-item:nth-child(even) {margin-right:0;}
.testimonial-item:nth-last-child(1), .testimonial-item:nth-last-child(2) {margin-bottom:0;}
.testimonial-item > div {display:flex; justify-content:flex-start; align-items:center;}
.testimonial-item p {margin-bottom:1em;}
.testimonial-item img {width:5vw; border-radius:5vw; min-width:3em; margin-right:1em;}
.testimonial-item h4 {font-family:soleil; font-size:.85em; line-height:1.35;}
.testimonial-item h5 {font-family:soleil; font-size:.75em; color:rgba(255,255,255,.75); line-height:1.35;}
.item-video {padding:0; overflow:hidden;}
.video-wrapper {position: relative; width:100%; padding-bottom: 56.25%; height:0; overflow: hidden;}
.video-wrapper iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

/* -- Home -- */
.check-blog {margin:5vw 0;}
.check-blog h2 {margin-bottom:1em; padding-left:35%; color:#00677F;}
.check-blog-wrapper {margin:2.5vw 5vw 0;}
.check-blog-wrapper > div {display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap;}
.check-blog-wrapper > div div {width:30%;}
.check-blog-wrapper img {width:100%; height:auto; border-radius:1vw;}
.check-blog-tip {box-sizing:border-box; padding-left:1.5em; border-left:2px solid #00A9B7;}
.check-blog-tip h4 {font-size:1em; margin-bottom:.5em; color:#9B9B9B;}
.check-blog-tip p {font-size:.75em; margin-bottom:0;}
.check-blog-item h4 {font-family:soleil; font-size:.75em; margin:1em 0; color:#9B9B9B; text-transform:uppercase; letter-spacing:.1em;}
/* .check-blog-item h4 span {margin:0 .5em;} */
.check-blog-item h5 {font-size:1em; color:#00677F;}
.check-blog-item:hover h5 {color:#00A9B7; transition:color .2s;}

/* -- Blog -- */
.blog-block .alm-reveal {margin:0 5vw; display:flex; justify-content:center; align-items:flex-start; flex-wrap:wrap;}
.blog-item {width:calc(33.33% - 1vw); margin-bottom:5em; margin-right:1.5vw; overflow:hidden; text-align:center;}
.blog-item:nth-child(3n+1) {margin-left:0;}
.blog-item:nth-child(3n) {margin-right:0;}
.blog-item img {width:100%; height:auto; border-radius:1rem;}
.blog-item p {margin:1em 0; font-size:.85em; text-transform:uppercase; color:#9B9B9B;}
.blog-item h3 a {color:#00A9B7;}
.alm-btn-wrap {padding-bottom:5vw !important;}
.alm-filters-container .alm-filter li {display:inline-block !important;}
.alm-filters-container .alm-filter li a {font-size:.85rem !important;}
.alm-filters-container .alm-filter ul ul {display: none;}

/* -- Single -- */
.post-block {margin-top:-10vw; border-radius:2vw 2vw 0 0; padding:5vw 15vw; background-color:#fff; position:relative;}
.post-block .blog-category {letter-spacing:.1em; margin-bottom:.5em; text-transform:uppercase; color:#9B9B9B;}
/* .post-block .blog-category span {margin:0 .5em;} */
.post-block h1 {color:#00A9B7;}
.post-block .entry-meta {font-size:.85em; letter-spacing:.1em; margin-bottom:3em; text-transform:uppercase; color:#9B9B9B;}
.post-block .entry-meta span {margin-right:1.5em;}
.blog-nav {display:flex; justify-content:space-between; align-items:flex-start; padding-bottom:2vw; border-bottom:1px solid #9B9B9B;}
.share-link {font-size:1.2em; margin:0 .25em; color:#9B9B9B;}

/* -- Pages -- */
.feature-image {width:100%; height:33vw; background-color:#00677F;}
.feature-image img {width:100%; height:100%; object-fit:cover;}

.intro {display:flex; justify-content:flex-start; align-items:flex-start; flex-wrap:wrap; margin-bottom:5vw; position:relative; z-index:9;}
.intro-left {min-height:12vw; background:#fff; border-radius:0 3.5vw 0 0; margin-top:-10vw; display:flex; justify-content:flex-end; align-items:flex-start; overflow:hidden;}
.intro-right {background:#fff; display:flex; justify-content:flex-start; align-items:flex-start;}
.intro-left-content {box-sizing:border-box; margin:5vw 5vw 0;}
.intro h1 {font-size:1.85em; color:#00677F;}
.intro h2, .intro-nav h2 {font-family:soleil; font-size:.85em; font-weight:700; color:#00263E; text-transform:uppercase; margin-bottom:1em;}
.intro-right-content {box-sizing:border-box; padding:5vw 0 0 0;}
.intro-right-content img {width:100%; height:auto; border-radius:1em; margin-bottom:2.5vw;}

/* -- About -- */
.page-about .intro-left strong {display:inline-block; font-size:1.35em; margin-bottom:.5em;}
.page-about blockquote {text-align:center; padding:2.5em; background-color:#00677F; background-image:url('../images/key-bg.png'); background-size:200%; color:#fff; border-radius:1rem;}

.about-block {margin-top:-8vw; border-radius:2vw 2vw 0 0; padding:5vw; text-align:center; background-color:#fff; position:relative;}
.about-block h2 {font-size:2.25em; color:#00677F;}
.about-block h3 {font-family:soleil; font-size:.85em; color:#00263E; margin:.5em 0 3em;}
.about-map-wrapper {display:flex; justify-content:center; flex-wrap:wrap;}
.about-map-wrapper > div {width:100%; padding-bottom:59.58%; height:0; position:relative; border-radius:1em; overflow:hidden; background-image:url('../images/map.jpg	'); background-size:cover;}
.about-map-wrapper ul {list-style:none; text-align:left; margin:2em 0 0 4em; display:grid;}
.about-map-wrapper li {position:relative; line-height:1.25; margin-top:.5em;}
.about-map-wrapper li span {position:absolute; margin-left:-4em; width:4em;}

.pos-howell {position:absolute; top:31.5%; left:36.5%;}
.pos-london {position:absolute; top:14%; left:85%;}
.pos-paris {position:absolute; top:20%; left:87%;}
.pos-boulder {position:absolute; top:32%; left:15.5%;}
.pos-mclean {position:absolute; top:34.5%; left:34%;}
.pos-cary {position:absolute; top:38%; left:32.5%;}
.pos-charlotte {position:absolute; top:38.5%; left:31%;}
.pos-sunnyvale {position:absolute; top:32.5%; left:3.5%;}

/* -- Contact -- */
.contact-form {margin-top:5vw;}
.page-contact h3 {font-family:soleil; font-size:1em; font-weight:700; color:#00263E; text-transform:capitalize; margin-bottom:1em;}
.google-map {width:100%; padding-bottom:150%; height:0; border-radius:1em; overflow:hidden; position:relative; transform: translateY(0px);}
.google-map iframe {position:absolute; top:0; left:0; width:100%; height:100%;}

/* -- Privacy and Terms -- */
.page-privacy ul, .page-terms ul, .page-privacy ol, .page-terms ol {margin:.5rem 0 2rem 3.25rem;}
.page-privacy ul ul, .page-terms ul ul, .page-privacy ol ol, .page-terms ol ol {margin-left:1.25rem; margin-bottom:1rem;}
.page-privacy ul li, .page-terms ul li, .page-privacy ol li, .page-terms ol li {margin-bottom:1rem;}

.post-block ul, .post-block ol {margin:.5rem 0 2rem 3.25rem;}
.post-block ul ul, .post-block ol ol {margin-left:1.25rem; margin-bottom:1rem;}
.post-block ul li, .post-block ol li {margin-bottom:1rem;}

/* -- Ninja Forms -- */
.nf-after-form-content {margin-left:10px;}
.nf-form-content .list-select-wrap>div div:after {font-size:1.2em !important; color:#29588D !important;}

.nf-form-fields-required, .ninja-forms-req-symbol {display:none;}
.nf-field-container {margin-bottom:15px !important;}

.nf-form-content .list-select-wrap .nf-field-element>div, .nf-form-content input:not([type=button]) {-webkit-appearance:none; -moz-appearance:none; appearance:none !important; height:auto !important; border:1px solid #00263E !important; border-radius:2em !important;}
.nf-form-content textarea {border:1px solid #00263E !important; border-radius:1.5em !important;}

.nf-form-content .listselect-wrap .nf-field-element div, .nf-form-content .ninja-forms-field {font-family:soleil !important; font-size:.85em !important; padding:.5em 20px !important; background-color:transparent !important; color:#00263E !important;}
.field-wrap input[type=button] {height:auto !important; padding:.5em 3em !important; margin-top:.5em !important; border:1px solid #00263E !important; border-radius:2em !important; background:rgba(0, 169, 183, 0) !important; color:#00A9B7 !important; opacity:1 !important;}
.field-wrap input[type=button]:hover {background:rgba(0, 169, 183, 1) !important; color:#fff !important; cursor:pointer !important;}
.nf-response-msg {color:#F08B3C !important;}
.nf-error.field-wrap .nf-field-element:after {display:none;}

/* -- Comments -- */
#wc-comment-header {font-family:soleil, sans-serif; text-transform:none;}

/* -- Footer -- */
#footer {width:100%; background-color:#00677F; color:#fff; background-image:url('../images/key-bg.png'); background-size:100%; background-repeat:repeat-y;}
.footer-top-wrapper {display:flex; justify-content:space-between; align-items:flex-start; font-size:.75em; font-weight:400; padding:3em 0;}
.footer-top h4 {font-family:soleil; font-size:1em; margin-bottom:.5em;}
.footer-top a {color:#fff;}
.footer-top img {width:135px; height:auto; margin-bottom:1em;}
.footer-nav ul {list-style:none;}
.footer-nav li {margin-bottom:1em;}
.footer-nav li:last-child {margin-bottom:0;}
.footer-contact > div {margin-top:2em;}
.footer-contact > div:first-child {margin-top:0;}
.footer-social a {margin-left:.5em;}
.footer-social a:first-child {margin-left:0;}
.footer-bottom {background-color:#00263E; color:#fff; font-size:.75em; font-weight:400; padding:1.5em 0;}
.footer-bottom > div {display:flex; justify-content:space-between; align-items:center;}
.footer-bottom a {color:#fff;}
#footer a:hover {color:#00A9B7;}
.footer-link {margin-left:1em;}

/* -- Sweet Alert -- */
.swal2-styled.swal2-confirm {background-color:#00677F;}

/* -- Hamburger -- */
.hamburger {
  padding: 15px 0;
  display: none;
  cursor: pointer;
  -webkit-transition-property: opacity, -webkit-filter;
  transition-property: opacity, -webkit-filter;
  -o-transition-property: opacity, filter;
  transition-property: opacity, filter;
  transition-property: opacity, filter, -webkit-filter;
  -webkit-transition-duration: 0.15s;
          -o-transition-duration: 0.15s;
     transition-duration: 0.15s;
  -webkit-transition-timing-function: linear;
          -o-transition-timing-function: linear;
     transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0 0 0 2.5em;
  overflow: visible; }

.hamburger:hover .hamburger-inner, .hamburger:hover .hamburger-inner::before, .hamburger:hover .hamburger-inner::after {
    background-color: #00A9B7; transition: .2s ease;}

.hamburger-box {
  width: 25px;
  height: 20px;
  display: block;
  position: relative; }

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -2px; }
  .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 25px;
    height: 3px;
    background-color: #222;
    border-radius: 0px;
    position: absolute;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-transition-duration: 0.15s;
            -o-transition-duration: 0.15s;
       transition-duration: 0.15s;
    -webkit-transition-timing-function: ease;
            -o-transition-timing-function: ease;
       transition-timing-function: ease; }
  .hamburger-inner::before, .hamburger-inner::after {
    content: "";
    display: block; }
  .hamburger-inner::before {
    top: -8px; }
  .hamburger-inner::after {
    bottom: -8px; }
    
/* Spin */
.hamburger--spin .hamburger-inner {
  -webkit-transition-duration: 0.3s;
          -o-transition-duration: 0.3s;
     transition-duration: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
          -o-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
     transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--spin .hamburger-inner::before {
    -webkit-transition: top 0.1s 0.34s ease-in, opacity 0.1s ease-in;
    -o-transition: top 0.1s 0.34s ease-in, opacity 0.1s ease-in;
    transition: top 0.1s 0.34s ease-in, opacity 0.1s ease-in; }
  .hamburger--spin .hamburger-inner::after {
    -webkit-transition: bottom 0.1s 0.34s ease-in, -webkit-transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.34s ease-in, -webkit-transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    -o-transition: bottom 0.1s 0.34s ease-in, transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.34s ease-in, transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.34s ease-in, transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--spin.active .hamburger-inner {
	background: #00A9B7;
  -webkit-transform:rotate(225deg); -ms-transform:rotate(225deg); transform:rotate(225deg);
  -webkit-transition-delay: 0.14s;
          -o-transition-delay: 0.14s;
     transition-delay: 0.14s;
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
          -o-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
     transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--spin.active .hamburger-inner::before {
	background: #00A9B7;
    top: 0;
    opacity: 0;
    -webkit-transition: top 0.1s ease-out, opacity 0.1s 0.14s ease-out;
    -o-transition: top 0.1s ease-out, opacity 0.1s 0.14s ease-out;
    transition: top 0.1s ease-out, opacity 0.1s 0.14s ease-out; }
  .hamburger--spin.active .hamburger-inner::after {
	background: #00A9B7;  
    bottom: 0;
    -webkit-transform:rotate(-90deg); -ms-transform:rotate(-90deg); transform:rotate(-90deg);
    -webkit-transition: bottom 0.1s ease-out, -webkit-transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease-out, -webkit-transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: bottom 0.1s ease-out, transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease-out, transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease-out, transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1); }

/* Spin Reverse */
.hamburger--spin-r .hamburger-inner {
  -webkit-transition-duration: 0.3s;
          -o-transition-duration: 0.3s;
     transition-duration: 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
          -o-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
     transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--spin-r .hamburger-inner::before {
    -webkit-transition: top 0.1s 0.34s ease-in, opacity 0.1s ease-in;
    -o-transition: top 0.1s 0.34s ease-in, opacity 0.1s ease-in;
    transition: top 0.1s 0.34s ease-in, opacity 0.1s ease-in; }
  .hamburger--spin-r .hamburger-inner::after {
    -webkit-transition: bottom 0.1s 0.34s ease-in, -webkit-transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.34s ease-in, -webkit-transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    -o-transition: bottom 0.1s 0.34s ease-in, transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.34s ease-in, transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19);
    transition: bottom 0.1s 0.34s ease-in, transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.3s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--spin-r.active .hamburger-inner {
  -webkit-transform:rotate(-225deg); -ms-transform:rotate(-225deg); transform:rotate(-225deg);
  -webkit-transition-delay: 0.14s;
          -o-transition-delay: 0.14s;
     transition-delay: 0.14s;
  -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
          -o-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
     transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--spin-r.active .hamburger-inner::before {
    top: 0;
    opacity: 0;
    -webkit-transition: top 0.1s ease-out, opacity 0.1s 0.14s ease-out;
    -o-transition: top 0.1s ease-out, opacity 0.1s 0.14s ease-out;
    transition: top 0.1s ease-out, opacity 0.1s 0.14s ease-out; }
  .hamburger--spin-r.active .hamburger-inner::after {
    bottom: 0;
    -webkit-transform:rotate(90deg); -ms-transform:rotate(90deg); transform:rotate(90deg);
    -webkit-transition: bottom 0.1s ease-out, -webkit-transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease-out, -webkit-transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);
    -o-transition: bottom 0.1s ease-out, transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease-out, transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: bottom 0.1s ease-out, transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.3s 0.14s cubic-bezier(0.215, 0.61, 0.355, 1); }