<div class="hide-ie">
        <div id="particles-js-b"></div>
        <div id="particles-js-m"></div>
        <div id="particles-js-f"></div>
        <div id="particles-js-f-blur-bright"></div>
        <div id="central-container">
            <div id="logo-container" class="static-effect animated fadeIn">
                <img id="wh-logo" src="https://i.ibb.co/48Y9QDG/wh-logo.png" class="" />
                <h1 id="westhorpe" class="main-font not-selectable shimmer static-neon" data-text="Westhorpe">Westhorpe</h1>
                <h2 id="house" class="static-neon second-font not-selectable" data-text="house">house</h2>
                <h1 id="coming-soon" class="static-neon tertiary-font not-selectable animated fadeInUp" data-text="Westhorpe">Coming soon</h1>
            </div>
        </div>
    </div>

    <section style="background: url('https://i.ibb.co/gJvy8Pc/bg.jpg') no-repeat center center fixed;"></section>

    <div class="show-ie">
        <div id="static-bg"></div>
    </div>

    <footer>
                <div id="social-icons" class="animated fadeInUp">
                    <input data-val="true" data-val-required="The Email field is required." id="Email" name="Email" placeholder="Join our mailing list" type="text" value="">
                    <input type="submit">
                    <span class="field-validation-valid" data-valmsg-for="Email" data-valmsg-replace="true"></span>
                    <input id="ReturnUrl" name="ReturnUrl" type="hidden" value="/">
                </div>
</footer>
body {
    margin: 0;
    font: normal 75% museo-sans Arial, Helvetica, sans-serif;
    overflow: hidden;
}

canvas {
    display: block;
    vertical-align: bottom;
    position: relative;

}

@media (min-width: 1200px) {
    canvas {
        overflow: hidden;
        width: 120% !important;
        height: 120% !important;
        top: -10%;
        left: -10%;
    }
}

a {
    text-decoration: none;
}

#particles-js-f-blur-bright {
    z-index: 4;
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("");
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    -o-filter: blur(5px);
    -ms-filter: blur(5px);
    filter: blur(5px);
}

#particles-js-f {
    z-index: 3;
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("");
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-filter: blur(4px);
    -moz-filter: blur(4px);
    -o-filter: blur(4px);
    -ms-filter: blur(4px);
    filter: blur(4px);
}

#particles-js-m {
    z-index: 2;
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url("");
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -o-filter: blur(3px);
    -ms-filter: blur(3px);
    filter: blur(3px);
}

#particles-js-b {
    z-index: 1;
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #021C00;
    background-image: url("");
    background-repeat: no-repeat;
    background-size: cover;
}

.text-effect {
    z-index: 2;
    overflow: hidden;
    position: absolute;
    -webkit-filter: contrast(96%) brightness(111%);
    filter: contrast(96%) brightness(111%);
}

.static-effect {
    position: absolute;
    text-align: center;
    z-index: 4;
    overflow: hidden;

}

.static-neon {
    position: relative;
    color: transparent;
    background: #E0AE7B;
    background: -moz-linear-gradient(45deg, #E0AE7B, #D5873F);
    background: -webkit-linear-gradient(45deg, #E0AE7B, #D5873F);
    background: -o-linear-gradient(45deg, #E0AE7B, #D5873F);
    background: -ms-linear-gradient(45deg, #E0AE7B, #D5873F); /*For IE10*/
    background: linear-gradient(45deg, #E0AE7B, #D5873F);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#E0AE7B', endColorstr='#D5873F'); /*For IE7-8-9*/
    height: 1%; /*For IE7*/
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.static-neon::before {
    content: attr(data-text);
    color: white;
    -webkit-filter: blur(0.00em);
    filter: blur(0.00em);
    position: absolute;
    top: 0;
    pointer-events: none;
}

.static-neon::after {
    mix-blend-mode: difference;
}

.neon {
    position: relative;
    background: #021C00;
    color: transparent;
}

.neon::before {
    content: attr(data-text);
    color: white;
    -webkit-filter: blur(0.00em);
    filter: blur(0.00em);
    position: absolute;
    top: 0;
    pointer-events: none;
}

.neon::after {
    mix-blend-mode: difference;
}

.gradient,
.spotlight {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    pointer-events: none;
    z-index: 1;
}

.gradient {
    background: -webkit-linear-gradient(45deg, #E0AE7B, #D5873F);
    background: linear-gradient(45deg, #E0AE7B, #D5873F);
    mix-blend-mode: multiply;
}

.spotlight {
    -webkit-animation: light 15s infinite linear;
    animation: light 15s infinite linear;
    background: -webkit-radial-gradient(circle, #CA781F, rgba(0, 0, 0, 0) 25%) 0 0/25% 25%, -webkit-radial-gradient(circle, #CA781F, #021C00 25%) 50% 50%/12.5% 12.5%;
    background: radial-gradient(circle, #CA781F, rgba(0, 0, 0, 0) 25%) 0 0/25% 25%, radial-gradient(circle, #CA781F, #021C00 5%) 50% 50%/12.5% 12.5%;
    mix-blend-mode: color-dodge;

}

.neon, .static-neon {
    text-transform: uppercase;
    text-align: center;
    margin: 0;
}

.main-font {
    font: 500 42px 'museo-sans';
    letter-spacing: 11px;
}

.second-font {
    font: 100 37px 'museo-sans';
    letter-spacing: 9px;
}

.tertiary-font {
    font: 500 12px 'museo-sans';
    letter-spacing: 8px;
}

.neon:focus, .static-neon:focus {
    outline: none;
    border: 1px dotted white;
}

#central-container {
    display: table;
    margin: 0;
    position: initial;
    text-align: center;
}

.not-selectable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#wh-logo {
    margin-left: auto;
    margin-right: auto;
    display: flex;
    height: 50%;
    width: 50%;
    margin-bottom: 10px;
}

.shimmer {
    font-weight: 900;
    font-size: 31px;
    margin: 0 auto;
    display: inline;
    text-align: center;
    color: rgba(255, 255, 255, 0.1);
    background: -webkit-gradient(linear, left top, right top, from(#D5873F), to(#f19d45), color-stop(0.5, #E0AE7B));
    background: -moz-gradient(linear, left top, right top, from(#D5873F), to(#f19d45), color-stop(0.5, #E0AE7B));
    background: gradient(linear, left top, right top, from(#D5873F), to(#f19d45), color-stop(0.5, #E0AE7B));
    -webkit-background-clip: text;
    -moz-background-clip: text;
    background-clip: text;
    -webkit-animation-name: shimmer;
    -moz-animation-name: shimmer;
    animation-name: shimmer;
    -webkit-animation-duration: 13s;
    -moz-animation-duration: 13s;
    animation-duration: 13s;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    background-repeat: no-repeat;
    background-position: 0 0;
    background-color: #f19d45;

}

@-moz-keyframes shimmer {
    0% {
        background-position: top left;
    }
    50% {
        background-position: top right;
    }
    100% {
        background-position: top left;
    }
}

@-webkit-keyframes shimmer {
    0% {
        background-position: top left;
    }
    50% {
        background-position: top right;
    }
    100% {
        background-position: top left;
    }
}

@-o-keyframes shimmer {
    0% {
        background-position: top left;
    }
    50% {
        background-position: top right;
    }
    100% {
        background-position: top left;
    }
}

@keyframes shimmer {
    0% {
        background-position: top left;
    }
    50% {
        background-position: top right;
    }
    100% {
        background-position: top left;
    }
}

#coming-soon {
    -webkit-animation-delay: 0.7s; /* Safari 4.0 - 8.0 */
    animation-delay: 0.7s;
}

#logo-container {
    position: absolute;
    text-align: center;
    width: 100%;
    z-index: 999;
    -webkit-animation-delay: 0.15s; /* Safari 4.0 - 8.0 */
    animation-delay: 0.15s;
}

#social-icons {
    display: inline-table;
    -webkit-animation-delay: 0.75s; /* Safari 4.0 - 8.0 */
    animation-delay: 0.75s;
}

footer {
    position: absolute;
    text-align: center;
    width: 100%;
    z-index: 999;
    font-size: 27px;
}

@media (orientation: portrait) {
    footer {
        bottom: 55px;
    }
    #logo-container {
        top: 25%;
    }

}

@media (orientation: landscape) {
    footer {
        bottom: 20px;
    }
     #logo-container {
        top: 15%;
    }
}

footer a {
    text-align: center;
}

footer i {
    width: 30px;
    height: 30px;
    margin-right: 3px;
    margin-left: 3px;

}

.golden-grad-shad {
    color: transparent;
    box-shadow: 0 0 0 #f9a446;
    background: #E0AE7B;
    background: -moz-linear-gradient(45deg, #E0AE7B, #D5873F);
    background: -webkit-linear-gradient(45deg, #E0AE7B, #D5873F);
    background: -o-linear-gradient(45deg, #E0AE7B, #D5873F);
    background: -ms-linear-gradient(45deg, #E0AE7B, #D5873F); /*For IE10*/
    background: linear-gradient(45deg, #E0AE7B, #D5873F);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#E0AE7B', endColorstr='#D5873F'); /*For IE7-8-9*/
    height: 1%; /*For IE7*/
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
    -moz-box-shadow: 0 0 0 #f9a446;
    -webkit-box-shadow: 0 0 0 #f9a446;
    -webkit-filter: drop-shadow(0px 0px 0px rgba(255, 255, 255, 0.80));
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.golden-color .path1:before,
.golden-color .path2:before,
.golden-color .path3:before,
.golden-color .path4:before {
    color: #E0AE7B;
}

footer i:before {
    display: flex;
    justify-content: center;
    align-items: center;
}

footer i:hover {
    cursor: pointer;
    -webkit-filter: drop-shadow(0px 0px 8px rgba(255, 255, 255, 0.8));
}

i.fa-instagram {
}

#static-bg {
    background: url('../Assets/img//bg_mobile.jpg') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 950px;
}



@media (min-width: 576px) {
    footer i {
        font-size: 30px !important;
        width: 32px;
        height: 32px !important;
    }

    #wh-logo {
        width: 31%;
    }

    .main-font {
        font-size: 42px;
    }

    .shimmer {
        font-size: 36px;
    }

    .second-font {
        font-size: 37px;
    }

    .tertiary-font {
        font-size: 12px;
    }
    @media (orientation: portrait) {
        #logo-container {
            top: 35%;
        }
    }
    @media (orientation: landscape) {
         #logo-container {
            top: 27%;
        }
    }

}

@media (min-width: 768px) {
    #static-bg {
        background: url('../Assets/img//bg.jpg') no-repeat center center / cover fixed;
    }

    footer {
        bottom: 50px;
    }

    footer i {
        font-size: 35px !important;
        width: 40px;
        height: 40px !important;;
    }

    #wh-logo {
        width: 11%;
        height: 34%;
    }

    .shimmer {
        font-size: 3em;
    }

    .main-font {
        font-size: 48px;
    }

    .second-font {
        font-size: 41px;
    }

    .tertiary-font {
        font-size: 13px;
    }
}

@media (min-width: 992px) {
    footer {
        bottom: 50px;
    }

    footer i {
        font-size: 40px !important;
        width: 45px;
        height: 45px !important;;
    }

    .main-font {
        font-size: 51px;
    }

    .shimmer {
        font-size: 4em;
    }

    .second-font {
        font-size: 44px;
    }

    .tertiary-font {
        font-size: 15px;
    }
}

@media (min-width: 1200px) {
    footer {
        bottom: 72px;
    }

    footer i {
        font-size: 50px !important;
        width: 60px;
        height: 60px !important;
    }

    .main-font {
        font-size: 55px;
    }

    .shimmer {
        font-size: 4em;
    }

    .second-font {
        font-size: 47px;
    }

    .tertiary-font {
        font-size: 18px;
    }
}

input[type="text"] {
    font: normal 75% museo-sans Arial, Helvetica, sans-serif;
    padding: 3px 70px 3px 10px;
    background: transparent;
    color: #E0AE7B;
    border:  rgba(224,174,123,0.8)  solid 2px;
    width: 250px;
    font-size: 17px;
    height: 31px;
}

input {
    border-radius: 3px;
}

input:focus {
    outline: none !important;
    border: #D5873F solid 2px;
    box-shadow: 0 0 10px #D5873F;
}

input[type="submit"] {
    font: normal 75% museo-sans Arial, Helvetica, sans-serif;
    font-size: 17px;
    margin-left: -80px;
    width: 80px;
    border-radius: 0px;
    height: 38px;
    box-shadow: 0 0 0 #f9a446;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d5873f+0,f19d45+51,e0ae7b+100 */
    background: rgb(213,135,63); /* Old browsers */
    background: -moz-linear-gradient(-45deg,  rgba(213,135,63,0.8) 0%, rgba(241,157,69,0.7) 51%, rgba(224,174,123,0.8) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg,  rgba(213,135,63,0.8) 0%,rgba(241,157,69,0.7) 51%,rgba(224,174,123,0.8) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg,  rgba(213,135,63,0.8) 0%,rgba(241,157,69,1) 51%,rgba(224,174,123,0.8) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d5873f', endColorstr='#e0ae7b',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    color: rgba(4,36,1, 0.85);
    border: none;
    -webkit-appearance: none;
    font-weight: 600;
    cursor: pointer;
}

input[type="text"]:focus ~ input[type="submit"] {
    color: rgba(4,36,1, 1);
    background: rgb(213,135,63); /* Old browsers */
    background: -moz-linear-gradient(-45deg,  rgba(213,135,63,1) 0%, rgba(241,157,69,1) 51%, rgba(224,174,123,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg,  rgba(213,135,63,1) 0%,rgba(241,157,69,1) 51%,rgba(224,174,123,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg,  rgba(213,135,63,1) 0%,rgba(241,157,69,1) 51%,rgba(224,174,123,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

}

::-webkit-input-placeholder { /* Chrome */
    color:  rgba(213,135,63,0.65);
}
:-ms-input-placeholder { /* IE 10+ */
    color:  rgba(213,135,63,0.65);
}
::-moz-placeholder { /* Firefox 19+ */
    color:  rgba(213,135,63,0.65);
    opacity: 1;
}
:-moz-placeholder { /* Firefox 4 - 18 */
    color:  rgba(213,135,63,0.65);
    opacity: 1;
}

#client-message {
    font-size: 20px;   
}

@media (max-width: 768px) {
    input[type="text"] {
        padding: 2px 80px 2px 8px;
        border:  rgba(224,174,123,0.8)  solid 1px;
        width: 180px;
        font-size: 15px;
        height: 31px;
    }

    input[type="submit"] {
        font-size: 15px;
        border-radius: 1px;
        width: 80px;
        height: 38px;
    }
    #client-message {
        font-size: 15px;
        padding: 0px 70px;
        line-height: 20px; 
    }
}

// This is just to auto-update the data-text if you're editing it directly on the page and is not required for the actual effect
$('[data-text]').on('keyup', function(){
  $(this).attr('data-text', $(this).text());
});

particlesJS("particles-js-f", {
  "particles": {
    "number": {
      "value": 670,
      "density": {
        "enable": true,
        "value_area": 1000
      }
    },
    "color": {
      "value": "#116007"
    },
    "shape": {
      "type": "circle",
      "stroke": {
        "width": 0.06,
        "color": "#116007"
      },
      "polygon": {
        "nb_sides": 5
      },
      "image": {
        "src": "img/github.svg",
        "width": 100,
        "height": 100
      }
    },
    "opacity": {
      "value": 0.18,
      "random": true,
      "anim": {
        "enable": true,
        "speed": 0.01,
        "opacity_min": 0.065,
        "sync": true
      }
    },
    "size": {
      "value": 60,
      "random": false,
      "anim": {
        "enable": true,
        "speed": 4,
        "size_min": 55,
        "sync": false
      }
    },
    "line_linked": {
      "enable": false,
      "distance": 1500,
      "color": "#ffffff",
      "opacity": 0.4,
      "width": 2
    },
    "move": {
      "enable": true,
      "speed": 1,
      "direction": "none",
      "random": true,
      "straight": false,
      "out_mode": "out",
      "bounce": false,
      "attract": {
        "enable": false,
        "rotateX": 1600,
        "rotateY": 200
      }
    }
  },
  "interactivity": {
    "detect_on": "canvas",
    "events": {
      "onhover": {
        "enable": false,
        "mode": "bubble"
      },
      "onclick": {
        "enable": false,
        "mode": "bubble"
      },
      "resize": true
    },
    "modes": {
      "grab": {
        "distance": 400,
        "line_linked": {
          "opacity": 0.5
        }
      },
      "bubble": {
        "distance": 36.54347455356053,
        "size": 33,
        "duration": 0.3,
        "opacity": 3,
        "speed": 3
      },
      "repulse": {
        "distance": 56.84540486109416,
        "duration": 0.4
      },
      "push": {
        "particles_nb": 4
      },
      "remove": {
        "particles_nb": 2
      }
    }
  },
  "retina_detect": true
});


particlesJS("particles-js-m", {
  "particles": {
    "number": {
      "value": 50,
      "density": {
        "enable": true,
        "value_area": 1000
      }
    },
    "color": {
      "value": "#116007"
    },
    "shape": {
      "type": "circle",
      "stroke": {
        "width": 0.06,
        "color": "#116007"
      },
      "polygon": {
        "nb_sides": 5
      },
      "image": {
        "src": "img/github.svg",
        "width": 100,
        "height": 100
      }
    },
    "opacity": {
      "value": 0.09,
      "random": true,
      "anim": {
        "enable": false,
        "speed": 3,
        "opacity_min": 0.03,
        "sync": false
      }
    },
    "size": {
      "value": 60,
      "random": false,
      "anim": {
        "enable": true,
        "speed": 4,
        "size_min": 55,
        "sync": false
      }
    },
    "line_linked": {
      "enable": false,
      "distance": 500,
      "color": "#ffffff",
      "opacity": 0.4,
      "width": 2
    },
    "move": {
      "enable": true,
      "speed": 10,
      "direction": "none",
      "random": true,
      "straight": false,
      "out_mode": "out",
      "bounce": false,
      "attract": {
        "enable": false,
        "rotateX": 600,
        "rotateY": 1200
      }
    }
  },
  "interactivity": {
    "detect_on": "canvas",
    "events": {
      "onhover": {
        "enable": false,
        "mode": "bubble"
      },
      "onclick": {
        "enable": true,
        "mode": "bubble"
      },
      "resize": true
    },
    "modes": {
      "grab": {
        "distance": 400,
        "line_linked": {
          "opacity": 0.5
        }
      },
      "bubble": {
        "distance": 231,
        "size": 68,
        "duration": 0.5,
        "opacity": 0.6,
        "speed": 1
      },
      "repulse": {
        "distance": 56.84540486109416,
        "duration": 0.4
      },
      "push": {
        "particles_nb": 4
      },
      "remove": {
        "particles_nb": 2
      }
    }
  },
  "retina_detect": true
});

particlesJS("particles-js-f-blur-bright", {
  "particles": {
    "number": {
      "value": 3,
      "density": {
        "enable": true,
        "value_area": 800
      }
    },
    "color": {
      "value": "#1da70d"
    },
    "shape": {
      "type": "circle",
      "stroke": {
        "width": 0.1,
        "color": "#000100"
      },
      "polygon": {
        "nb_sides": 5
      },
      "image": {
        "src": "img/github.svg",
        "width": 100,
        "height": 100
      }
    },
    "opacity": {
      "value": 0.4,
      "random": true,
      "anim": {
        "enable": false,
        "speed": 23,
        "opacity_min": 0.3,
        "sync": false
      }
    },
    "size": {
      "value": 70,
      "random": false,
      "anim": {
        "enable": true,
        "speed": 1,
        "size_min": 50,
        "sync": false
      }
    },
    "line_linked": {
      "enable": false,
      "distance": 500,
      "color": "#ffffff",
      "opacity": 0.9,
      "width": 2
    },
    "move": {
      "enable": true,
      "speed": 4,
      "direction": "none",
      "random": true,
      "straight": false,
      "out_mode": "out",
      "bounce": false,
      "attract": {
        "enable": false,
        "rotateX": 600,
        "rotateY": 1200
      }
    }
  },
  "interactivity": {
    "detect_on": "canvas",
    "events": {
      "onhover": {
        "enable": true,
        "mode": "bubble"
      },
      "onclick": {
        "enable": false,
        "mode": "bubble"
      },
      "resize": true
    },
    "modes": {
      "grab": {
        "distance": 400,
        "line_linked": {
          "opacity": 0.5
        }
      },
      "bubble": {
        "distance": 231,
        "size": 68,
        "duration": 0.5,
        "opacity": 0.6,
        "speed": 1
      },
      "repulse": {
        "distance": 56.84540486109416,
        "duration": 0.4
      },
      "push": {
        "particles_nb": 4
      },
      "remove": {
        "particles_nb": 2
      }
    }
  },
  "retina_detect": true
});



var count_particles, stats, update;

// document.body.appendChild(stats.domElement);
count_particles = document.querySelector('.js-count-particles');
update = function() {
  /*
  stats.begin();
  stats.end();
  if (window.pJSDom[0].pJS.particles && window.pJSDom[0].pJS.particles.array) {
    // count_particles.innerText = window.pJSDom[0].pJS.particles.array.length;
  }
  */
  requestAnimationFrame(update);
};
requestAnimationFrame(update);



// Get IE or Edge browser version
var version = detectIE();

if (version === false) {
    $('.hide-ie').show();
    $('.social-icon').addClass('golden-grad-shad');
    $('.social-icon').removeClass('golden-color');
    $('.show-ie').hide();

} else if (version >= 12) {
    $('.social-icon').addClass('golden-color');
    $('.social-icon').removeClass('golden-grad-shad');
    $('.hide-ie').hide();
    $('.show-ie').show();
} else {
    $('.social-icon').addClass('golden-color');
    $('.social-icon').removeClass('golden-grad-shad');
    $('.hide-ie').hide();
    $('.show-ie').show();
}

/**
 * detect IE
 * returns version of IE or false, if browser is not Internet Explorer
 */
function detectIE() {
    var ua = window.navigator.userAgent;

    // Test values; Uncomment to check result …

    // IE 10
    // ua = 'Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)';

    // IE 11
    // ua = 'Mozilla/5.0 (Windows NT 6.3; Trident/7.0; rv:11.0) like Gecko';

    // Edge 12 (Spartan)
    // ua = 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.71 Safari/537.36 Edge/12.0';

    // Edge 13
    // ua = 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Safari/537.36 Edge/13.10586';

    var msie = ua.indexOf('MSIE ');
    if (msie > 0) {
        // IE 10 or older => return version number
        return parseInt(ua.substring(msie + 5, ua.indexOf('.', msie)), 10);
    }

    var trident = ua.indexOf('Trident/');
    if (trident > 0) {
        // IE 11 => return version number
        var rv = ua.indexOf('rv:');
        return parseInt(ua.substring(rv + 3, ua.indexOf('.', rv)), 10);
    }

    var edge = ua.indexOf('Edge/');
    if (edge > 0) {
        // Edge (IE 12+) => return version number
        return parseInt(ua.substring(edge + 5, ua.indexOf('.', edge)), 10);
    }

    // other browser
    return false;
}

External CSS

  1. https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css
  2. https://use.typekit.net/bgy2xqh.css

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js
  2. https://cdnjs.cloudflare.com/ajax/libs/particles.js/2.0.0/particles.min.js