After gatsby build, we still see only chunked js in the html and not the full content

[mageshpurpleslate]

We have built a website using gatsby and strapi. It has a monthly hit of close to 2 million page views and a monthly average of 700k users. We have been recently hit with performance issues and when we looked in detail the server side rendering not happening.

During build, we do see the path getting split and index.html being generated for each path. In that html, we see the js and css and being included as well. However, actual content is being rendered only during run time.

Below is the gatsby-config.js

let activeEnv =
  process.env.GATSBY_ACTIVE_ENV || process.env.NODE_ENV || `development`;

console.log(`GATSBY_ACTIVE_ENV: ${process.env.GATSBY_ACTIVE_ENV}`);
console.log(`NODE_ENV: ${process.env.NODE_ENV}`);
console.log(`Using environment config: '${activeEnv}'`);

require(`dotenv`).config({
  path: `.env.${activeEnv}`,
});
console.log(`BASE_URL: ${process.env.BASE_URL}`);
console.log(`API_URL: ${process.env.API_URL}`);
console.log(`GOOGLE_KEY: ${process.env.GOOGLE_KEY}`);
// var proxy = require("http-proxy-middleware")

const robots_txt_policy =
  process.env.BASE_URL == `https://www.starhealth.in/`
    ? [{ userAgent: `*`, allow: `/` }]
    : [{ userAgent: `*`, disallow: `/` }];

module.exports = {
  siteMetadata: {
    title: `My website`,
    description: `My website using Gatsy and Strapi`,
    author: `ps`,
    siteUrl: process.env.BASE_URL,
  },
  pathPrefix: `/starhealth`,
  plugins: [
    {
      resolve: `gatsby-plugin-html-attributes`,
      options: {
        lang: `en`,
      },
    },
    `gatsby-plugin-react-helmet`,
    `gatsby-plugin-sass`,
    `gatsby-plugin-resolve-src`,
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `images`,
        path: `${__dirname}/src/images`,
      },
    },
    {
      resolve: `gatsby-source-strapi`,
      options: {
        apiURL: `http://localhost:1337`,
        contentTypes: [
          // List of the Content Types you want to be able to request from Gatsby.
          `categories`,
          `sections`,
          `plans`,
          `links`,
          `organizations`,
          `keyfeatures`,
          `faqs`,
          `contacts`,
          `entities`,
          `sections`,
          `documents`,
          `images`,
          `tables`,
        ],
        queryLimit: 1000,
      },
    },
    `gatsby-transformer-sharp`,
    `gatsby-plugin-sharp`,
    {
      resolve: `gatsby-plugin-manifest`,
      options: {
        name: `gatsby-starter-default`,
        short_name: `starter`,
        start_url: `/`,
        background_color: `#35488a`,
        theme_color: `#35488a`,
        display: `minimal-ui`,
        icon: `src/images/my-icon.png`, // This path is relative to the root of the site.
      },
    },
    {
      resolve: `gatsby-plugin-google-tagmanager`,
      options: {
        id: `XXXXXX`,
        includeInDevelopment: true,
      },
    },
    {
      resolve: `gatsby-plugin-nprogress`,
      options: {
        showSpinner: true,
      },
    },
    {
      resolve: `gatsby-plugin-sitemap`,
      options: {
        output: `/sitemap.xml`,
        exclude: [`/withdrawn-products/*`],
        query: `
        {
          site {
            siteMetadata {
              siteUrl
            }
          }

          allSitePage {
            edges {
              node {
                path
              }
            }
          }
      }`,
      },
    },
    {
      resolve: `gatsby-plugin-robots-txt`,
      options: {
        host: process.env.BASE_URL,
        sitemap: `${process.env.BASE_URL}sitemap.xml`,
        policy: robots_txt_policy,
      },
      output: `/robots.txt`,
    },
    {
      resolve: `gatsby-plugin-web-font-loader`,
      options: {
        google: {
          families: [`Roboto`, `Roboto Slab`],
        },
      },
    },
    {
      resolve: `gatsby-plugin-offline`,
      options: {
        runtimeCaching: [
          {
            // Use networkFirst since these shouldn't be cached
            urlPattern: /^[^.]*(\.html)?$/,
            handler: `networkFirst`,
          },
          {
            // Use cacheFirst since these don't need to be revalidated (same RegExp
            // and same reason as above)
            urlPattern: /(\.js$|\.css$|static\/)/,
            handler: `cacheFirst`,
          },
          {
            // Add runtime caching of various other page resources
            urlPattern: /^https?:.*\.(png|jpg|jpeg|webp|svg|gif|tiff|js|woff|woff2|json|css)$/,
            handler: `staleWhileRevalidate`,
          },
          {
            // Google Fonts CSS (doesn't end in .css so we need to specify it)
            urlPattern: /^https?:\/\/fonts\.googleapis\.com\/css/,
            handler: `staleWhileRevalidate`,
          },
        ],
      },
    },
  ],
};

Below is the gatsby-ssr.js

import React from "react";
import postcss from "postcss";
import autoprefixer from "autoprefixer";
import CleanCSS from "clean-css";
import withRoot from "./src/withRoot";

// Keep track of sheets for each page
const globalLeak = new Map();

const prefixer = postcss([autoprefixer]);
const cleanCSS = new CleanCSS();

const defaultOptions = {
  disableAutoprefixing: false,
  disableMinification: false,
};

const widgetcode = `xxxx`; //Insert your salesiq widget code here.
const src = `https://salesiq.zoho.in/widget`;

export const wrapRootElement = withRoot;

export const onRenderBody = (
  { setHeadComponents, setPostBodyComponents, pathname },
  pluginOptions
) => {
  const sheets = globalLeak.get(pathname);
  if (sheets) {
    const { disableAutoprefixing, disableMinification } = {
      ...defaultOptions,
      ...pluginOptions,
    };
    let css = sheets.toString();
    css = disableAutoprefixing
      ? css
      : prefixer.process(css, { from: undefined }).css;
    css = disableMinification ? css : cleanCSS.minify(css).styles;
    setHeadComponents([
      <style
        id="jss-server-side"
        key="jss-server-side"
        dangerouslySetInnerHTML={{ __html: css }}
      />,
    ]);

    globalLeak.delete(pathname);
  }
  if (process.env.BASE_URL !== `https://www.starhealth.in/`) {
    setPostBodyComponents([
      <script
        key="zoho-sales-Iq"
        type="text/javascript"
        dangerouslySetInnerHTML={{
          __html: `var $zoho = $zoho || {};
        var obj = {widgetcode:"${widgetcode}", values:{},ready:function(){}};
        $zoho.salesiq = $zoho.salesiq || obj
        var d = document;
        s = d.createElement("script");
        s.type = "text/javascript";
        s.id = "zsiqscript";
        s.defer = true;
        s.src = "${src}";
        t = d.getElementsByTagName("script")[0];
        t.parentNode.insertBefore(s, t);
        d.write("<div id='zsiqwidget'></div>");`,
        }}
      />, //Injecting SalesIq Script on body of the page
    ]);
  }
};

below is the index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="x-ua-compatible" content="ie=edge" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, shrink-to-fit=no"
    />
    <style data-href="/styles.b02d769850ac045a4877.css">
      @charset "UTF-8";
      .layout > div {
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-flex-direction: column;
        flex-direction: column;
        margin-bottom: 20px;
      }
      .expander {
        margin: 10px;
        border: 1px solid #eee;
        padding: 5px 0;
      }
      .expander > span > button {
        background: none;
        border: none;
      }
      .expander > span.label {
        display: inline-block;
        line-height: 28px;
        vertical-align: text-bottom;
        margin-right: 10px;
      }
      .expander > div.content {
        padding-left: 40px;
        padding-bottom: 20px;
      }

      /*!
 * https://github.com/YouCanBookMe/react-datetime
 */
      .rdtPicker {
        width: 250px;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
        border: 1px solid #f9f9f9;
      }
      .rdtOpen .rdtPicker {
        display: block;
      }
      .rdtPicker td,
      .rdtPicker th {
        height: 28px;
      }
      .rdtPicker td.rdtNew,
      .rdtPicker td.rdtOld {
        color: #999;
      }
      .rdtPicker td.rdtToday:before {
        content: "";
        display: inline-block;
        border-left: 7px solid transparent;
        border-bottom: 7px solid #428bca;
        border-top-color: rgba(0, 0, 0, 0.2);
        position: absolute;
        bottom: 4px;
        right: 4px;
      }
      .rdtPicker td.rdtActive,
      .rdtPicker td.rdtActive:hover {
        background-color: #428bca;
        color: #fff;
        text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
      }
      .rdtPicker th {
        border-bottom: 1px solid #f9f9f9;
      }
      .rdtPicker .dow {
        cursor: default;
      }
      .rdtPicker th.rdtSwitch {
        width: 100px;
      }
      .rdtPicker tfoot {
        border-top: 1px solid #f9f9f9;
      }
      .rdtCounter .rdtBtn {
        height: 40%;
      }
      .rdtCounter .rdtCount {
        height: 20%;
        font-size: 1.2em;
      }
      .rdtMilli input {
        font-size: 1.2em;
      }
      .rdtTime td {
        cursor: default;
      }

      /*! * https://github.com/YouCanBookMe/react-datetime */
      .rdt input.form-control {
        background-image: linear-gradient(#3f51b5, #3f51b5),
          linear-gradient(#d2d2d2, #d2d2d2);
      }
      .rdt input.form-control:focus {
        background-image: linear-gradient(#3f51b5, #3f51b5),
          linear-gradient(#d2d2d2, #d2d2d2);
      }
      .rdtDay.rdtActive,
      .rdtDay.rdtActive:hover,
      .rdtDay.rdtToday.rdtActive {
        background-color: #3f51b5 !important;
        box-shadow: 0 5px 20px 0 rgba(0, 0, 0, 0.2),
          0 13px 24px -11px rgba(63, 81, 181, 0.6);
      }
      .rdtPicker td.rdtDisabled,
      .rdtPicker td.rdtDisabled:hover {
        color: #999;
      }
      .rdtPicker td span.rdtDisabled,
      .rdtPicker td span.rdtDisabled:hover {
        color: #999;
      }
      .rdtPicker .rdtTime th.rdtSwitch,
      .rdtPicker .rdtTimeToggle {
        color: #3f51b5;
      }
      .rdtPicker th.rdtDisabled,
      .rdtPicker th.rdtDisabled:hover {
        color: #999;
      }
      .rdtCounters .rdtCounter:last-child .rdtCount {
        color: #3f51b5;
        border: 1px solid #3f51b5;
      }
      .rdtCounter .rdtBtn {
        color: #3f51b5;
      }
      .rdtMonths .rdtMonth.rdtActive,
      .rdtMonths .rdtYear.rdtActive,
      .rdtYears .rdtMonth.rdtActive,
      .rdtYears .rdtYear.rdtActive {
        background-color: #3f51b5 !important;
      }
      /*! =========================================================
 *
 * Material Kit React v1.3.0 based on Material Kit Free - v2.0.2 (Bootstrap 4.0.0 Final Edition)
 *
 * =========================================================
 *
 * Product Page: https://www.creative-tim.com/product/material-kit-pro
 * Available with purchase of license from https://www.creative-tim.com/product/material-kit-pro
 * Copyright 2018 Creative Tim (https://www.creative-tim.com)
 * License Creative Tim (https://www.creative-tim.com/license)
 *
 * ========================================================= */
      body {
        color: #3c4858 !important;
      }
      .at-about-fab__thumbnail {
        z-index: 9999;
        width: 80px;
        height: 80px;
      }

      /*! nouislider - 11.1.0 - 2018-04-02 11:18:13 */

      /*!
* https://github.com/YouCanBookMe/react-datetime
*/

      /*!
  Ionicons, v2.0.0
  Created by Ben Sperry for the Ionic Framework, http://ionicons.com/
  https://twitter.com/benjsperry  https://twitter.com/ionicframework
  MIT License: https://github.com/driftyco/ionicons

  Android-style icons originally built by Google’s
  Material Design Icons: https://github.com/google/material-design-icons
  used under CC BY http://creativecommons.org/licenses/by/4.0/
  Modified icons to fit ionicon’s grid from original.
*/
      /*! =========================================================
 *
 * Material Kit React v1.3.0 based on Material Kit Free - v2.0.2 (Bootstrap 4.0.0 Final Edition)
 *
 * =========================================================
 *
 * Product Page: https://www.creative-tim.com/product/material-kit-pro
 * Available with purchase of license from https://www.creative-tim.com/product/material-kit-pro
 * Copyright 2018 Creative Tim (https://www.creative-tim.com)
 * License Creative Tim (https://www.creative-tim.com/license)
 *
 * ========================================================= */
      .btn-file {
        position: relative;
        overflow: hidden;
        vertical-align: middle;
      }
      .btn-file > input {
        position: absolute;
        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
        margin: 0;
        font-size: 23px;
        cursor: pointer;
        filter: alpha(opacity=0);
        opacity: 0;
        direction: ltr;
      }
      .fileinput {
        text-align: center;
        display: inline-block;
        margin-bottom: 9px;
      }
      .fileinput input[type="file"] {
        display: none;
      }
      .fileinput .form-control {
        display: inline-block;
        padding-top: 7px;
        padding-bottom: 5px;
        margin-bottom: 0;
        vertical-align: middle;
        cursor: text;
      }
      .fileinput .thumbnail {
        display: inline-block;
        margin-bottom: 10px;
        overflow: hidden;
        text-align: center;
        vertical-align: middle;
        max-width: 360px;
        box-shadow: 0 5px 15px -8px rgba(0, 0, 0, 0.24),
          0 8px 10px -5px rgba(0, 0, 0, 0.2);
      }
      .fileinput .thumbnail.img-circle {
        border-radius: 50%;
        max-width: 100px;
      }
      .fileinput .thumbnail > img {
        max-height: 100%;
        width: 100%;
      }
      .fileinput .btn {
        vertical-align: middle;
      }
      .fileinput-exists .fileinput-new,
      .fileinput-new .fileinput-exists {
        display: none;
      }
      .fileinput-inline .fileinput-controls {
        display: inline;
      }
      .fileinput-filename {
        display: inline-block;
        overflow: hidden;
        vertical-align: middle;
      }
      .form-control .fileinput-filename {
        vertical-align: bottom;
      }
      .fileinput.input-group {
        display: table;
      }
      .fileinput.input-group > * {
        position: relative;
        z-index: 2;
      }
      .fileinput.input-group > .btn-file {
        z-index: 1;
      }
      .fileinput-new.input-group .btn-file,
      .fileinput-new .input-group .btn-file {
        border-radius: 0 4px 4px 0;
      }
      .fileinput-new.input-group .btn-file.btn-sm,
      .fileinput-new .input-group .btn-file.btn-sm,
      .fileinput-new.input-group .btn-file.btn-xs,
      .fileinput-new .input-group .btn-file.btn-xs {
        border-radius: 0 3px 3px 0;
      }
      .fileinput-new.input-group .btn-file.btn-lg,
      .fileinput-new .input-group .btn-file.btn-lg {
        border-radius: 0 6px 6px 0;
      }
      .form-group.has-warning .fileinput .fileinput-preview {
        color: #ff9800;
      }
      .form-group.has-warning .fileinput .thumbnail {
        border-color: #ff9800;
      }
      .form-group.has-error .fileinput .fileinput-preview {
        color: #f44336;
      }
      .form-group.has-error .fileinput .thumbnail {
        border-color: #f44336;
      }
      .form-group.has-success .fileinput .fileinput-preview {
        color: #4caf50;
      }
      .form-group.has-success .fileinput .thumbnail {
        border-color: #4caf50;
      }
      .input-group-addon:not(:first-child) {
        border-left: 0;
      }
      .thumbnail {
        border: 0;
        border-radius: 0;
        padding: 0;
      }
      html * {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
      }
      body {
        overflow-x: hidden;
      }
      body,
      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        font-family: Roboto, Helvetica, Arial, sans-serif;
        font-weight: 300;
        line-height: 1.5em;
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        color: inherit;
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        margin-top: 10px;
        margin-bottom: 10px;
      }
      h1 {
        font-size: 4.3125rem;
        line-height: 1.15em;
      }
      h2 {
        font-size: 2.25rem;
        line-height: 1.5em;
      }
      h3 {
        font-size: 1.5625rem;
        line-height: 1.4em;
      }
      h4 {
        font-size: 1.125rem;
        line-height: 1.5em;
      }
      h5 {
        font-size: 1.0625rem;
        line-height: 1.55em;
      }
      h6 {
        font-size: 0.75rem;
        text-transform: uppercase;
        font-weight: 500;
      }
      p {
        font-size: 14px;
        margin: 0 0 10px;
      }
      b,
      strong {
        font-weight: 700;
      }
      html {
        font-family: sans-serif;
        line-height: 1.15;
        -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
        -ms-overflow-style: scrollbar;
        -webkit-tap-highlight-color: transparent;
      }
      body {
        background-color: #eee;
        color: #3c4858;
        font-size: 1rem;
        text-align: left;
      }
      legend {
        border-bottom: 0;
      }
      * {
        -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
        -webkit-tap-highlight-color: transparent;
        box-sizing: border-box;
      }
      :focus {
        outline: 0;
      }
      a {
        color: #35488a;
        text-decoration: none;
        background-color: transparent;
      }
      a:focus,
      a:hover {
        color: #2e3e78;
        text-decoration: none;
      }
      label {
        font-size: 14px;
        line-height: 1.42857;
        color: #aaa;
      }
      label,
      small {
        font-weight: 400;
      }
      small {
        font-size: 75%;
        color: #777;
      }
      img {
        vertical-align: middle;
        border-style: none;
      }
      form {
        margin-bottom: 1.125rem;
      }
      hr {
        margin-top: 1rem;
        border: 0;
        border-top: 1px solid rgba(0, 0, 0, 0.1);
        box-sizing: content-box;
        height: 0;
        overflow: visible;
      }
      dl,
      hr,
      ol,
      ul {
        margin-bottom: 1rem;
      }
      dl,
      ol,
      ul {
        margin-top: 0;
      }
      #images h4 {
        margin-bottom: 30px;
      }
      #root {
        overflow: hidden;
      }
      #cd-vertical-nav {
        position: fixed;
        right: -78px;
        top: 50%;
        bottom: auto;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        z-index: 4;
      }
      #cd-vertical-nav ul {
        list-style: none;
        padding: 0;
      }
      #cd-vertical-nav li {
        text-align: right;
      }
      #cd-vertical-nav a {
        display: inline-block;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        width: 100%;
      }
      #cd-vertical-nav a.is-selected .cd-dot,
      #cd-vertical-nav a:hover span {
        -webkit-transform: scale(1);
        transform: scale(1);
      }
      #cd-vertical-nav .cd-dot {
        position: relative;
        top: 8px;
        right: calc(100% - 15px);
        height: 10px;
        width: 10px;
        border-radius: 50%;
        background-color: #995581;
        transition: background-color 0.5s, -webkit-transform 0.2s;
        transition: transform 0.2s, background-color 0.5s;
        transition: transform 0.2s, background-color 0.5s,
          -webkit-transform 0.2s;
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
      }
      #cd-vertical-nav a span {
        float: right;
        display: inline-block;
        -webkit-transform: scale(0.6);
        transform: scale(0.6);
      }
      #cd-vertical-nav .cd-label {
        position: relative;
        margin-right: 10px;
        padding: 4px 14px;
        color: #fff;
        background: rgba(0, 0, 0, 0.53);
        font-size: 10px;
        border-radius: 20px;
        text-transform: uppercase;
        font-weight: 600;
        opacity: 0;
        -webkit-transform-origin: 100% 50%;
        transform-origin: 100% 50%;
      }
      #cd-vertical-nav a:after {
        content: "";
        display: table;
        clear: both;
      }
      #cd-vertical-nav a:hover .cd-label {
        opacity: 1;
        left: -100%;
        transition: opacity 0.2s, -webkit-transform 0.2s;
        transition: transform 0.2s, opacity 0.2s;
        transition: transform 0.2s, opacity 0.2s, -webkit-transform 0.2s;
      }
      #main-panel {
        display: -webkit-flex;
        display: flex;
        -webkit-flex-direction: row;
        flex-direction: row;
        width: 100%;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
      }
      #main-panel .layout {
        margin-right: 40px;
        width: 43%;
      }
      @media (max-width: 1150px) {
        #main-panel .layout {
          margin-right: 0;
          width: 100%;
        }
      }
      #main-panel .layout > div {
        width: 100%;
      }
      .at-about-fab__thumbnail {
        z-index: 99999;
        position: fixed;
        overflow: hidden;
        cursor: pointer;
        right: 1.3em;
        bottom: 1em;
        padding: 5px;
      }
      .at-about-fab__thumbnail:hover {
        -webkit-animation: shake 0.5s;
        animation: shake 0.5s;
      }
      .at-about-fab__thumbnail_feedBack {
        -webkit-animation: shake 0.5s;
        animation: shake 0.5s;
      }
      @-webkit-keyframes shake {
        0% {
          -webkit-transform: translate(1px, 1px) rotate(0deg);
          transform: translate(1px, 1px) rotate(0deg);
        }
        10% {
          -webkit-transform: translate(-1px, -2px) rotate(-1deg);
          transform: translate(-1px, -2px) rotate(-1deg);
        }
        20% {
          -webkit-transform: translate(-3px) rotate(1deg);
          transform: translate(-3px) rotate(1deg);
        }
        30% {
          -webkit-transform: translate(3px, 2px) rotate(0deg);
          transform: translate(3px, 2px) rotate(0deg);
        }
        40% {
          -webkit-transform: translate(1px, -1px) rotate(1deg);
          transform: translate(1px, -1px) rotate(1deg);
        }
        50% {
          -webkit-transform: translate(-1px, 2px) rotate(-1deg);
          transform: translate(-1px, 2px) rotate(-1deg);
        }
        60% {
          -webkit-transform: translate(-3px, 1px) rotate(0deg);
          transform: translate(-3px, 1px) rotate(0deg);
        }
        70% {
          -webkit-transform: translate(3px, 1px) rotate(-1deg);
          transform: translate(3px, 1px) rotate(-1deg);
        }
        80% {
          -webkit-transform: translate(-1px, -1px) rotate(1deg);
          transform: translate(-1px, -1px) rotate(1deg);
        }
        90% {
          -webkit-transform: translate(1px, 2px) rotate(0deg);
          transform: translate(1px, 2px) rotate(0deg);
        }
        to {
          -webkit-transform: translate(1px, -2px) rotate(-1deg);
          transform: translate(1px, -2px) rotate(-1deg);
        }
      }
      @keyframes shake {
        0% {
          -webkit-transform: translate(1px, 1px) rotate(0deg);
          transform: translate(1px, 1px) rotate(0deg);
        }
        10% {
          -webkit-transform: translate(-1px, -2px) rotate(-1deg);
          transform: translate(-1px, -2px) rotate(-1deg);
        }
        20% {
          -webkit-transform: translate(-3px) rotate(1deg);
          transform: translate(-3px) rotate(1deg);
        }
        30% {
          -webkit-transform: translate(3px, 2px) rotate(0deg);
          transform: translate(3px, 2px) rotate(0deg);
        }
        40% {
          -webkit-transform: translate(1px, -1px) rotate(1deg);
          transform: translate(1px, -1px) rotate(1deg);
        }
        50% {
          -webkit-transform: translate(-1px, 2px) rotate(-1deg);
          transform: translate(-1px, 2px) rotate(-1deg);
        }
        60% {
          -webkit-transform: translate(-3px, 1px) rotate(0deg);
          transform: translate(-3px, 1px) rotate(0deg);
        }
        70% {
          -webkit-transform: translate(3px, 1px) rotate(-1deg);
          transform: translate(3px, 1px) rotate(-1deg);
        }
        80% {
          -webkit-transform: translate(-1px, -1px) rotate(1deg);
          transform: translate(-1px, -1px) rotate(1deg);
        }
        90% {
          -webkit-transform: translate(1px, 2px) rotate(0deg);
          transform: translate(1px, 2px) rotate(0deg);
        }
        to {
          -webkit-transform: translate(1px, -2px) rotate(-1deg);
          transform: translate(1px, -2px) rotate(-1deg);
        }
      }
      .at-about-fab__thumbnail img {
        display: block;
        width: 100%;
      }
      .wrap {
        display: block;
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
        transition: all 0.5s;
        visibility: hidden;
      }
      .wrap .content {
        opacity: 0;
      }
      .wrap:before {
        transition: all 2s cubic-bezier(0.215, 0.61, 0.355, 1);
      }
      .wrap.active {
        display: block;
        visibility: visible;
        box-shadow: 2px 3px 16px silver;
        transition: all 2s;
        -webkit-transform: translateY(30px);
        transform: translateY(30px);
        transition: all 0.5s;
      }
      .wrap.active:before {
        display: block;
        transition: all 1ms cubic-bezier(0.215, 0.61, 0.355, 1);
      }
      .wrap.active .content {
        z-index: 1;
        opacity: 1;
        transition: all 2s cubic-bezier(0.55, 0.055, 0.675, 0.19);
      }
      .remy.active {
        bottom: 3.4em;
      }
      .remy.active,
      .remy.active iframe {
        border-radius: 10px;
      }
      .remy {
        position: fixed;
        right: 1.7em;
        z-index: 99999 !important;
        bottom: 9.5em;
      }
      .not-found {
        height: 100%;
        width: 100%;
        display: -webkit-flex;
        display: flex;
        -webkit-align-items: center;
        align-items: center;
        -webkit-justify-content: center;
        justify-content: center;
      }
      .hide {
        display: none;
      }

      /*! nouislider - 11.1.0 - 2018-04-02 11:18:13 */
      .noUi-target,
      .noUi-target * {
        -webkit-touch-callout: none;
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
        -webkit-user-select: none;
        touch-action: none;
        -ms-user-select: none;
        -moz-user-select: none;
        user-select: none;
        box-sizing: border-box;
      }
      .noUi-target {
        position: relative;
        direction: ltr;
      }
      .noUi-base,
      .noUi-connects {
        width: 100%;
        height: 100%;
        position: relative;
        z-index: 1;
      }
      .noUi-connects {
        overflow: hidden;
        z-index: 0;
      }
      .noUi-connect,
      .noUi-origin {
        will-change: transform;
        position: absolute;
        z-index: 1;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
      }
      html:not([dir="rtl"]) .noUi-horizontal .noUi-origin {
        left: auto;
        right: 0;
      }
      .noUi-vertical .noUi-origin {
        width: 0;
      }
      .noUi-horizontal .noUi-origin {
        height: 0;
      }
      .noUi-handle {
        position: absolute;
      }
      .noUi-state-tap .noUi-connect,
      .noUi-state-tap .noUi-origin {
        transition: -webkit-transform 0.3s;
        transition: transform 0.3s;
        transition: transform 0.3s, -webkit-transform 0.3s;
      }
      .noUi-state-drag * {
        cursor: inherit !important;
      }
      .noUi-horizontal {
        height: 2px;
        margin: 15px 0;
      }
      .noUi-horizontal .noUi-handle {
        box-sizing: border-box;
        width: 14px;
        height: 14px;
        left: -10px;
        top: -6px;
        cursor: pointer;
        border-radius: 100%;
        transition: all 0.2s ease-out;
        border: 1px solid #35488a;
        background: #fff;
        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14),
          0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
      }
      .noUi-vertical {
        width: 2px;
        margin: 0 15px;
        height: 100%;
      }
      .noUi-vertical .noUi-handle {
        box-sizing: border-box;
        width: 14px;
        height: 14px;
        left: -6px;
        top: -10px;
        cursor: pointer;
        border-radius: 100%;
        transition: all 0.2s ease-out;
        border: 1px solid #35488a;
        background: #fff;
        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14),
          0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
      }
      html:not([dir="rtl"]) .noUi-horizontal .noUi-handle {
        right: -4px;
        left: auto;
      }
      .noUi-target {
        background-color: #c8c8c8;
      }
      .noUi-connect,
      .noUi-connects,
      .noUi-target {
        border-radius: 3px;
      }
      .noUi-connect {
        background: #888;
        transition: background 0.45s;
      }
      .noUi-draggable {
        cursor: ew-resize;
      }
      .noUi-vertical .noUi-draggable {
        cursor: ns-resize;
      }
      .noUi-handle {
        border-radius: 3px;
        background: #fff;
        cursor: default;
        box-shadow: inset 0 0 1px #fff, inset 0 1px 7px #ebebeb,
          0 3px 6px -3px #bbb;
        -webkit-transition: 0.3s ease 0s;
        -moz-transition: 0.3s ease 0s;
        -ms-transition: 0.3s ease 0s;
        -o-transform: 0.3s ease 0s;
        transition: 0.3s ease 0s;
      }
      .noUi-handle:focus {
        outline: none;
      }
      .noUi-active {
        box-shadow: inset 0 0 1px #fff, inset 0 1px 7px #ddd,
          0 3px 6px -3px #bbb;
      }
      [disabled] .noUi-connect {
        background: #b8b8b8;
      }
      [disabled].noUi-handle,
      [disabled] .noUi-handle,
      [disabled].noUi-target {
        cursor: not-allowed;
      }
      .noUi-pips,
      .noUi-pips * {
        box-sizing: border-box;
      }
      .noUi-pips {
        position: absolute;
        color: #999;
      }
      .noUi-value {
        position: absolute;
        white-space: nowrap;
        text-align: center;
      }
      .noUi-value-sub {
        color: #ccc;
        font-size: 10px;
      }
      .noUi-marker {
        position: absolute;
        background: #ccc;
      }
      .noUi-marker-large,
      .noUi-marker-sub {
        background: #aaa;
      }
      .noUi-pips-horizontal {
        padding: 10px 0;
        height: 80px;
        top: 100%;
        left: 0;
        width: 100%;
      }
      .noUi-value-horizontal {
        -webkit-transform: translate(-50%, 50%);
        transform: translate(-50%, 50%);
      }
      .noUi-rtl .noUi-value-horizontal {
        -webkit-transform: translate(50%, 50%);
        transform: translate(50%, 50%);
      }
      .noUi-marker-horizontal.noUi-marker {
        margin-left: -1px;
        width: 2px;
        height: 5px;
      }
      .noUi-marker-horizontal.noUi-marker-sub {
        height: 10px;
      }
      .noUi-marker-horizontal.noUi-marker-large {
        height: 15px;
      }
      .noUi-pips-vertical {
        padding: 0 10px;
        height: 100%;
        top: 0;
        left: 100%;
      }
      .noUi-value-vertical {
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        padding-left: 25px;
      }
      .noUi-rtl .noUi-value-vertical {
        -webkit-transform: translateY(50%);
        transform: translateY(50%);
      }
      .noUi-marker-vertical.noUi-marker {
        width: 5px;
        height: 2px;
        margin-top: -1px;
      }
      .noUi-marker-vertical.noUi-marker-sub {
        width: 10px;
      }
      .noUi-marker-vertical.noUi-marker-large {
        width: 15px;
      }
      .noUi-tooltip {
        display: block;
        position: absolute;
        border: 1px solid #d9d9d9;
        border-radius: 3px;
        background: #fff;
        color: #000;
        padding: 5px;
        text-align: center;
        white-space: nowrap;
      }
      .noUi-horizontal .noUi-tooltip {
        -webkit-transform: translate(-50%);
        transform: translate(-50%);
        left: 50%;
        bottom: 120%;
      }
      .noUi-vertical .noUi-tooltip {
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        top: 50%;
        right: 120%;
      }
      .noUi-target .noUi-handle {
        border: 1px solid #333;
      }
      .noUi-target.slider-primary.noUi-connect,
      .noUi-target.slider-primary .noUi-connect {
        background-color: #35488a;
      }
      .noUi-target.slider-primary .noUi-handle {
        border-color: #35488a;
      }
      .noUi-target.slider-info.noUi-connect,
      .noUi-target.slider-info .noUi-connect {
        background-color: #00bcd4;
      }
      .noUi-target.slider-info .noUi-handle {
        border-color: #00bcd4;
      }
      .noUi-target.slider-success.noUi-connect,
      .noUi-target.slider-success .noUi-connect {
        background-color: #4caf50;
      }
      .noUi-target.slider-success .noUi-handle {
        border-color: #4caf50;
      }
      .noUi-target.slider-warning.noUi-connect,
      .noUi-target.slider-warning .noUi-connect {
        background-color: #ff9800;
      }
      .noUi-target.slider-warning .noUi-handle {
        border-color: #ff9800;
      }
      .noUi-target.slider-danger.noUi-connect,
      .noUi-target.slider-danger .noUi-connect {
        background-color: #f44336;
      }
      .noUi-target.slider-danger .noUi-handle {
        border-color: #f44336;
      }
      .noUi-target.slider-rose.noUi-connect,
      .noUi-target.slider-rose .noUi-connect {
        background-color: #e91e63;
      }
      .noUi-target.slider-rose .noUi-handle {
        border-color: #e91e63;
      }

      /*!
* https://github.com/YouCanBookMe/react-datetime
*/
      .rdt {
        position: relative;
      }
      .rdt .rdtPicker {
        transition: all 0.15s linear;
        margin-top: -20px;
        visibility: hidden;
        display: block;
        opacity: 0;
      }
      .rdt.rdtOpen .rdtPicker {
        opacity: 1;
        visibility: visible;
        margin-top: 0;
      }
      .rdt input.form-control {
        border: 0;
        background-image: linear-gradient(#35488a, #35488a),
          linear-gradient(#d2d2d2, #d2d2d2);
        background-size: 0 2px, 100% 1px;
        background-repeat: no-repeat;
        background-position: bottom, 50% calc(100% - 1px);
        background-color: transparent;
        transition: background 0s ease-out;
        float: none;
        box-shadow: none;
        border-radius: 0;
        height: 36px;
        padding: 7px 0;
        font-size: 14px;
        font-family: Roboto, Helvetica, Arial, sans-serif;
        font-weight: 400;
        line-height: 1.42857;
        display: block;
        width: 100%;
        color: #555;
        margin-top: 13px;
      }
      .rdt input.form-control:focus {
        outline: none;
        background-image: linear-gradient(#35488a, #35488a),
          linear-gradient(#d2d2d2, #d2d2d2);
        background-size: 100% 2px, 100% 1px;
        box-shadow: none;
        transition-duration: 0.3s;
      }
      .rdtPicker {
        display: none;
        position: absolute;
        width: 260px;
        padding: 4px;
        margin-top: 1px;
        z-index: 99999 !important;
        background: #fff;
        border-radius: 0.125rem;
        box-shadow: 0 10px 50px 0 rgba(0, 0, 0, 0.2);
        -webkit-background-clip: padding-box;
        background-clip: padding-box;
        min-width: 160px;
      }
      .rdtPicker:before {
        display: inline-block;
        position: absolute;
        width: 0;
        height: 0;
        vertical-align: middle;
        content: "";
        top: -5px;
        left: 10px;
        right: auto;
        color: #fff;
        border-bottom: 0.4em solid;
        border-right: 0.4em solid transparent;
        border-left: 0.4em solid transparent;
      }
      .rdtPicker:after {
        border-bottom: 0.4em solid #fff;
        border-right: 0.4em solid transparent;
        border-left: 0.4em solid transparent;
        content: "";
        display: inline-block;
        position: absolute;
        top: -5px;
        left: 10px;
      }
      .rdtPicker {
        display: block;
        top: 40px;
      }
      .rdtStatic .rdtPicker {
        box-shadow: none;
        position: static;
      }
      .rdtPicker .rdtTimeToggle {
        text-align: center;
        padding: 5px;
        border-radius: 4px;
      }
      .rdtPicker table {
        width: 100%;
        margin: 0;
        border-color: #fff !important;
        border-collapse: collapse;
      }
      .rdtPicker td,
      .rdtPicker th {
        text-align: center;
        padding: 1px;
      }
      .rdtPicker td {
        cursor: pointer;
      }
      .rdtDay {
        height: 30px;
        line-height: 33px;
        width: 30px;
        text-align: center;
        padding: 0;
        border-radius: 50%;
        color: #000;
      }
      .rdtDay.rdtActive,
      .rdtDay.rdtActive:hover,
      .rdtDay.rdtToday.rdtActive {
        background-color: #35488a !important;
        color: #fff;
        box-shadow: 0 5px 20px 0 rgba(0, 0, 0, 0.2),
          0 13px 24px -11px rgba(53, 72, 138, 0.6);
      }
      .rdtDays tr .dow {
        border-bottom: 1px solid #e3e3e3;
        text-align: center;
        font-size: 12px;
        text-transform: uppercase;
        font-weight: 400;
        padding-bottom: 5px;
        padding-top: 10px;
      }
      .rdtDays tr .rdtNew,
      .rdtDays tr .rdtOld {
        color: #bdbdbd;
      }
      .rdtPicker .rdtTimeToggle:hover,
      .rdtPicker td.rdtDay:hover,
      .rdtPicker td.rdtHour:hover,
      .rdtPicker td.rdtMinute:hover,
      .rdtPicker td.rdtSecond:hover {
        background: #eee;
        cursor: pointer;
      }
      .rdtPicker td.rdtToday {
        position: relative;
      }
      .rdtPicker td.rdtActive.rdtToday:before {
        border-bottom-color: #fff;
      }
      .rdtPicker td.rdtDisabled,
      .rdtPicker td.rdtDisabled:hover {
        background: none;
        color: #bdbdbd !important;
        cursor: not-allowed;
      }
      .rdtPicker td span.rdtOld {
        color: #999;
      }
      .rdtPicker td span.rdtDisabled,
      .rdtPicker td span.rdtDisabled:hover {
        background: none;
        color: #bdbdbd !important;
        cursor: not-allowed;
      }
      .rdtPicker .dow {
        width: 14.2857%;
        border-bottom: none;
      }
      .rdtPicker th.rdtSwitch {
        width: 50px;
        padding: 5px;
        border-radius: 4px;
      }
      .rdtPicker th.rdtNext,
      .rdtPicker th.rdtPrev {
        font-size: 21px;
        vertical-align: top;
        border-radius: 50%;
        line-height: 33px;
      }
      .rdtPicker .dow,
      .rdtPicker .rdtTimeToggle,
      .rdtPicker th.rdtNext,
      .rdtPicker th.rdtPrev,
      .rdtPicker th.rdtSwitch {
        color: #495057;
      }
      .rdtPicker .rdtTime th.rdtSwitch,
      .rdtPicker .rdtTimeToggle {
        color: #35488a;
      }
      .rdtNext span,
      .rdtPrev span {
        display: block;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
      }
      .rdtPicker th.rdtDisabled,
      .rdtPicker th.rdtDisabled:hover {
        background: none;
        color: #bdbdbd !important;
        cursor: not-allowed;
      }
      .rdtPicker thead tr:first-child th {
        cursor: pointer;
      }
      .rdtPicker thead tr:first-child th:hover {
        background: #eee;
      }
      .rdtPicker button {
        border: none;
        background: none;
        cursor: pointer;
      }
      .rdtPicker button:hover {
        background-color: #eee;
      }
      .rdtPicker thead button {
        width: 100%;
        height: 100%;
      }
      td.rdtMonth,
      td.rdtYear {
        height: 50px;
        width: 25%;
        color: #000;
        cursor: pointer;
      }
      td.rdtMonth:hover,
      td.rdtYear:hover {
        background: #eee;
      }
      .rdtCounters {
        display: inline-block;
      }
      .rdtCounters > div {
        float: left;
        width: 40px;
        font-weight: inherit;
        margin: 3px;
        border-radius: 50%;
      }
      .rdtCounters .rdtCounterSeparator {
        width: 0;
        border: 1px solid transparent;
      }
      .rdtCounter {
        height: 100px;
        width: 40px;
      }
      .rdtCounter .rdtCount {
        padding: 7px;
        height: 40px;
        border: 1px solid transparent;
      }
      .rdtCounters .rdtCounter:last-child .rdtCount {
        color: #35488a;
        border-radius: 50%;
        border: 1px solid #35488a;
      }
      .rdtCounterSeparator {
        padding: 7px;
        line-height: 100px;
      }
      .rdtCounter .rdtBtn {
        line-height: 40px;
        cursor: pointer;
        display: block;
        border-radius: 50%;
        color: #35488a;
        transition: all 60ms ease-in;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
      }
      .rdtCounter .rdtBtn:hover {
        background: #eee;
      }
      .rdtCounter .rdtCount {
        font-size: inherit;
        line-height: 25px;
      }
      .rdtMilli {
        vertical-align: middle;
        padding-left: 8px;
        width: 48px;
      }
      .rdtMilli input {
        width: 100%;
        font-size: inherit;
        margin-top: 37px;
      }
      .rdtMonths,
      .rdtYears {
        padding-bottom: 10px;
      }
      .rdtMonths .rdtMonth,
      .rdtMonths .rdtYear,
      .rdtYears .rdtMonth,
      .rdtYears .rdtYear {
        display: inline-block;
        width: 56px;
        height: 56px;
        line-height: 56px;
        margin: 3px;
        cursor: pointer;
        border-radius: 50%;
        text-align: center;
      }
      .rdtMonths .rdtMonth.rdtActive,
      .rdtMonths .rdtYear.rdtActive,
      .rdtYears .rdtMonth.rdtActive,
      .rdtYears .rdtYear.rdtActive {
        background-color: #35488a !important;
        color: #fff;
      }

      /*!
  Ionicons, v2.0.0
  Created by Ben Sperry for the Ionic Framework, http://ionicons.com/
  https://twitter.com/benjsperry  https://twitter.com/ionicframework
  MIT License: https://github.com/driftyco/ionicons

  Android-style icons originally built by Google’s
  Material Design Icons: https://github.com/google/material-design-icons
  used under CC BY http://creativecommons.org/licenses/by/4.0/
  Modified icons to fit ionicon’s grid from original.
*/
      @font-face {
        font-family: Ionicons;
        src: url(https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/fonts/ionicons.eot?v=2.0.0);
        src: url(https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/fonts/ionicons.eot?v=2.0.0#iefix)
            format("embedded-opentype"),
          url(https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/fonts/ionicons.ttf?v=2.0.0)
            format("truetype"),
          url(https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/fonts/ionicons.woff?v=2.0.0)
            format("woff"),
          url(https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/fonts/ionicons.svg?v=2.0.0#Ionicons)
            format("svg");
        font-weight: 400;
        font-style: normal;
      }
      .image-gallery-fullscreen-button:before,
      .image-gallery-left-nav:before,
      .image-gallery-play-button:before,
      .image-gallery-right-nav:before {
        display: inline-block;
        font-family: Ionicons;
        speak: none;
        font-style: normal;
        font-weight: 400;
        font-variant: normal;
        text-transform: none;
        text-rendering: auto;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
      }
      .image-gallery {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        -o-user-select: none;
        user-select: none;
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
      }
      .image-gallery.fullscreen-modal {
        background: #000;
        bottom: 0;
        height: 100%;
        left: 0;
        position: fixed;
        right: 0;
        top: 0;
        width: 100%;
        z-index: 5;
      }
      .image-gallery.fullscreen-modal .image-gallery-content {
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
      }
      .image-gallery-content {
        position: relative;
        line-height: 0;
        top: 0;
      }
      .image-gallery-content.fullscreen,
      .image-gallery-content.fullscreen .image-gallery-slide {
        background: #000;
      }
      .image-gallery-slide-wrapper {
        position: relative;
      }
      .image-gallery-slide-wrapper.left,
      .image-gallery-slide-wrapper.right {
        display: inline-block;
        width: calc(100% - 113px);
      }
      @media (max-width: 768px) {
        .image-gallery-slide-wrapper.left,
        .image-gallery-slide-wrapper.right {
          width: calc(100% - 84px);
        }
      }
      .image-gallery-slide-wrapper.image-gallery-rtl {
        direction: rtl;
      }
      .image-gallery-fullscreen-button,
      .image-gallery-left-nav,
      .image-gallery-play-button,
      .image-gallery-right-nav {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        background-color: transparent;
        border: 0;
        cursor: pointer;
        outline: none;
        position: absolute;
        z-index: 4;
      }
      .image-gallery-fullscreen-button:before,
      .image-gallery-left-nav:before,
      .image-gallery-play-button:before,
      .image-gallery-right-nav:before {
        color: #fff;
        line-height: 0.7;
        text-shadow: 0 2px 2px #1a1a1a;
        transition: color 0.2s ease-out;
      }
      .image-gallery-fullscreen-button:hover:before,
      .image-gallery-left-nav:hover:before,
      .image-gallery-play-button:hover:before,
      .image-gallery-right-nav:hover:before {
        color: #337ab7;
      }
      @media (max-width: 768px) {
        .image-gallery-fullscreen-button:hover:before,
        .image-gallery-left-nav:hover:before,
        .image-gallery-play-button:hover:before,
        .image-gallery-right-nav:hover:before {
          color: #fff;
        }
      }
      .image-gallery-fullscreen-button,
      .image-gallery-play-button {
        bottom: 0;
      }
      .image-gallery-fullscreen-button:before,
      .image-gallery-play-button:before {
        font-size: 2.7em;
        padding: 15px 20px;
        text-shadow: 0 1px 1px #1a1a1a;
      }
      @media (max-width: 768px) {
        .image-gallery-fullscreen-button:before,
        .image-gallery-play-button:before {
          font-size: 2.4em;
        }
      }
      @media (max-width: 480px) {
        .image-gallery-fullscreen-button:before,
        .image-gallery-play-button:before {
          font-size: 2em;
        }
      }
      .image-gallery-fullscreen-button:hover:before,
      .image-gallery-play-button:hover:before {
        color: #fff;
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
      }
      @media (max-width: 768px) {
        .image-gallery-fullscreen-button:hover:before,
        .image-gallery-play-button:hover:before {
          -webkit-transform: none;
          transform: none;
        }
      }
      .image-gallery-fullscreen-button {
        right: 0;
      }
      .image-gallery-fullscreen-button:before {
        content: "\F386";
      }
      .image-gallery-fullscreen-button.active:before {
        content: "\F37D";
      }
      .image-gallery-fullscreen-button.active:hover:before {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
      }
      .image-gallery-play-button {
        left: 0;
      }
      .image-gallery-play-button:before {
        content: "\F488";
      }
      .image-gallery-play-button.active:before {
        content: "\F478";
      }
      .image-gallery-left-nav,
      .image-gallery-right-nav {
        color: #fff;
        font-size: 5em;
        padding: 50px 15px;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
      }
      .image-gallery-left-nav[disabled],
      .image-gallery-right-nav[disabled] {
        cursor: disabled;
        opacity: 0.6;
        pointer-events: none;
      }
      @media (max-width: 768px) {
        .image-gallery-left-nav,
        .image-gallery-right-nav {
          font-size: 3.4em;
          padding: 20px 15px;
        }
      }
      @media (max-width: 480px) {
        .image-gallery-left-nav,
        .image-gallery-right-nav {
          font-size: 2.4em;
          padding: 0 15px;
        }
      }
      .image-gallery-left-nav {
        left: 0;
      }
      .image-gallery-left-nav:before {
        content: "\F3D2";
      }
      .image-gallery-right-nav {
        right: 0;
      }
      .image-gallery-right-nav:before {
        content: "\F3D3";
      }
      .image-gallery-slides {
        line-height: 0;
        overflow: hidden;
        position: relative;
        white-space: nowrap;
      }
      .image-gallery-slide {
        background: #fff;
        left: 0;
        position: absolute;
        top: 0;
        width: 100%;
      }
      .image-gallery-slide.center {
        position: relative;
      }
      .image-gallery-slide img {
        width: 100%;
      }
      .image-gallery-slide .image-gallery-description {
        background: rgba(0, 0, 0, 0.4);
        bottom: 70px;
        color: #fff;
        left: 0;
        line-height: 1;
        padding: 10px 20px;
        position: absolute;
        white-space: normal;
      }
      @media (max-width: 768px) {
        .image-gallery-slide .image-gallery-description {
          bottom: 45px;
          font-size: 0.8em;
          padding: 8px 15px;
        }
      }
      .image-gallery-bullets {
        bottom: 20px;
        left: 0;
        margin: 0 auto;
        position: absolute;
        right: 0;
        width: 80%;
        z-index: 4;
      }
      .image-gallery-bullets .image-gallery-bullets-container {
        margin: 0;
        padding: 0;
        text-align: center;
      }
      .image-gallery-bullets .image-gallery-bullet {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        background-color: transparent;
        border: 1px solid #fff;
        border-radius: 50%;
        box-shadow: 0 1px 0 #1a1a1a;
        cursor: pointer;
        display: inline-block;
        margin: 0 5px;
        outline: none;
        padding: 5px;
      }
      @media (max-width: 768px) {
        .image-gallery-bullets .image-gallery-bullet {
          margin: 0 3px;
          padding: 3px;
        }
      }
      @media (max-width: 480px) {
        .image-gallery-bullets .image-gallery-bullet {
          padding: 2.7px;
        }
      }
      .image-gallery-bullets .image-gallery-bullet.active {
        background: #fff;
      }
      .image-gallery-thumbnails-wrapper {
        position: relative;
      }
      .image-gallery-thumbnails-wrapper.thumbnails-wrapper-rtl {
        direction: rtl;
      }
      .image-gallery-thumbnails-wrapper.left,
      .image-gallery-thumbnails-wrapper.right {
        display: inline-block;
        vertical-align: top;
        width: 108px;
      }
      @media (max-width: 768px) {
        .image-gallery-thumbnails-wrapper.left,
        .image-gallery-thumbnails-wrapper.right {
          width: 81px;
        }
      }
      .image-gallery-thumbnails-wrapper.left .image-gallery-thumbnails,
      .image-gallery-thumbnails-wrapper.right .image-gallery-thumbnails {
        height: 100%;
        width: 100%;
        left: 0;
        padding: 0;
        position: absolute;
        top: 0;
      }
      .image-gallery-thumbnails-wrapper.left
        .image-gallery-thumbnails
        .image-gallery-thumbnail,
      .image-gallery-thumbnails-wrapper.right
        .image-gallery-thumbnails
        .image-gallery-thumbnail {
        display: block;
        margin-right: 0;
        padding: 0;
      }
      .image-gallery-thumbnails-wrapper.left
        .image-gallery-thumbnails
        .image-gallery-thumbnail
        + .image-gallery-thumbnail,
      .image-gallery-thumbnails-wrapper.right
        .image-gallery-thumbnails
        .image-gallery-thumbnail
        + .image-gallery-thumbnail {
        margin-left: 0;
      }
      .image-gallery-thumbnails-wrapper.left {
        margin-right: 5px;
      }
      @media (max-width: 768px) {
        .image-gallery-thumbnails-wrapper.left {
          margin-right: 3px;
        }
      }
      .image-gallery-thumbnails-wrapper.right {
        margin-left: 5px;
      }
      @media (max-width: 768px) {
        .image-gallery-thumbnails-wrapper.right {
          margin-left: 3px;
        }
      }
      .image-gallery-thumbnails {
        padding: 5px 0;
      }
      @media (max-width: 768px) {
        .image-gallery-thumbnails {
          padding: 3px 0;
        }
      }
      .image-gallery-thumbnails .image-gallery-thumbnails-container {
        cursor: pointer;
        text-align: center;
        transition: -webkit-transform 0.45s ease-out;
        transition: transform 0.45s ease-out;
        transition: transform 0.45s ease-out, -webkit-transform 0.45s ease-out;
        white-space: nowrap;
      }
      .image-gallery-thumbnail {
        display: inline-block;
        border: 4px solid transparent;
        transition: border 0.3s ease-out;
        width: 100px;
      }
      @media (max-width: 768px) {
        .image-gallery-thumbnail {
          border: 3px solid transparent;
          width: 75px;
        }
      }
      .image-gallery-thumbnail + .image-gallery-thumbnail {
        margin-left: 2px;
      }
      .image-gallery-thumbnail .image-gallery-thumbnail-inner {
        position: relative;
      }
      .image-gallery-thumbnail img {
        vertical-align: middle;
        width: 100%;
      }
      .image-gallery-thumbnail.active {
        border: 4px solid #337ab7;
      }
      @media (max-width: 768px) {
        .image-gallery-thumbnail.active {
          border: 3px solid #337ab7;
        }
      }
      .image-gallery-thumbnail-label {
        box-sizing: border-box;
        color: #fff;
        font-size: 1em;
        left: 0;
        line-height: 1em;
        padding: 5%;
        position: absolute;
        top: 50%;
        text-shadow: 1px 1px 0 #000;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        white-space: normal;
        width: 100%;
      }
      @media (max-width: 768px) {
        .image-gallery-thumbnail-label {
          font-size: 0.8em;
          line-height: 0.8em;
        }
      }
      .image-gallery-index {
        background: rgba(0, 0, 0, 0.4);
        color: #fff;
        line-height: 1;
        padding: 10px 20px;
        position: absolute;
        right: 0;
        top: 0;
        z-index: 4;
      }
      @media (max-width: 768px) {
        .image-gallery-index {
          font-size: 0.8em;
          padding: 5px 10px;
        }
      }
      .image-gallery-left-nav,
      .image-gallery-right-nav {
        position: absolute;
        cursor: pointer;
        z-index: 100;
        opacity: 0.5;
        bottom: -40%;
        top: auto;
        padding: 0 !important;
      }
      .image-gallery-left-nav:before,
      .image-gallery-left-nav:hover:before,
      .image-gallery-right-nav:before,
      .image-gallery-right-nav:hover:before {
        color: #3c4858;
        text-shadow: none;
      }
      .image-gallery-left-nav:before,
      .image-gallery-right-nav:before {
        font-family: Material Icons;
        font-weight: 400;
        font-style: normal;
        font-size: 24px;
        line-height: 1;
        letter-spacing: normal;
        text-transform: none;
        display: inline-block;
        white-space: nowrap;
        word-wrap: normal;
        direction: ltr;
        -webkit-font-feature-settings: "liga";
        -webkit-font-smoothing: antialiased;
      }
      .image-gallery-left-nav {
        left: -20px;
      }
      .image-gallery-left-nav:before {
        content: "chevron_left";
      }
      .image-gallery-right-nav {
        right: -20px;
      }
      .image-gallery-right-nav:before {
        content: "chevron_right";
      }
      .image-gallery-thumbnail {
        margin: 0;
        padding: 0;
        cursor: pointer;
        position: relative;
        line-height: 0;
        width: 125px;
        border: none !important;
      }
      .image-gallery-thumbnail + .image-gallery-thumbnail {
        margin: 0 !important;
      }
      .image-gallery-thumbnail img {
        max-width: 100%;
        cursor: pointer;
        position: relative;
        margin-top: 10px;
        margin-bottom: 10px;
      }
      .image-gallery-thumbnail-label {
        display: none !important;
      }
      .image-gallery-thumbnails {
        padding: 0 !important;
        overflow: hidden;
        width: 100%;
      }
      .image-gallery-thumbnails-container {
        position: relative;
        margin: 0;
        padding: 0;
        list-style-type: none;
        text-align: center;
      }
      .slick-slider {
        position: relative;
        display: block;
        box-sizing: border-box;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-touch-callout: none;
        -khtml-user-select: none;
        touch-action: pan-y;
        -webkit-tap-highlight-color: transparent;
      }
      @media (min-width: 768px) {
        .slick-slider .slick-caption {
          display: block !important;
        }
      }
      .slick-slider .slick-caption {
        padding-bottom: 45px;
        position: absolute;
        right: 15%;
        bottom: 20px;
        left: 15%;
        z-index: 10;
        padding-top: 20px;
        color: #fff;
        text-align: center;
        z-index: 3;
        display: none;
      }
      .slick-slider .slick-slide > div:first-child {
        position: relative;
      }
      .slick-slider .slick-icons {
        position: relative;
        top: 5px;
      }
      .slick-slider .slick-image {
        width: 100% !important;
        display: -webkit-inline-flex !important;
        display: inline-flex !important;
      }
      .slick-list {
        position: relative;
        display: block;
        overflow: hidden;
        margin: 0;
        padding: 0;
      }
      .slick-list:focus {
        outline: none;
      }
      .slick-list.dragging {
        cursor: pointer;
        cursor: hand;
      }
      .slick-slider .slick-list,
      .slick-slider .slick-track {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
      }
      .slick-track {
        position: relative;
        top: 0;
        left: 0;
        display: block;
        margin-left: auto;
        margin-right: auto;
      }
      .slick-track:after,
      .slick-track:before {
        display: table;
        content: "";
      }
      .slick-track:after {
        clear: both;
      }
      .slick-loading .slick-track {
        visibility: hidden;
      }
      .slick-slide {
        display: none;
        float: left;
        height: 100%;
        min-height: 1px;
      }
      [dir="rtl"] .slick-slide {
        float: right;
      }
      .slick-slide img {
        display: block;
      }
      .slick-slide.slick-loading img {
        display: none;
      }
      .slick-slide.dragging img {
        pointer-events: none;
      }
      .slick-initialized .slick-slide {
        display: block;
      }
      .slick-loading .slick-slide {
        visibility: hidden;
      }
      .slick-vertical .slick-slide {
        display: block;
        height: auto;
        border: 1px solid transparent;
      }
      .slick-arrow.slick-hidden {
        display: none;
      }
      button.slick-arrow.slick-next,
      button.slick-arrow.slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 50%;
        display: block;
        height: 100%;
        padding: 0;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        cursor: pointer;
        border: none;
        color: transparent;
        outline: none;
        background: transparent;
        width: 15%;
        z-index: 2;
        opacity: 0.5;
      }
      .slick-prev {
        left: 0;
      }
      .slick-prev:before {
        content: "<";
        font-weight: 600;
        font-family: Font Awesome\5 Free;
        -moz-osx-font-smoothing: grayscale;
        -webkit-font-smoothing: antialiased;
        display: inline-block;
        font-style: normal;
        font-variant: normal;
        text-rendering: auto;
        line-height: 1;
        color: #fff;
        font-size: 30px;
        width: 100%;
      }
      .slick-next {
        right: 0;
      }
      .slick-next:before {
        content: ">";
        font-weight: 600;
        font-family: Font Awesome\5 Free;
        -moz-osx-font-smoothing: grayscale;
        -webkit-font-smoothing: antialiased;
        display: inline-block;
        font-style: normal;
        font-variant: normal;
        text-rendering: auto;
        line-height: 1;
        color: #fff;
        font-size: 30px;
        width: 100%;
      }
      .slick-list {
        z-index: 1;
      }
      .slick-dots {
        margin-top: 0;
        margin-bottom: 1rem;
        position: absolute;
        bottom: 5px;
        width: 100%;
        padding: 0;
        list-style: none;
        text-align: center;
        z-index: 3;
      }
      .slick-dots li,
      .slick-dots li button {
        width: 20px;
        height: 20px;
        cursor: pointer;
      }
      .slick-dots li {
        position: relative;
        display: inline-block;
        margin: 0 3px;
        padding: 0;
      }
      .slick-dots li button {
        font-size: 0;
        line-height: 0;
        display: block;
        padding: 5px;
        color: transparent;
        border: 0;
        outline: none;
        background: transparent;
      }
      .slick-dots li button:before {
        position: absolute;
        top: 0;
        left: 0;
        width: 5px;
        height: 5px;
        content: "\2022";
        text-align: center;
        opacity: 1;
        background-color: grey;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14),
          0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
        border-radius: 10px;
        transition: all 0.3s linear;
      }
      .slick-dots li.slick-active button:before {
        width: 8px;
        height: 8px;
        box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14),
          0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
        top: -3px;
        background-color: #000;
      }
      .vertical-dots {
        right: 10px;
        list-style: none;
        display: block;
        position: absolute;
        top: 40%;
        margin-top: -10px;
        text-align: right;
        z-index: 99999;
      }
      .vertical-dots li {
        position: relative;
        width: 20px;
        height: 20px;
        cursor: pointer;
      }
      .vertical-dots li button {
        font-size: 0;
        line-height: 0;
        display: block;
        width: 20px;
        height: 20px;
        padding: 5px;
        cursor: pointer;
        color: transparent;
        border: 0;
        outline: none;
        background: transparent;
      }
      .vertical-dots li button:focus,
      .vertical-dots li button:hover {
        outline: none;
      }
      .vertical-dots li button:focus:before,
      .vertical-dots li button:hover:before {
        opacity: 1;
      }
      .vertical-dots li button:before {
        font-family: slick;
        font-size: 25px;
        line-height: 20px;
        position: absolute;
        top: 0;
        left: 0;
        width: 20px;
        height: 20px;
        content: "\2022";
        text-align: center;
        opacity: 0.25;
        color: #fff;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
      }
      @media (max-width: 768px) {
        .vertical-dots li button:before {
          color: grey;
        }
      }
      .vertical-dots li.slick-active button:before {
        opacity: 0.75;
        font-size: 35px;
        color: #fff;
      }
      @media (max-width: 768px) {
        .vertical-dots li.slick-active button:before {
          color: #35488a;
        }
      }
      .react-tagsinput {
        display: inline-block;
        padding: 4px 6px;
        max-width: 100%;
        line-height: 22px;
      }
      .react-tagsinput-tag {
        cursor: pointer;
        margin: 5px 3px 5px 0;
        position: relative;
        border-radius: 12px;
        color: #fff;
        font-weight: 500;
        font-size: 0.75em;
        text-transform: uppercase;
        display: inline-block;
        line-height: 1.5em;
        padding: 3px 8px 3px 0.8em;
      }
      .react-tagsinput-remove {
        cursor: pointer;
        font-weight: 700;
      }
      .react-tagsinput-tag a:before {
        font-family: Font Awesome\5 Free;
        content: "\F00D";
        padding: 0 2px;
        font-weight: 900;
      }
      .react-tagsinput-tag a {
        cursor: pointer;
        position: absolute;
        top: 3px;
        right: 0;
        opacity: 0;
        background-color: transparent;
        color: #fff;
      }
      .react-tagsinput-input {
        background: transparent;
        border: 0;
        color: #777;
        font-family: sans-serif;
        font-size: 13px;
        font-weight: 400;
        margin-bottom: 6px;
        margin-top: 1px;
        outline: none;
        padding: 5px;
        width: 80px;
      }
      .react-tagsinput .react-tagsinput-tag {
        transition: all 0.3s ease 0s;
        background-color: #999;
      }
      .react-tagsinput .react-tagsinput-tag:hover {
        padding-right: 22px;
      }
      .react-tagsinput .react-tagsinput-tag:hover a {
        opacity: 1;
        padding-right: 4px;
        background-color: transparent;
        color: #fff;
      }
      .react-tagsinput .react-tagsinput-tag.primary {
        background-color: #35488a;
      }
      .react-tagsinput .react-tagsinput-tag.info {
        background-color: #00bcd4;
      }
      .react-tagsinput .react-tagsinput-tag.success {
        background-color: #4caf50;
      }
      .react-tagsinput .react-tagsinput-tag.warning {
        background-color: #ff9800;
      }
      .react-tagsinput .react-tagsinput-tag.danger {
        background-color: #f44336;
      }
      .react-tagsinput .react-tagsinput-tag.rose {
        background-color: #e91e63;
      }
      .react-tagsinput .react-tagsinput-tag.default {
        background-color: #999;
      }
      body {
        margin: 0;
        padding: 0;
      }
      body,
      html {
        height: 100%;
      }
      .wbf-clear {
        clear: both;
      }
      .wbf-screen {
        opacity: 0;
        z-index: -1000;
        margin: 0;
        padding: 0;
        width: 100%;
        height: 100%;
        background: hsla(0, 0%, 58%, 0.5);
        position: fixed;
        top: 0;
        transition-duration: 0.3s;
      }
      .wbf-screen.active {
        opacity: 1;
        z-index: 2147483646;
      }
      .wbf-container {
        opacity: 0;
        z-index: -1000;
        width: 40%;
        background: #fff;
        position: absolute;
        left: 30%;
        top: 50px;
        font-family: Roboto, Times New Roman, sans-serif;
        font-size: 16px;
        transition-duration: 0.3s;
        -webkit-transform: translate3d(0, -100px, 0);
        transform: translate3d(0, -100px, 0);
      }
      .wbf-container.active {
        opacity: 1;
        z-index: 2147483647;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
      }
      .wbf-header {
        padding: 20px 30px;
        background: #35488a;
      }
      .wbf-header .wbf-mainheader {
        font-size: 1.6em;
        color: #fff;
        float: left;
      }
      .wbf-header .wbf-availability {
        float: right;
      }
      .wbf-header .wbf-availability .wbf-availability-icon {
        border-radius: 50%;
        width: 10px;
        height: 10px;
        background: #00ec00;
        display: inline-block;
      }
      .wbf-header .wbf-availability .wbf-availability-msg {
        font-size: 1em;
        line-height: 2em;
        font-weight: 200;
        display: inline-block;
      }
      .wbf-header .wbf-availability.available .wbf-availability-msg {
        color: #00ec00;
      }
      .wbf-form {
        padding: 30px;
        min-height: 248px;
        overflow: visible;
      }
      .wbf-form .wbf-status {
        margin-bottom: 20px;
      }
      .wbf-form .wbf-status .wbf-message {
        font-size: 1em;
      }
      .wbf-form .wbf-status .wbf-message.wbf-centered {
        text-align: center;
        display: block;
      }
      .wbf-form .intl-tel-input {
        width: 100%;
        padding-left: 10%;
      }
      .wbf-form .wbf-numberinput {
        width: 80%;
        height: 40px;
        background: #f2f2f2;
        transition-duration: 0.3s;
        border: 1px solid #c3c3c3;
        padding-left: 40px;
      }
      .wbf-form .wbf-numberinput:hover {
        background: #fff;
        border: 1px solid grey;
      }
      .wbf-form .wbf-numberinput:focus {
        background: #fff;
      }
      .wbf-form .wbf-formerror {
        font-size: 0.8em;
        color: red;
        margin-left: 10%;
        margin-top: 5px;
        float: left;
        display: none;
      }
      .wbf-form .wbf-privacy {
        margin-top: 25px;
        text-align: center;
        font-size: 0.75em;
        color: #525252;
      }
      .wbf-form .wbf-submit input {
        width: auto;
        color: #fff;
        font-weight: 600;
        background: #35488a;
        text-transform: uppercase;
        border-radius: 5px;
        height: 40px;
        margin: 15px auto 0;
        padding: 0 20px;
        display: block;
        border: 1px solid #9d9d9d;
        cursor: pointer;
        transition-duration: 0.3s;
      }
      .wbf-form .wbf-submit input:hover {
        background: #35488a;
        color: #fff;
      }
      .wbf-footer {
        padding: 20px 30px;
        font-size: 0.8em;
        background: #d1dbfa;
        color: #7e7e7e;
      }
      .wbf-footer .wbf-poweredby {
        float: left;
        width: 130px;
        height: 18px;
      }
      .wbf-footer .wbf-poweredby img {
        width: 112px;
        -webkit-transform: translate3d(-23px, -10px, 0);
        transform: translate3d(-23px, -10px, 0);
        float: right;
      }
      .wbf-footer .wbf-close {
        float: right;
      }
      .wbf-footer .wbf-close:hover {
        text-decoration: underline;
        cursor: pointer;
      }
      .wbf-container .wbf-window {
        overflow: visible;
      }
      .wbf-container .wbf-livestatus {
        text-align: center;
      }
      .wbf-container.agent-busy .wbf-window,
      .wbf-container.completed .wbf-window,
      .wbf-container.connected .wbf-window,
      .wbf-container.connecting .wbf-window,
      .wbf-container.ended .wbf-window,
      .wbf-container.in-progress .wbf-window,
      .wbf-container.oops .wbf-window,
      .wbf-container.verification-failed .wbf-window,
      .wbf-container.verification-success .wbf-window,
      .wbf-container.verifying .wbf-window,
      .wbf-container .wbf-livestatus {
        visibility: hidden;
        height: 0;
        overflow: hidden;
      }
      .wbf-container.agent-busy .wbf-livestatus,
      .wbf-container.completed .wbf-livestatus,
      .wbf-container.connected .wbf-livestatus,
      .wbf-container.connecting .wbf-livestatus,
      .wbf-container.ended .wbf-livestatus,
      .wbf-container.in-progress .wbf-livestatus,
      .wbf-container.oops .wbf-livestatus,
      .wbf-container.verification-failed .wbf-livestatus,
      .wbf-container.verification-success .wbf-livestatus,
      .wbf-container.verifying .wbf-livestatus {
        visibility: visible;
        height: auto;
      }
      .wbf-container .wbf-livemsg-agent-busy,
      .wbf-container .wbf-livemsg-completed,
      .wbf-container .wbf-livemsg-connected,
      .wbf-container .wbf-livemsg-connecting,
      .wbf-container .wbf-livemsg-ended,
      .wbf-container .wbf-livemsg-in-progress,
      .wbf-container .wbf-livemsg-oops,
      .wbf-container .wbf-livemsg-timer,
      .wbf-container .wbf-livemsg-verification-failed,
      .wbf-container .wbf-livemsg-verification-success,
      .wbf-container .wbf-livemsg-verifying {
        display: none;
      }
      .wbf-container.agent-busy .wbf-livemsg-agent-busy,
      .wbf-container.completed .wbf-livemsg-completed,
      .wbf-container.completed .wbf-livemsg-timer,
      .wbf-container.connected .wbf-livemsg-connected,
      .wbf-container.connecting .wbf-livemsg-connecting,
      .wbf-container.ended .wbf-livemsg-ended,
      .wbf-container.in-progress .wbf-livemsg-in-progress,
      .wbf-container.in-progress .wbf-livemsg-timer,
      .wbf-container.oops .wbf-livemsg-oops,
      .wbf-container.verification-failed .wbf-livemsg-verification-failed,
      .wbf-container.verification-success .wbf-livemsg-verification-success,
      .wbf-container.verifying .wbf-livemsg-verifying {
        display: inherit;
      }
      .wbf-container .wbf-verificationcode {
        margin-top: 20px;
        font-size: 1.5em;
        font-weight: 600;
        color: #dc143c;
      }
      .wbf-container.theme-peter-river .wbf-screen {
        background: hsla(0, 0%, 58%, 0.5);
      }
      .wbf-container.theme-peter-river .wbf-form .wbf-submit input,
      .wbf-container.theme-peter-river .wbf-header {
        background: #35488a;
      }
      .wbf-container.theme-peter-river .wbf-form .wbf-submit input:hover {
        background: #35488a;
      }
      .wbf-container.theme-peter-river
        .wbf-header
        .wbf-availability.available
        .wbf-availability-msg {
        color: #9eff9e;
      }
      .wbf-container.theme-peter-river
        .wbf-header
        .wbf-availability.available
        .wbf-availability-icon {
        background: #9eff9e;
      }
      .wbf-container.theme-peter-river
        .wbf-header
        .wbf-availability.unavailable
        .wbf-availability-msg {
        color: #ff9b91;
      }
      .wbf-container.theme-peter-river
        .wbf-header
        .wbf-availability.unavailable
        .wbf-availability-icon {
        background: #ff9b91;
      }
      .wbf-container.theme-peter-river .wbf-footer {
        background: #d7e3ec;
      }
      .wbf-container.theme-amethyst .wbf-screen {
        background: hsla(0, 0%, 58%, 0.5);
      }
      .wbf-container.theme-amethyst .wbf-form .wbf-submit input,
      .wbf-container.theme-amethyst .wbf-header {
        background: #9b59b6;
      }
      .wbf-container.theme-amethyst .wbf-form .wbf-submit input:hover {
        background: #8e44ad;
      }
      .wbf-container.theme-amethyst
        .wbf-header
        .wbf-availability.available
        .wbf-availability-msg {
        color: #69f969;
      }
      .wbf-container.theme-amethyst
        .wbf-header
        .wbf-availability.available
        .wbf-availability-icon {
        background: #69f969;
      }
      .wbf-container.theme-amethyst
        .wbf-header
        .wbf-availability.unavailable
        .wbf-availability-msg {
        color: #ffa69d;
      }
      .wbf-container.theme-amethyst
        .wbf-header
        .wbf-availability.unavailable
        .wbf-availability-icon {
        background: #ff7769;
      }
      .wbf-container.theme-amethyst .wbf-footer {
        background: #f6e0ff;
      }
      .wbf-container.theme-wet-asphalt .wbf-screen {
        background: hsla(0, 0%, 58%, 0.5);
      }
      .wbf-container.theme-wet-asphalt .wbf-form .wbf-submit input,
      .wbf-container.theme-wet-asphalt .wbf-header {
        background: #34495e;
      }
      .wbf-container.theme-wet-asphalt .wbf-form .wbf-submit input:hover {
        background: #2c3e50;
      }
      .wbf-container.theme-wet-asphalt
        .wbf-header
        .wbf-availability.available
        .wbf-availability-msg {
        color: #69f969;
      }
      .wbf-container.theme-wet-asphalt
        .wbf-header
        .wbf-availability.available
        .wbf-availability-icon {
        background: #69f969;
      }
      .wbf-container.theme-wet-asphalt
        .wbf-header
        .wbf-availability.unavailable
        .wbf-availability-msg {
        color: #ffa69d;
      }
      .wbf-container.theme-wet-asphalt
        .wbf-header
        .wbf-availability.unavailable
        .wbf-availability-icon {
        background: #ff7769;
      }
      .wbf-container.theme-wet-asphalt .wbf-footer {
        background: #e2e2e2;
      }
      .wbf-container.theme-emerald .wbf-screen {
        background: hsla(0, 0%, 58%, 0.5);
      }
      .wbf-container.theme-emerald .wbf-form .wbf-submit input,
      .wbf-container.theme-emerald .wbf-header {
        background: #2ecc71;
      }
      .wbf-container.theme-emerald .wbf-form .wbf-submit input:hover {
        background: #27ae60;
      }
      .wbf-container.theme-emerald
        .wbf-header
        .wbf-availability.available
        .wbf-availability-msg {
        color: #d5ffd5;
      }
      .wbf-container.theme-emerald
        .wbf-header
        .wbf-availability.available
        .wbf-availability-icon {
        background: #d5ffd5;
      }
      .wbf-container.theme-emerald
        .wbf-header
        .wbf-availability.unavailable
        .wbf-availability-msg {
        color: #f95140;
      }
      .wbf-container.theme-emerald
        .wbf-header
        .wbf-availability.unavailable
        .wbf-availability-icon {
        background: #f95140;
      }
      .wbf-container.theme-emerald .wbf-footer {
        background: #e6f9ee;
      }
      .wbf-container.theme-turquoise .wbf-screen {
        background: hsla(0, 0%, 58%, 0.5);
      }
      .wbf-container.theme-turquoise .wbf-form .wbf-submit input,
      .wbf-container.theme-turquoise .wbf-header {
        background: #1abc9c;
      }
      .wbf-container.theme-turquoise .wbf-form .wbf-submit input:hover {
        background: #16a085;
      }
      .wbf-container.theme-turquoise
        .wbf-header
        .wbf-availability.available
        .wbf-availability-msg {
        color: #d5ffd5;
      }
      .wbf-container.theme-turquoise
        .wbf-header
        .wbf-availability.available
        .wbf-availability-icon {
        background: #d5ffd5;
      }
      .wbf-container.theme-turquoise
        .wbf-header
        .wbf-availability.unavailable
        .wbf-availability-msg {
        color: #f95140;
      }
      .wbf-container.theme-turquoise
        .wbf-header
        .wbf-availability.unavailable
        .wbf-availability-icon {
        background: #f95140;
      }
      .wbf-container.theme-turquoise .wbf-footer {
        background: #ecfaf7;
      }
      .wbf-container.theme-carrot .wbf-screen {
        background: hsla(0, 0%, 58%, 0.5);
      }
      .wbf-container.theme-carrot .wbf-form .wbf-submit input,
      .wbf-container.theme-carrot .wbf-header {
        background: #e67e22;
      }
      .wbf-container.theme-carrot .wbf-form .wbf-submit input:hover {
        background: #d35400;
      }
      .wbf-container.theme-carrot
        .wbf-header
        .wbf-availability.available
        .wbf-availability-msg {
        color: #54ff54;
      }
      .wbf-container.theme-carrot
        .wbf-header
        .wbf-availability.available
        .wbf-availability-icon {
        background: #54ff54;
      }
      .wbf-container.theme-carrot
        .wbf-header
        .wbf-availability.unavailable
        .wbf-availability-msg {
        color: #ffcac5;
      }
      .wbf-container.theme-carrot
        .wbf-header
        .wbf-availability.unavailable
        .wbf-availability-icon {
        background: #ffcac5;
      }
      .wbf-container.theme-carrot .wbf-footer {
        background: #fff4ea;
      }
      .wbf-container.theme-alizarin .wbf-screen {
        background: hsla(0, 0%, 58%, 0.5);
      }
      .wbf-container.theme-alizarin .wbf-form .wbf-submit input,
      .wbf-container.theme-alizarin .wbf-header {
        background: #e74c3c;
      }
      .wbf-container.theme-alizarin .wbf-form .wbf-submit input:hover {
        background: #c0392b;
      }
      .wbf-container.theme-alizarin
        .wbf-header
        .wbf-availability.available
        .wbf-availability-msg {
        color: #54ff54;
      }
      .wbf-container.theme-alizarin
        .wbf-header
        .wbf-availability.available
        .wbf-availability-icon {
        background: #54ff54;
      }
      .wbf-container.theme-alizarin
        .wbf-header
        .wbf-availability.unavailable
        .wbf-availability-msg {
        color: #ffcac5;
      }
      .wbf-container.theme-alizarin
        .wbf-header
        .wbf-availability.unavailable
        .wbf-availability-icon {
        background: #ffcac5;
      }
      .wbf-container.theme-alizarin .wbf-footer {
        background: #fff0ef;
      }
      .wbf-container.theme-sunflower .wbf-screen {
        background: hsla(0, 0%, 58%, 0.5);
      }
      .wbf-container.theme-sunflower .wbf-form .wbf-submit input,
      .wbf-container.theme-sunflower .wbf-header {
        background: #f1c40f;
      }
      .wbf-container.theme-sunflower .wbf-form .wbf-submit input:hover {
        background: #f39c12;
      }
      .wbf-container.theme-sunflower
        .wbf-header
        .wbf-availability.available
        .wbf-availability-msg {
        color: #02b302;
      }
      .wbf-container.theme-sunflower
        .wbf-header
        .wbf-availability.available
        .wbf-availability-icon {
        background: #02b302;
      }
      .wbf-container.theme-sunflower
        .wbf-header
        .wbf-availability.unavailable
        .wbf-availability-msg {
        color: #fd3d2b;
      }
      .wbf-container.theme-sunflower
        .wbf-header
        .wbf-availability.unavailable
        .wbf-availability-icon {
        background: #fd3d2b;
      }
      .wbf-container.theme-sunflower .wbf-footer {
        background: #fdf6d9;
      }
      @media screen and (max-width: 1100px) and (min-width: 767px) {
        .wbf-container {
          width: 63%;
          background: #fff;
          position: absolute;
          left: 17.5%;
        }
      }
      @media screen and (max-width: 767px) {
        .wbf-container {
          width: 90%;
          background: #fff;
          position: absolute;
          left: 5%;
          top: 10px;
        }
      }
      .wbf-form .wbf-input {
        margin-left: 10%;
        margin-top: 10px;
        width: 80%;
        height: 40px;
        background: #f2f2f2;
        transition-duration: 0.3s;
        border: 1px solid #c3c3c3;
      }
      .intl-tel-input .flag {
        width: 16px;
        height: 11px;
        background: url(/static/flags-fb3c8fff8d9109a7044cae68ad4caaee.png);
      }
      .intl-tel-input .zw {
        background-position: 0 0;
      }
      .intl-tel-input .zm {
        background-position: -16px 0;
      }
      .intl-tel-input .za {
        background-position: 0 -11px;
      }
      .intl-tel-input .yt {
        background-position: -16px -11px;
      }
      .intl-tel-input .ye {
        background-position: -32px 0;
      }
      .intl-tel-input .ws {
        background-position: -32px -11px;
      }
      .intl-tel-input .wf {
        background-position: 0 -22px;
      }
      .intl-tel-input .vu {
        background-position: -32px -22px;
      }
      .intl-tel-input .vn {
        background-position: 0 -33px;
      }
      .intl-tel-input .vi {
        background-position: -16px -33px;
      }
      .intl-tel-input .vg {
        background-position: -32px -33px;
      }
      .intl-tel-input .ve {
        background-position: -48px 0;
      }
      .intl-tel-input .vc {
        background-position: -48px -11px;
      }
      .intl-tel-input .va {
        background-position: -48px -22px;
      }
      .intl-tel-input .uz {
        background-position: -48px -33px;
      }
      .intl-tel-input .uy {
        background-position: 0 -44px;
      }
      .intl-tel-input .um,
      .intl-tel-input .us {
        background-position: -16px -44px;
      }
      .intl-tel-input .ug {
        background-position: -32px -44px;
      }
      .intl-tel-input .ua {
        background-position: -48px -44px;
      }
      .intl-tel-input .tz {
        background-position: -64px 0;
      }
      .intl-tel-input .tw {
        background-position: -64px -11px;
      }
      .intl-tel-input .tv {
        background-position: -64px -22px;
      }
      .intl-tel-input .tt {
        background-position: -64px -33px;
      }
      .intl-tel-input .tr {
        background-position: -64px -44px;
      }
      .intl-tel-input .to {
        background-position: 0 -55px;
      }
      .intl-tel-input .tn {
        background-position: -16px -55px;
      }
      .intl-tel-input .tm {
        background-position: -32px -55px;
      }
      .intl-tel-input .tl {
        background-position: -48px -55px;
      }
      .intl-tel-input .tk {
        background-position: -64px -55px;
      }
      .intl-tel-input .tj {
        background-position: 0 -66px;
      }
      .intl-tel-input .th {
        background-position: -16px -66px;
      }
      .intl-tel-input .tg {
        background-position: -32px -66px;
      }
      .intl-tel-input .tf {
        background-position: -48px -66px;
      }
      .intl-tel-input .td {
        background-position: -64px -66px;
      }
      .intl-tel-input .tc {
        background-position: -80px 0;
      }
      .intl-tel-input .sz {
        background-position: -80px -11px;
      }
      .intl-tel-input .sy {
        background-position: -80px -22px;
      }
      .intl-tel-input .sx {
        background-position: -80px -33px;
      }
      .intl-tel-input .sv {
        background-position: -80px -44px;
      }
      .intl-tel-input .st {
        background-position: -80px -55px;
      }
      .intl-tel-input .ss {
        background-position: -80px -66px;
      }
      .intl-tel-input .sr {
        background-position: 0 -77px;
      }
      .intl-tel-input .so {
        background-position: -16px -77px;
      }
      .intl-tel-input .sn {
        background-position: -32px -77px;
      }
      .intl-tel-input .sm {
        background-position: -48px -77px;
      }
      .intl-tel-input .sl {
        background-position: -64px -77px;
      }
      .intl-tel-input .sk {
        background-position: -80px -77px;
      }
      .intl-tel-input .si {
        background-position: -96px 0;
      }
      .intl-tel-input .sh {
        background-position: -96px -11px;
      }
      .intl-tel-input .sg {
        background-position: -96px -22px;
      }
      .intl-tel-input .se {
        background-position: -96px -33px;
      }
      .intl-tel-input .sd {
        background-position: -96px -44px;
      }
      .intl-tel-input .sc {
        background-position: -96px -66px;
      }
      .intl-tel-input .sb {
        background-position: -96px -77px;
      }
      .intl-tel-input .sa {
        background-position: 0 -88px;
      }
      .intl-tel-input .rw {
        background-position: -16px -88px;
      }
      .intl-tel-input .ru {
        background-position: -32px -88px;
      }
      .intl-tel-input .rs {
        background-position: -48px -88px;
      }
      .intl-tel-input .ro {
        background-position: -64px -88px;
      }
      .intl-tel-input .qa {
        background-position: -80px -88px;
      }
      .intl-tel-input .py {
        background-position: -96px -88px;
      }
      .intl-tel-input .pw {
        background-position: 0 -99px;
      }
      .intl-tel-input .pt {
        background-position: -16px -99px;
      }
      .intl-tel-input .ps {
        background-position: -32px -99px;
      }
      .intl-tel-input .pr {
        background-position: -48px -99px;
      }
      .intl-tel-input .pn {
        background-position: -64px -99px;
      }
      .intl-tel-input .pm {
        background-position: -80px -99px;
      }
      .intl-tel-input .pl {
        background-position: -96px -99px;
      }
      .intl-tel-input .pk {
        background-position: -112px 0;
      }
      .intl-tel-input .ph {
        background-position: -112px -11px;
      }
      .intl-tel-input .pg {
        background-position: -112px -22px;
      }
      .intl-tel-input .pf {
        background-position: -112px -33px;
      }
      .intl-tel-input .pe {
        background-position: -112px -44px;
      }
      .intl-tel-input .pa {
        background-position: -112px -55px;
      }
      .intl-tel-input .om {
        background-position: -112px -66px;
      }
      .intl-tel-input .nz {
        background-position: -112px -77px;
      }
      .intl-tel-input .nu {
        background-position: -112px -88px;
      }
      .intl-tel-input .nr {
        background-position: -112px -99px;
      }
      .intl-tel-input .bv,
      .intl-tel-input .no,
      .intl-tel-input .sj {
        background-position: 0 -110px;
      }
      .intl-tel-input .nl {
        background-position: -16px -110px;
      }
      .intl-tel-input .ni {
        background-position: -32px -110px;
      }
      .intl-tel-input .ng {
        background-position: -48px -110px;
      }
      .intl-tel-input .nf {
        background-position: -64px -110px;
      }
      .intl-tel-input .ne {
        background-position: -80px -110px;
      }
      .intl-tel-input .nc {
        background-position: -96px -110px;
      }
      .intl-tel-input .na {
        background-position: -112px -110px;
      }
      .intl-tel-input .mz {
        background-position: -128px 0;
      }
      .intl-tel-input .my {
        background-position: -128px -11px;
      }
      .intl-tel-input .mx {
        background-position: -128px -22px;
      }
      .intl-tel-input .mw {
        background-position: -128px -33px;
      }
      .intl-tel-input .mv {
        background-position: -128px -44px;
      }
      .intl-tel-input .mu {
        background-position: -128px -55px;
      }
      .intl-tel-input .mt {
        background-position: -128px -66px;
      }
      .intl-tel-input .ms {
        background-position: -128px -77px;
      }
      .intl-tel-input .mr {
        background-position: -128px -88px;
      }
      .intl-tel-input .mq {
        background-position: -128px -99px;
      }
      .intl-tel-input .mp {
        background-position: -128px -110px;
      }
      .intl-tel-input .mo {
        background-position: 0 -121px;
      }
      .intl-tel-input .mn {
        background-position: -16px -121px;
      }
      .intl-tel-input .mm {
        background-position: -32px -121px;
      }
      .intl-tel-input .ml {
        background-position: -48px -121px;
      }
      .intl-tel-input .mk {
        background-position: -64px -121px;
      }
      .intl-tel-input .mh {
        background-position: -80px -121px;
      }
      .intl-tel-input .mg {
        background-position: -96px -121px;
      }
      .intl-tel-input .me {
        background-position: 0 -132px;
        height: 12px;
      }
      .intl-tel-input .md {
        background-position: -112px -121px;
      }
      .intl-tel-input .mc {
        background-position: -128px -121px;
      }
      .intl-tel-input .ma {
        background-position: -16px -132px;
      }
      .intl-tel-input .ly {
        background-position: -32px -132px;
      }
      .intl-tel-input .lv {
        background-position: -48px -132px;
      }
      .intl-tel-input .lu {
        background-position: -64px -132px;
      }
      .intl-tel-input .lt {
        background-position: -80px -132px;
      }
      .intl-tel-input .ls {
        background-position: -96px -132px;
      }
      .intl-tel-input .lr {
        background-position: -112px -132px;
      }
      .intl-tel-input .lk {
        background-position: -128px -132px;
      }
      .intl-tel-input .li {
        background-position: -144px 0;
      }
      .intl-tel-input .lc {
        background-position: -144px -11px;
      }
      .intl-tel-input .lb {
        background-position: -144px -22px;
      }
      .intl-tel-input .la {
        background-position: -144px -33px;
      }
      .intl-tel-input .kz {
        background-position: -144px -44px;
      }
      .intl-tel-input .ky {
        background-position: -144px -55px;
      }
      .intl-tel-input .kw {
        background-position: -144px -66px;
      }
      .intl-tel-input .kr {
        background-position: -144px -77px;
      }
      .intl-tel-input .kp {
        background-position: -144px -88px;
      }
      .intl-tel-input .kn {
        background-position: -144px -99px;
      }
      .intl-tel-input .km {
        background-position: -144px -110px;
      }
      .intl-tel-input .ki {
        background-position: -144px -121px;
      }
      .intl-tel-input .kh {
        background-position: -144px -132px;
      }
      .intl-tel-input .kg {
        background-position: 0 -144px;
      }
      .intl-tel-input .ke {
        background-position: -16px -144px;
      }
      .intl-tel-input .jp {
        background-position: -32px -144px;
      }
      .intl-tel-input .jo {
        background-position: -48px -144px;
      }
      .intl-tel-input .jm {
        background-position: -64px -144px;
      }
      .intl-tel-input .je {
        background-position: -80px -144px;
      }
      .intl-tel-input .it {
        background-position: -96px -144px;
      }
      .intl-tel-input .is {
        background-position: -112px -144px;
      }
      .intl-tel-input .ir {
        background-position: -128px -144px;
      }
      .intl-tel-input .iq {
        background-position: -144px -144px;
      }
      .intl-tel-input .io {
        background-position: -160px 0;
      }
      .intl-tel-input .in {
        background-position: -160px -11px;
      }
      .intl-tel-input .im {
        background-position: -160px -22px;
        height: 9px;
      }
      .intl-tel-input .il {
        background-position: -160px -31px;
      }
      .intl-tel-input .ie {
        background-position: -160px -42px;
      }
      .intl-tel-input .id {
        background-position: -160px -53px;
      }
      .intl-tel-input .hu {
        background-position: -160px -64px;
      }
      .intl-tel-input .ht {
        background-position: -160px -75px;
      }
      .intl-tel-input .hr {
        background-position: -160px -86px;
      }
      .intl-tel-input .hn {
        background-position: -160px -97px;
      }
      .intl-tel-input .hk {
        background-position: -160px -108px;
      }
      .intl-tel-input .gy {
        background-position: -160px -119px;
      }
      .intl-tel-input .gw {
        background-position: -160px -130px;
      }
      .intl-tel-input .gu {
        background-position: -160px -141px;
      }
      .intl-tel-input .gt {
        background-position: 0 -155px;
      }
      .intl-tel-input .gs {
        background-position: -16px -155px;
      }
      .intl-tel-input .gr {
        background-position: -32px -155px;
      }
      .intl-tel-input .gq {
        background-position: -48px -155px;
      }
      .intl-tel-input .gp {
        background-position: -64px -155px;
      }
      .intl-tel-input .gn {
        background-position: -80px -155px;
      }
      .intl-tel-input .gm {
        background-position: -96px -155px;
      }
      .intl-tel-input .gl {
        background-position: -112px -155px;
      }
      .intl-tel-input .gi {
        background-position: -128px -155px;
      }
      .intl-tel-input .gh {
        background-position: -144px -155px;
      }
      .intl-tel-input .gg {
        background-position: -160px -155px;
      }
      .intl-tel-input .ge {
        background-position: -176px 0;
      }
      .intl-tel-input .gd {
        background-position: -176px -11px;
      }
      .intl-tel-input .gb {
        background-position: -176px -22px;
      }
      .intl-tel-input .ga {
        background-position: -176px -33px;
      }
      .intl-tel-input .bl,
      .intl-tel-input .fr,
      .intl-tel-input .gf,
      .intl-tel-input .mf,
      .intl-tel-input .re {
        background-position: -176px -44px;
      }
      .intl-tel-input .fo {
        background-position: -176px -55px;
      }
      .intl-tel-input .fm {
        background-position: -176px -66px;
      }
      .intl-tel-input .fk {
        background-position: -176px -77px;
      }
      .intl-tel-input .fj {
        background-position: -176px -88px;
      }
      .intl-tel-input .fi {
        background-position: -176px -99px;
      }
      .intl-tel-input .eu {
        background-position: -176px -121px;
      }
      .intl-tel-input .et {
        background-position: -176px -132px;
      }
      .intl-tel-input .es {
        background-position: -176px -143px;
      }
      .intl-tel-input .er {
        background-position: -176px -154px;
      }
      .intl-tel-input .eh {
        background-position: -16px -166px;
      }
      .intl-tel-input .eg {
        background-position: -32px -166px;
      }
      .intl-tel-input .ee {
        background-position: -48px -166px;
      }
      .intl-tel-input .ec {
        background-position: -64px -166px;
      }
      .intl-tel-input .dz {
        background-position: -80px -166px;
      }
      .intl-tel-input .do {
        background-position: -96px -166px;
      }
      .intl-tel-input .dm {
        background-position: -112px -166px;
      }
      .intl-tel-input .dk {
        background-position: -128px -166px;
      }
      .intl-tel-input .dj {
        background-position: -144px -166px;
      }
      .intl-tel-input .de {
        background-position: -160px -166px;
      }
      .intl-tel-input .cz {
        background-position: -176px -166px;
      }
      .intl-tel-input .cy {
        background-position: 0 -177px;
      }
      .intl-tel-input .cx {
        background-position: -16px -177px;
      }
      .intl-tel-input .cw {
        background-position: -32px -177px;
      }
      .intl-tel-input .cv {
        background-position: -48px -177px;
      }
      .intl-tel-input .cu {
        background-position: -64px -177px;
      }
      .intl-tel-input .cs {
        background-position: -80px -177px;
      }
      .intl-tel-input .cr {
        background-position: -96px -177px;
      }
      .intl-tel-input .co {
        background-position: -112px -177px;
      }
      .intl-tel-input .cn {
        background-position: -128px -177px;
      }
      .intl-tel-input .cm {
        background-position: -144px -177px;
      }
      .intl-tel-input .cl {
        background-position: -160px -177px;
      }
      .intl-tel-input .ck {
        background-position: -176px -177px;
      }
      .intl-tel-input .ci {
        background-position: -192px 0;
      }
      .intl-tel-input .cg {
        background-position: -192px -11px;
      }
      .intl-tel-input .cf {
        background-position: -192px -22px;
      }
      .intl-tel-input .cd {
        background-position: -192px -33px;
      }
      .intl-tel-input .cc {
        background-position: -192px -44px;
      }
      .intl-tel-input .ca {
        background-position: -192px -66px;
      }
      .intl-tel-input .bz {
        background-position: -192px -77px;
      }
      .intl-tel-input .by {
        background-position: -192px -88px;
      }
      .intl-tel-input .bw {
        background-position: -192px -99px;
      }
      .intl-tel-input .bt {
        background-position: -192px -110px;
      }
      .intl-tel-input .bs {
        background-position: -192px -121px;
      }
      .intl-tel-input .br {
        background-position: -192px -132px;
      }
      .intl-tel-input .bq {
        background-position: -192px -143px;
      }
      .intl-tel-input .bo {
        background-position: -192px -154px;
      }
      .intl-tel-input .bn {
        background-position: -192px -165px;
      }
      .intl-tel-input .bm {
        background-position: -192px -176px;
      }
      .intl-tel-input .bj {
        background-position: 0 -188px;
      }
      .intl-tel-input .bi {
        background-position: -16px -188px;
      }
      .intl-tel-input .bh {
        background-position: -32px -188px;
      }
      .intl-tel-input .bg {
        background-position: -48px -188px;
      }
      .intl-tel-input .bf {
        background-position: -64px -188px;
      }
      .intl-tel-input .be {
        background-position: -80px -188px;
      }
      .intl-tel-input .bd {
        background-position: -96px -188px;
      }
      .intl-tel-input .bb {
        background-position: -112px -188px;
      }
      .intl-tel-input .ba {
        background-position: -128px -188px;
      }
      .intl-tel-input .az {
        background-position: -144px -188px;
      }
      .intl-tel-input .ax {
        background-position: -160px -188px;
      }
      .intl-tel-input .aw {
        background-position: -176px -188px;
      }
      .intl-tel-input .au,
      .intl-tel-input .hm {
        background-position: -192px -188px;
      }
      .intl-tel-input .at {
        background-position: -208px 0;
      }
      .intl-tel-input .as {
        background-position: -208px -11px;
      }
      .intl-tel-input .ar {
        background-position: -208px -22px;
      }
      .intl-tel-input .ao {
        background-position: -208px -33px;
      }
      .intl-tel-input .an {
        background-position: -208px -44px;
      }
      .intl-tel-input .am {
        background-position: -208px -55px;
      }
      .intl-tel-input .al {
        background-position: -208px -66px;
      }
      .intl-tel-input .ai {
        background-position: -208px -77px;
      }
      .intl-tel-input .ag {
        background-position: -208px -88px;
      }
      .intl-tel-input .af {
        background-position: -208px -99px;
      }
      .intl-tel-input .ae {
        background-position: -208px -110px;
      }
      .intl-tel-input .ad {
        background-position: -208px -121px;
      }
      .intl-tel-input .np {
        background-position: -208px -132px;
      }
      .intl-tel-input .ch {
        background-position: -208px -143px;
      }
      .intl-tel-input {
        position: relative;
        display: inline-block;
      }
      .intl-tel-input .hide {
        display: none;
      }
      .intl-tel-input .v-hide {
        visibility: hidden;
      }
      .intl-tel-input .flag-dropdown {
        position: absolute;
        top: 0;
        bottom: 0;
      }
      .intl-tel-input .flag-dropdown .selected-flag {
        z-index: 1;
        position: relative;
      }
      .intl-tel-input .flag-dropdown .country-list {
        position: absolute;
        z-index: 2;
      }
      .intl-tel-input .country-list {
        list-style: none;
      }
      .intl-tel-input .country-list .flag {
        display: inline-block;
      }
      .intl-tel-input .flag-dropdown:hover {
        cursor: pointer;
      }
      .intl-tel-input input[disabled] + .flag-dropdown:hover {
        cursor: default;
      }
      .intl-tel-input input {
        position: relative;
        z-index: 0;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
      }
      .intl-tel-input.pretty * {
        box-sizing: border-box;
        -moz-box-sizing: border-box;
      }
      .intl-tel-input.pretty .flag-dropdown:hover .selected-flag {
        background-color: rgba(0, 0, 0, 0.05);
      }
      .intl-tel-input.pretty
        input[disabled]
        + .flag-dropdown:hover
        .selected-flag {
        background-color: transparent;
      }
      .intl-tel-input.pretty .flag-dropdown .selected-flag {
        width: 38px;
        height: 100%;
        padding: 0 0 0 8px;
      }
      .intl-tel-input.pretty .flag-dropdown .selected-flag .flag {
        position: absolute;
        top: 50%;
        margin-top: -5px;
      }
      .intl-tel-input.pretty .flag-dropdown .selected-flag .arrow {
        position: relative;
        top: 50%;
        margin-top: -2px;
        left: 20px;
        width: 0;
        height: 0;
        border-left: 3px solid transparent;
        border-right: 3px solid transparent;
        border-top: 4px solid #555;
      }
      .intl-tel-input.pretty .flag-dropdown .selected-flag .arrow.up {
        border-top: none;
        border-bottom: 4px solid #555;
      }
      .intl-tel-input.pretty .flag-dropdown .country-list {
        padding: 0;
        margin: 0 0 0 -1px;
        box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2);
        background-color: #fff;
        border: 1px solid #ccc;
        width: 430px;
        max-height: 200px;
        overflow-y: scroll;
      }
      .intl-tel-input.pretty .flag-dropdown .country-list .divider {
        padding-bottom: 5px;
        margin-bottom: 5px;
        border-bottom: 1px solid #ccc;
      }
      .intl-tel-input.pretty .flag-dropdown .country-list .country {
        line-height: 11px;
        padding: 7px 10px;
      }
      .intl-tel-input.pretty .flag-dropdown .country-list .country .dial-code {
        color: #999;
      }
      .intl-tel-input.pretty .flag-dropdown .country-list .country.highlight {
        background-color: rgba(0, 0, 0, 0.05);
      }
      .intl-tel-input.pretty .flag-dropdown .country-list .country-name,
      .intl-tel-input.pretty .flag-dropdown .country-list .flag {
        margin-right: 6px;
      }
      .intl-tel-input.inside .flag-dropdown {
        padding: 1px;
      }
      .intl-tel-input.inside input[type="tel"],
      .intl-tel-input.inside input[type="text"] {
        padding-left: 44px;
        margin-left: 0;
      }
      .intl-tel-input.outside input[type="tel"],
      .intl-tel-input.outside input[type="text"] {
        border: none;
        margin-left: 38px;
      }
    </style>
    <meta name="generator" content="Gatsby 2.9.4" />
    <title data-react-helmet="true"></title>
    <link
      rel="shortcut icon"
      href="/icons/icon-48x48.png?v=adab01d533cee99b643b261c5b7e021d"
    />
    <link rel="manifest" href="/manifest.webmanifest" />
    <meta name="theme-color" content="#35488a" />
    <link
      rel="apple-touch-icon"
      sizes="48x48"
      href="/icons/icon-48x48.png?v=adab01d533cee99b643b261c5b7e021d"
    />
    <link
      rel="apple-touch-icon"
      sizes="72x72"
      href="/icons/icon-72x72.png?v=adab01d533cee99b643b261c5b7e021d"
    />
    <link
      rel="apple-touch-icon"
      sizes="96x96"
      href="/icons/icon-96x96.png?v=adab01d533cee99b643b261c5b7e021d"
    />
    <link
      rel="apple-touch-icon"
      sizes="144x144"
      href="/icons/icon-144x144.png?v=adab01d533cee99b643b261c5b7e021d"
    />
    <link
      rel="apple-touch-icon"
      sizes="192x192"
      href="/icons/icon-192x192.png?v=adab01d533cee99b643b261c5b7e021d"
    />
    <link
      rel="apple-touch-icon"
      sizes="256x256"
      href="/icons/icon-256x256.png?v=adab01d533cee99b643b261c5b7e021d"
    />
    <link
      rel="apple-touch-icon"
      sizes="384x384"
      href="/icons/icon-384x384.png?v=adab01d533cee99b643b261c5b7e021d"
    />
    <link
      rel="apple-touch-icon"
      sizes="512x512"
      href="/icons/icon-512x512.png?v=adab01d533cee99b643b261c5b7e021d"
    />
    <script>
      (function(w, d, s, l, i) {
        w[l] = w[l] || [];
        w[l].push({ "gtm.start": new Date().getTime(), event: "gtm.js" });
        var f = d.getElementsByTagName(s)[0],
          j = d.createElement(s),
          dl = l != "dataLayer" ? "&l=" + l : "";
        j.async = true;
        j.src = "https://www.googletagmanager.com/gtm.js?id=" + i + dl + "";
        f.parentNode.insertBefore(j, f);
      })(window, document, "script", "dataLayer", "GTM-PNCV6QJ");
    </script>
    <link rel="sitemap" type="application/xml" href="/sitemap.xml" />
    <link
      as="script"
      rel="preload"
      href="/webpack-runtime-b7a69493332313df7e17.js"
    />
    <link as="script" rel="preload" href="/app-fb574d18676ca6ea573b.js" />
    <link as="script" rel="preload" href="/styles-1bf23e0a67f83989389f.js" />
    <link as="script" rel="preload" href="/0-8e63d7b3e5dc30ddbb6d.js" />
    <link as="script" rel="preload" href="/2-64d82d8c5a9ab3d4ac21.js" />
    <link as="script" rel="preload" href="/3-f464c7eaf04aae24017d.js" />
    <link
      as="script"
      rel="preload"
      href="/component---src-pages-index-jsx-8c357ca861a71395ca3a.js"
    />
    <link
      as="fetch"
      rel="preload"
      href="/page-data\index\page-data.json"
      crossorigin="use-credentials"
    />
  </head>
  <body>
    <noscript
      ><iframe
        src="https://www.googletagmanager.com/ns.html?id=GTM-PNCV6QJ"
        height="0"
        width="0"
        style="display: none; visibility: hidden"
      ></iframe></noscript
    ><noscript id="gatsby-noscript"
      >This app works best with JavaScript enabled.</noscript
    >
    <div id="___gatsby"></div>
    <script type="text/javascript">
      var $zoho = $zoho || {};
      var obj = {
        widgetcode:
          "xxxxxx",
        values: {},
        ready: function() {},
      };
      $zoho.salesiq = $zoho.salesiq || obj;
      var d = document;
      s = d.createElement("script");
      s.type = "text/javascript";
      s.id = "zsiqscript";
      s.defer = true;
      s.src = "https://salesiq.zoho.in/widget";
      t = d.getElementsByTagName("script")[0];
      t.parentNode.insertBefore(s, t);
      d.write("<div id='zsiqwidget'></div>");</script
    ><script id="gatsby-script-loader">
      /*<![CDATA[*/ window.pagePath = "/";
      window.webpackCompilationHash = "6d80ab2338b2a5bf64e9"; /*]]>*/</script
    ><script id="gatsby-chunk-mapping">
      /*<![CDATA[*/ window.___chunkMapping = {
        app: ["/app-fb574d18676ca6ea573b.js"],
        "component---node-modules-gatsby-plugin-offline-app-shell-js": [
          "/component---node-modules-gatsby-plugin-offline-app-shell-js-fa011b7a1a340faf1c20.js",
        ],
        "component---src-templates-glossary-jsx": [
          "/component---src-templates-glossary-jsx-e7b43039964cdef584d5.js",
        ],
        "component---src-templates-testimonials-jsx": [
          "/component---src-templates-testimonials-jsx-2a60bf7d7c0be574df4b.js",
        ],
        "component---src-templates-current-opening-jsx": [
          "/component---src-templates-current-opening-jsx-303902b3aeebdd87e40f.js",
        ],
        "component---src-templates-claimproposal-jsx": [
          "/component---src-templates-claimproposal-jsx-e8468d47fe6fb57983a1.js",
        ],
        "component---src-templates-covid-score-jsx": [
          "/component---src-templates-covid-score-jsx-f01576791cd47e609d07.js",
        ],
        "component---src-templates-about-us-jsx": [
          "/component---src-templates-about-us-jsx-1fb9698ece90495850d2.js",
        ],
        "component---src-templates-with-drawn-products-jsx": [
          "/component---src-templates-with-drawn-products-jsx-b637cd2049ebdecc3ca2.js",
        ],
        "component---src-templates-free-look-period-jsx": [
          "/component---src-templates-free-look-period-jsx-75dedd5bc02dec23568d.js",
        ],
        "component---src-templates-tax-benefits-jsx": [
          "/component---src-templates-tax-benefits-jsx-a144dbe7a3a1efb0e4be.js",
        ],
        "component---src-templates-disclaimer-jsx": [
          "/component---src-templates-disclaimer-jsx-1796a612ea675e413ec2.js",
        ],
        "component---src-templates-regulations-on-appointment-jsx": [
          "/component---src-templates-regulations-on-appointment-jsx-68a6413973aeb08aef1c.js",
        ],
        "component---src-templates-antifraud-policy-jsx": [
          "/component---src-templates-antifraud-policy-jsx-7324e5c5cc71f640fd54.js",
        ],
        "component---src-templates-terms-of-usage-jsx": [
          "/component---src-templates-terms-of-usage-jsx-aee028156559cee41463.js",
        ],
        "component---src-templates-media-center-jsx": [
          "/component---src-templates-media-center-jsx-e964c4fd60620e0c2c0d.js",
        ],
        "component---src-templates-network-hospitals-jsx": [
          "/component---src-templates-network-hospitals-jsx-ce1cd26d752b69974269.js",
        ],
        "component---src-templates-list-agents-jsx": [
          "/component---src-templates-list-agents-jsx-9281ddece1c154090160.js",
        ],
        "component---src-templates-downloads-jsx": [
          "/component---src-templates-downloads-jsx-4e112814c5aa01e4c04d.js",
        ],
        "component---src-templates-locate-us-jsx": [
          "/component---src-templates-locate-us-jsx-31c0801c599bccee8f6e.js",
        ],
        "component---src-templates-partners-corner-jsx": [
          "/component---src-templates-partners-corner-jsx-c55ef9493b9f7db9f13d.js",
        ],
        "component---src-templates-privacy-policy-jsx": [
          "/component---src-templates-privacy-policy-jsx-af6ac2adc8a3ef2d3c3e.js",
        ],
        "component---src-templates-dnd-jsx": [
          "/component---src-templates-dnd-jsx-dcf7b4b69d7081e96b41.js",
        ],
        "component---src-templates-diabetes-jsx": [
          "/component---src-templates-diabetes-jsx-a5f7550df56bf775ceac.js",
        ],
        "component---src-templates-sitemap-jsx": [
          "/component---src-templates-sitemap-jsx-fdddbcc6c00eb16f3a1e.js",
        ],
        "component---src-templates-grievance-jsx": [
          "/component---src-templates-grievance-jsx-02334d8a6eca08795a53.js",
        ],
        "component---src-templates-family-health-optima-jsx": [
          "/component---src-templates-family-health-optima-jsx-1e146907863d0d34d10f.js",
        ],
        "component---src-templates-mobile-all-policies-jsx": [
          "/component---src-templates-mobile-all-policies-jsx-273267fb22e1568cc614.js",
        ],
        "component---src-templates-portability-jsx": [
          "/component---src-templates-portability-jsx-6a47edbad54d7e15c303.js",
        ],
        "component---src-templates-fa-qs-jsx": [
          "/component---src-templates-fa-qs-jsx-8a1dd28b1a69806eea85.js",
        ],
        "component---src-templates-list-products-jsx": [
          "/component---src-templates-list-products-jsx-394dcc90b32918d68182.js",
        ],
        "component---src-templates-preventive-health-checkup-jsx": [
          "/component---src-templates-preventive-health-checkup-jsx-f49249c652142c29ae64.js",
        ],
        "component---src-templates-gmc-all-policies-jsx": [
          "/component---src-templates-gmc-all-policies-jsx-e8f074a39e76054be533.js",
        ],
        "component---src-templates-check-eligibility-jsx": [
          "/component---src-templates-check-eligibility-jsx-c7d6abc750fda65ee214.js",
        ],
        "component---src-templates-retail-retail-instant-buy-jsx": [
          "/component---src-templates-retail-retail-instant-buy-jsx-e9d5393789bbc1bcb9a9.js",
        ],
        "component---src-templates-buy-health-insurance-online-jsx": [
          "/component---src-templates-buy-health-insurance-online-jsx-480ef46eaae2262a91f8.js",
        ],
        "component---src-templates-covid-press-release-jsx": [
          "/component---src-templates-covid-press-release-jsx-156bc2316e2058c59024.js",
        ],
        "component---src-templates-talk-to-doctor-jsx": [
          "/component---src-templates-talk-to-doctor-jsx-ed597bad9ccf29ea9d32.js",
        ],
        "component---src-templates-as-check-eligibility-jsx": [
          "/component---src-templates-as-check-eligibility-jsx-18786adef86820bd3b0a.js",
        ],
        "component---src-templates-installment-products-jsx": [
          "/component---src-templates-installment-products-jsx-a79be00482fffd033941.js",
        ],
        "component---src-templates-complete-health-insurance-jsx": [
          "/component---src-templates-complete-health-insurance-jsx-746286c248c62590c6eb.js",
        ],
        "component---src-templates-allpolicies-jsx": [
          "/component---src-templates-allpolicies-jsx-4d4c26f3e3252561601a.js",
        ],
        "component---src-templates-form-release-jsx": [
          "/component---src-templates-form-release-jsx-f9570f4b38516af77163.js",
        ],
        "component---src-templates-thank-you-jsx": [
          "/component---src-templates-thank-you-jsx-0666e3ea2d3cddc6aebe.js",
        ],
        "component---src-templates-static-privacy-jsx": [
          "/component---src-templates-static-privacy-jsx-679ee412f1f8766ca07a.js",
        ],
        "component---src-templates-free-health-insurance-quote-jsx": [
          "/component---src-templates-free-health-insurance-quote-jsx-22693033b56d18cba2dc.js",
        ],
        "component---src-templates-underwriting-philosophy-jsx": [
          "/component---src-templates-underwriting-philosophy-jsx-d11f936f0f309e4811e0.js",
        ],
        "component---src-templates-retail-toi-cardiac-care-jsx": [
          "/component---src-templates-retail-toi-cardiac-care-jsx-a4c5b9b1cfc26f551164.js",
        ],
        "component---src-templates-retail-google-senior-citizen-jsx": [
          "/component---src-templates-retail-google-senior-citizen-jsx-8def1d242a7694207eb5.js",
        ],
        "component---src-templates-plan-list-jsx": [
          "/component---src-templates-plan-list-jsx-81a4c7cd850c4504ed6b.js",
        ],
        "component---src-templates-claim-list-jsx": [
          "/component---src-templates-claim-list-jsx-3358490fc4ed44ae1b9f.js",
        ],
        "component---src-templates-contact-us-jsx": [
          "/component---src-templates-contact-us-jsx-cbc04ef21f0038aebb33.js",
        ],
        "component---src-templates-wellnessand-teli-medicine-service-jsx": [
          "/component---src-templates-wellnessand-teli-medicine-service-jsx-830e0f061f2c2521ff9c.js",
        ],
        "component---src-templates-covid-waiting-period-jsx": [
          "/component---src-templates-covid-waiting-period-jsx-0c3336b9d8cbda31ef76.js",
        ],
        "component---src-templates-plan-details-jsx": [
          "/component---src-templates-plan-details-jsx-06eee87bf0115b785354.js",
        ],
        "component---src-templates-health-checkup-packages-jsx": [
          "/component---src-templates-health-checkup-packages-jsx-e26a61eb53ccc508ce7f.js",
        ],
        "component---src-templates-finance-by-quarter-jsx": [
          "/component---src-templates-finance-by-quarter-jsx-7eb3fea4d67ebabbbf91.js",
        ],
        "component---src-pages-404-js": [
          "/component---src-pages-404-js-8a7f60ab8316e2ed6c94.js",
        ],
        "component---src-pages-index-jsx": [
          "/component---src-pages-index-jsx-8c357ca861a71395ca3a.js",
        ],
        "component---src-pages-page-2-js": [
          "/component---src-pages-page-2-js-a8a3a9875d00b75a7299.js",
        ],
        "component---src-pages-thankyou-js": [
          "/component---src-pages-thankyou-js-64d3c23a8ac1f01ec528.js",
        ],
      }; /*]]>*/</script
    ><script
      src="/component---src-pages-index-jsx-8c357ca861a71395ca3a.js"
      async=""
    ></script
    ><script src="/3-f464c7eaf04aae24017d.js" async=""></script
    ><script src="/2-64d82d8c5a9ab3d4ac21.js" async=""></script
    ><script src="/0-8e63d7b3e5dc30ddbb6d.js" async=""></script
    ><script src="/styles-1bf23e0a67f83989389f.js" async=""></script
    ><script src="/app-fb574d18676ca6ea573b.js" async=""></script
    ><script src="/webpack-runtime-b7a69493332313df7e17.js" async=""></script>
  </body>
</html>

[LekoArts]

Hi!

Sorry to hear you're running into an issue. To help us best begin debugging the underlying cause, it is incredibly helpful if you're able to create a minimal reproduction. This is a simplified example of the issue that makes it clear and obvious what the issue is and how we can begin to debug it.

If you're up for it, we'd very much appreciate if you could provide a minimal reproduction and we'll be able to take another look.

Thanks for using Gatsby! 💜

[mageshpurpleslate]

Sure. Will try to do this.

[njbmartin]

I've faced this issue as well in the past. I've found this happens when using gatsby-plugin-offline.

Opted to just remove gatsby-plugin-offline, which will generate the static HTML as expected.

Bear in mind, you will need to purge the service worker using gatsby-plugin-remove-serviceworker

[mageshpurpleslate]

I've faced this issue as well in the past. I've found this happens when using gatsby-plugin-offline.

Opted to just remove gatsby-plugin-offline, which will generate the static HTML as expected.

Bear in mind, you will need to purge the service worker using gatsby-plugin-remove-serviceworker

Nicholas, thanks for the suggestions. We tried, but it still did not work.

[mageshpurpleslate]

As an update, when we tried with minimal reproduction with all plug ins, it seems to be generating html well. Is there anything else we can try ?

[LekoArts]

gatsby-plugin-offline isn’t the cause of the problem, the HTML is generated as usual:
https://www.gatsbyjs.com/plugins/gatsby-plugin-offline/#empty-view-source-and-seo

It could be many things, so adding code step by step to your reproduction should uncover it. For example if you have logic that checks for window and as a result it'll only render on the client.

[mageshpurpleslate]

gatsby-plugin-offline isn’t the cause of the problem, the HTML is generated as usual:
https://www.gatsbyjs.com/plugins/gatsby-plugin-offline/#empty-view-source-and-seo

It could be many things, so adding code step by step to your reproduction should uncover it. For example if you have logic that checks for window and as a result it'll only render on the client.

@LekoArt Please find the attached repo, where we have added our plug ins and configs. we are able to simulate the problem.

https://github.com/KalaiarasanAyyanar/website-reproducible

You can clone the repo. do "npm install", then "gatsby build" and then "gatsby serve".

Please do let me know if any issues in replicating the issues.

[mageshpurpleslate]

@LekoArts Please find the attached repo, where we have added our plug ins and configs. we are able to simulate the problem.

https://github.com/KalaiarasanAyyanar/website-reproducible

You can clone the repo. do "npm install", then "gatsby build" and then "gatsby serve".

Please do let me know if any issues in replicating the issues.

[github-actions]

Hiya!

This issue has gone quiet. Spooky quiet. 👻

We get a lot of issues, so we currently close issues after 60 days of inactivity. It’s been at least 20 days since the last update here.
If we missed this issue or if you want to keep it open, please reply here.
As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks for being a part of the Gatsby community! 💪💜

[mageshpurpleslate]

@LekoArts an update on this. We managed to resolve the issue.

Below is the solution repo. https://github.com/mageshpurpleslate/gatsby_ssr_with_mui

Thanks for your help