/* Minification failed. Returning unminified contents.
(2348,24): run-time error CSS1039: Token not allowed after unary operator: '-vh'
(2988,1): run-time error CSS1019: Unexpected token, found '}'
 */
/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
    line-height: 1.15; /* 1 */
    -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers.
 */

body {
    margin: 0;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
    box-sizing: content-box; /* 1 */
    height: 0; /* 1 */
    overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */

a {
    background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
    border-bottom: none; /* 1 */
    text-decoration: underline; /* 2 */
    text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
    font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */

small {
    font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */

img {
    border-style: none;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
    font-family: inherit; /* 1 */
    font-size: 100%; /* 1 */
    line-height: 1.15; /* 1 */
    margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input { /* 1 */
    overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
    text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

button,
[type="button"],
[type="reset"],
[type="submit"] {
    -webkit-appearance: button;
}

    /**
 * Remove the inner border and padding in Firefox.
 */

    button::-moz-focus-inner,
    [type="button"]::-moz-focus-inner,
    [type="reset"]::-moz-focus-inner,
    [type="submit"]::-moz-focus-inner {
        border-style: none;
        padding: 0;
    }

    /**
 * Restore the focus styles unset by the previous rule.
 */

    button:-moz-focusring,
    [type="button"]:-moz-focusring,
    [type="reset"]:-moz-focusring,
    [type="submit"]:-moz-focusring {
        outline: 1px dotted ButtonText;
    }

/**
 * Correct the padding in Firefox.
 */

fieldset {
    padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
    box-sizing: border-box; /* 1 */
    color: inherit; /* 2 */
    display: table; /* 1 */
    max-width: 100%; /* 1 */
    padding: 0; /* 3 */
    white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
    vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */

textarea {
    overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */

[type="checkbox"],
[type="radio"] {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
    -webkit-appearance: textfield; /* 1 */
    outline-offset: -2px; /* 2 */
}

    /**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

    [type="search"]::-webkit-search-decoration {
        -webkit-appearance: none;
    }

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
    -webkit-appearance: button; /* 1 */
    font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */

details {
    display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
    display: list-item;
}

/* Misc
   ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */

template {
    display: none;
}

/**
 * Add the correct display in IE 10.
 */

[hidden] {
    display: none;
}
/*!
 * Bootstrap Grid v4.1.1 (https://getbootstrap.com/)
 * Copyright 2011-2018 The Bootstrap Authors
 * Copyright 2011-2018 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */
@-ms-viewport {
  width: device-width;
}

html {
  box-sizing: border-box;
  -ms-overflow-style: scrollbar;
}

*,
*::before,
*::after {
  box-sizing: inherit;
}

.container {
  width: 100%;
  padding-right: 5px;
  padding-left: 5px;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .container {
    max-width: 540px;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 720px;
  }
}

@media (min-width: 992px) {
  .container {
    max-width: 960px;
  }
}

@media (min-width: 1200px) {
  .container {
    max-width: 1140px;
  }
}

.container-fluid {
  width: 100%;
  padding-right: 5px;
  padding-left: 5px;
  margin-right: auto;
  margin-left: auto;
}

.row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -5px;
  margin-left: -5px;
}

.no-gutters {
  margin-right: 0;
  margin-left: 0;
}

.no-gutters > .col,
.no-gutters > [class*="col-"] {
  padding-right: 0;
  padding-left: 0;
}

.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col,
.col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm,
.col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md,
.col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg,
.col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl,
.col-xl-auto {
  position: relative;
  width: 100%;
  min-height: 1px;
  padding-right: 5px;
  padding-left: 5px;
}

.col {
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -ms-flex-positive: 1;
  flex-grow: 1;
  max-width: 100%;
}

.col-auto {
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  width: auto;
  max-width: none;
}

.col-1 {
  -ms-flex: 0 0 8.333333%;
  flex: 0 0 8.333333%;
  max-width: 8.333333%;
}

.col-2 {
  -ms-flex: 0 0 16.666667%;
  flex: 0 0 16.666667%;
  max-width: 16.666667%;
}

.col-3 {
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  max-width: 25%;
}

.col-4 {
  -ms-flex: 0 0 33.333333%;
  flex: 0 0 33.333333%;
  max-width: 33.333333%;
}

.col-5 {
  -ms-flex: 0 0 41.666667%;
  flex: 0 0 41.666667%;
  max-width: 41.666667%;
}

.col-6 {
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  max-width: 50%;
}

.col-7 {
  -ms-flex: 0 0 58.333333%;
  flex: 0 0 58.333333%;
  max-width: 58.333333%;
}

.col-8 {
  -ms-flex: 0 0 66.666667%;
  flex: 0 0 66.666667%;
  max-width: 66.666667%;
}

.col-9 {
  -ms-flex: 0 0 75%;
  flex: 0 0 75%;
  max-width: 75%;
}

.col-10 {
  -ms-flex: 0 0 83.333333%;
  flex: 0 0 83.333333%;
  max-width: 83.333333%;
}

.col-11 {
  -ms-flex: 0 0 91.666667%;
  flex: 0 0 91.666667%;
  max-width: 91.666667%;
}

.col-12 {
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
}

.order-first {
  -ms-flex-order: -1;
  order: -1;
}

.order-last {
  -ms-flex-order: 13;
  order: 13;
}

.order-0 {
  -ms-flex-order: 0;
  order: 0;
}

.order-1 {
  -ms-flex-order: 1;
  order: 1;
}

.order-2 {
  -ms-flex-order: 2;
  order: 2;
}

.order-3 {
  -ms-flex-order: 3;
  order: 3;
}

.order-4 {
  -ms-flex-order: 4;
  order: 4;
}

.order-5 {
  -ms-flex-order: 5;
  order: 5;
}

.order-6 {
  -ms-flex-order: 6;
  order: 6;
}

.order-7 {
  -ms-flex-order: 7;
  order: 7;
}

.order-8 {
  -ms-flex-order: 8;
  order: 8;
}

.order-9 {
  -ms-flex-order: 9;
  order: 9;
}

.order-10 {
  -ms-flex-order: 10;
  order: 10;
}

.order-11 {
  -ms-flex-order: 11;
  order: 11;
}

.order-12 {
  -ms-flex-order: 12;
  order: 12;
}

.offset-1 {
  margin-left: 8.333333%;
}

.offset-2 {
  margin-left: 16.666667%;
}

.offset-3 {
  margin-left: 25%;
}

.offset-4 {
  margin-left: 33.333333%;
}

.offset-5 {
  margin-left: 41.666667%;
}

.offset-6 {
  margin-left: 50%;
}

.offset-7 {
  margin-left: 58.333333%;
}

.offset-8 {
  margin-left: 66.666667%;
}

.offset-9 {
  margin-left: 75%;
}

.offset-10 {
  margin-left: 83.333333%;
}

.offset-11 {
  margin-left: 91.666667%;
}

@media (min-width: 576px) {
  .col-sm {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }
  .col-sm-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: none;
  }
  .col-sm-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .col-sm-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-sm-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-sm-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .col-sm-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }
  .col-sm-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-sm-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }
  .col-sm-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .col-sm-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-sm-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
  .col-sm-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }
  .col-sm-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .order-sm-first {
    -ms-flex-order: -1;
    order: -1;
  }
  .order-sm-last {
    -ms-flex-order: 13;
    order: 13;
  }
  .order-sm-0 {
    -ms-flex-order: 0;
    order: 0;
  }
  .order-sm-1 {
    -ms-flex-order: 1;
    order: 1;
  }
  .order-sm-2 {
    -ms-flex-order: 2;
    order: 2;
  }
  .order-sm-3 {
    -ms-flex-order: 3;
    order: 3;
  }
  .order-sm-4 {
    -ms-flex-order: 4;
    order: 4;
  }
  .order-sm-5 {
    -ms-flex-order: 5;
    order: 5;
  }
  .order-sm-6 {
    -ms-flex-order: 6;
    order: 6;
  }
  .order-sm-7 {
    -ms-flex-order: 7;
    order: 7;
  }
  .order-sm-8 {
    -ms-flex-order: 8;
    order: 8;
  }
  .order-sm-9 {
    -ms-flex-order: 9;
    order: 9;
  }
  .order-sm-10 {
    -ms-flex-order: 10;
    order: 10;
  }
  .order-sm-11 {
    -ms-flex-order: 11;
    order: 11;
  }
  .order-sm-12 {
    -ms-flex-order: 12;
    order: 12;
  }
  .offset-sm-0 {
    margin-left: 0;
  }
  .offset-sm-1 {
    margin-left: 8.333333%;
  }
  .offset-sm-2 {
    margin-left: 16.666667%;
  }
  .offset-sm-3 {
    margin-left: 25%;
  }
  .offset-sm-4 {
    margin-left: 33.333333%;
  }
  .offset-sm-5 {
    margin-left: 41.666667%;
  }
  .offset-sm-6 {
    margin-left: 50%;
  }
  .offset-sm-7 {
    margin-left: 58.333333%;
  }
  .offset-sm-8 {
    margin-left: 66.666667%;
  }
  .offset-sm-9 {
    margin-left: 75%;
  }
  .offset-sm-10 {
    margin-left: 83.333333%;
  }
  .offset-sm-11 {
    margin-left: 91.666667%;
  }
}

@media (min-width: 768px) {
  .col-md {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }
  .col-md-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: none;
  }
  .col-md-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .col-md-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-md-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-md-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .col-md-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }
  .col-md-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-md-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }
  .col-md-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .col-md-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-md-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
  .col-md-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }
  .col-md-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .order-md-first {
    -ms-flex-order: -1;
    order: -1;
  }
  .order-md-last {
    -ms-flex-order: 13;
    order: 13;
  }
  .order-md-0 {
    -ms-flex-order: 0;
    order: 0;
  }
  .order-md-1 {
    -ms-flex-order: 1;
    order: 1;
  }
  .order-md-2 {
    -ms-flex-order: 2;
    order: 2;
  }
  .order-md-3 {
    -ms-flex-order: 3;
    order: 3;
  }
  .order-md-4 {
    -ms-flex-order: 4;
    order: 4;
  }
  .order-md-5 {
    -ms-flex-order: 5;
    order: 5;
  }
  .order-md-6 {
    -ms-flex-order: 6;
    order: 6;
  }
  .order-md-7 {
    -ms-flex-order: 7;
    order: 7;
  }
  .order-md-8 {
    -ms-flex-order: 8;
    order: 8;
  }
  .order-md-9 {
    -ms-flex-order: 9;
    order: 9;
  }
  .order-md-10 {
    -ms-flex-order: 10;
    order: 10;
  }
  .order-md-11 {
    -ms-flex-order: 11;
    order: 11;
  }
  .order-md-12 {
    -ms-flex-order: 12;
    order: 12;
  }
  .offset-md-0 {
    margin-left: 0;
  }
  .offset-md-1 {
    margin-left: 8.333333%;
  }
  .offset-md-2 {
    margin-left: 16.666667%;
  }
  .offset-md-3 {
    margin-left: 25%;
  }
  .offset-md-4 {
    margin-left: 33.333333%;
  }
  .offset-md-5 {
    margin-left: 41.666667%;
  }
  .offset-md-6 {
    margin-left: 50%;
  }
  .offset-md-7 {
    margin-left: 58.333333%;
  }
  .offset-md-8 {
    margin-left: 66.666667%;
  }
  .offset-md-9 {
    margin-left: 75%;
  }
  .offset-md-10 {
    margin-left: 83.333333%;
  }
  .offset-md-11 {
    margin-left: 91.666667%;
  }
}

@media (min-width: 992px) {
  .col-lg {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }
  .col-lg-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: none;
  }
  .col-lg-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .col-lg-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-lg-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-lg-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .col-lg-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }
  .col-lg-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-lg-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }
  .col-lg-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .col-lg-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-lg-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
  .col-lg-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }
  .col-lg-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .order-lg-first {
    -ms-flex-order: -1;
    order: -1;
  }
  .order-lg-last {
    -ms-flex-order: 13;
    order: 13;
  }
  .order-lg-0 {
    -ms-flex-order: 0;
    order: 0;
  }
  .order-lg-1 {
    -ms-flex-order: 1;
    order: 1;
  }
  .order-lg-2 {
    -ms-flex-order: 2;
    order: 2;
  }
  .order-lg-3 {
    -ms-flex-order: 3;
    order: 3;
  }
  .order-lg-4 {
    -ms-flex-order: 4;
    order: 4;
  }
  .order-lg-5 {
    -ms-flex-order: 5;
    order: 5;
  }
  .order-lg-6 {
    -ms-flex-order: 6;
    order: 6;
  }
  .order-lg-7 {
    -ms-flex-order: 7;
    order: 7;
  }
  .order-lg-8 {
    -ms-flex-order: 8;
    order: 8;
  }
  .order-lg-9 {
    -ms-flex-order: 9;
    order: 9;
  }
  .order-lg-10 {
    -ms-flex-order: 10;
    order: 10;
  }
  .order-lg-11 {
    -ms-flex-order: 11;
    order: 11;
  }
  .order-lg-12 {
    -ms-flex-order: 12;
    order: 12;
  }
  .offset-lg-0 {
    margin-left: 0;
  }
  .offset-lg-1 {
    margin-left: 8.333333%;
  }
  .offset-lg-2 {
    margin-left: 16.666667%;
  }
  .offset-lg-3 {
    margin-left: 25%;
  }
  .offset-lg-4 {
    margin-left: 33.333333%;
  }
  .offset-lg-5 {
    margin-left: 41.666667%;
  }
  .offset-lg-6 {
    margin-left: 50%;
  }
  .offset-lg-7 {
    margin-left: 58.333333%;
  }
  .offset-lg-8 {
    margin-left: 66.666667%;
  }
  .offset-lg-9 {
    margin-left: 75%;
  }
  .offset-lg-10 {
    margin-left: 83.333333%;
  }
  .offset-lg-11 {
    margin-left: 91.666667%;
  }
}

@media (min-width: 1200px) {
  .col-xl {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }
  .col-xl-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: none;
  }
  .col-xl-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .col-xl-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-xl-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-xl-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .col-xl-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }
  .col-xl-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-xl-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }
  .col-xl-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .col-xl-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-xl-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
  .col-xl-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }
  .col-xl-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .order-xl-first {
    -ms-flex-order: -1;
    order: -1;
  }
  .order-xl-last {
    -ms-flex-order: 13;
    order: 13;
  }
  .order-xl-0 {
    -ms-flex-order: 0;
    order: 0;
  }
  .order-xl-1 {
    -ms-flex-order: 1;
    order: 1;
  }
  .order-xl-2 {
    -ms-flex-order: 2;
    order: 2;
  }
  .order-xl-3 {
    -ms-flex-order: 3;
    order: 3;
  }
  .order-xl-4 {
    -ms-flex-order: 4;
    order: 4;
  }
  .order-xl-5 {
    -ms-flex-order: 5;
    order: 5;
  }
  .order-xl-6 {
    -ms-flex-order: 6;
    order: 6;
  }
  .order-xl-7 {
    -ms-flex-order: 7;
    order: 7;
  }
  .order-xl-8 {
    -ms-flex-order: 8;
    order: 8;
  }
  .order-xl-9 {
    -ms-flex-order: 9;
    order: 9;
  }
  .order-xl-10 {
    -ms-flex-order: 10;
    order: 10;
  }
  .order-xl-11 {
    -ms-flex-order: 11;
    order: 11;
  }
  .order-xl-12 {
    -ms-flex-order: 12;
    order: 12;
  }
  .offset-xl-0 {
    margin-left: 0;
  }
  .offset-xl-1 {
    margin-left: 8.333333%;
  }
  .offset-xl-2 {
    margin-left: 16.666667%;
  }
  .offset-xl-3 {
    margin-left: 25%;
  }
  .offset-xl-4 {
    margin-left: 33.333333%;
  }
  .offset-xl-5 {
    margin-left: 41.666667%;
  }
  .offset-xl-6 {
    margin-left: 50%;
  }
  .offset-xl-7 {
    margin-left: 58.333333%;
  }
  .offset-xl-8 {
    margin-left: 66.666667%;
  }
  .offset-xl-9 {
    margin-left: 75%;
  }
  .offset-xl-10 {
    margin-left: 83.333333%;
  }
  .offset-xl-11 {
    margin-left: 91.666667%;
  }
}

.d-none {
  display: none !important;
}

.d-inline {
  display: inline !important;
}

.d-inline-block {
  display: inline-block !important;
}

.d-block {
  display: block !important;
}

.d-table {
  display: table !important;
}

.d-table-row {
  display: table-row !important;
}

.d-table-cell {
  display: table-cell !important;
}

.d-flex {
  display: -ms-flexbox !important;
  display: flex !important;
}

.d-inline-flex {
  display: -ms-inline-flexbox !important;
  display: inline-flex !important;
}

@media (min-width: 576px) {
  .d-sm-none {
    display: none !important;
  }
  .d-sm-inline {
    display: inline !important;
  }
  .d-sm-inline-block {
    display: inline-block !important;
  }
  .d-sm-block {
    display: block !important;
  }
  .d-sm-table {
    display: table !important;
  }
  .d-sm-table-row {
    display: table-row !important;
  }
  .d-sm-table-cell {
    display: table-cell !important;
  }
  .d-sm-flex {
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .d-sm-inline-flex {
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

@media (min-width: 768px) {
  .d-md-none {
    display: none !important;
  }
  .d-md-inline {
    display: inline !important;
  }
  .d-md-inline-block {
    display: inline-block !important;
  }
  .d-md-block {
    display: block !important;
  }
  .d-md-table {
    display: table !important;
  }
  .d-md-table-row {
    display: table-row !important;
  }
  .d-md-table-cell {
    display: table-cell !important;
  }
  .d-md-flex {
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .d-md-inline-flex {
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

@media (min-width: 992px) {
  .d-lg-none {
    display: none !important;
  }
  .d-lg-inline {
    display: inline !important;
  }
  .d-lg-inline-block {
    display: inline-block !important;
  }
  .d-lg-block {
    display: block !important;
  }
  .d-lg-table {
    display: table !important;
  }
  .d-lg-table-row {
    display: table-row !important;
  }
  .d-lg-table-cell {
    display: table-cell !important;
  }
  .d-lg-flex {
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .d-lg-inline-flex {
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

@media (min-width: 1200px) {
  .d-xl-none {
    display: none !important;
  }
  .d-xl-inline {
    display: inline !important;
  }
  .d-xl-inline-block {
    display: inline-block !important;
  }
  .d-xl-block {
    display: block !important;
  }
  .d-xl-table {
    display: table !important;
  }
  .d-xl-table-row {
    display: table-row !important;
  }
  .d-xl-table-cell {
    display: table-cell !important;
  }
  .d-xl-flex {
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .d-xl-inline-flex {
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

@media print {
  .d-print-none {
    display: none !important;
  }
  .d-print-inline {
    display: inline !important;
  }
  .d-print-inline-block {
    display: inline-block !important;
  }
  .d-print-block {
    display: block !important;
  }
  .d-print-table {
    display: table !important;
  }
  .d-print-table-row {
    display: table-row !important;
  }
  .d-print-table-cell {
    display: table-cell !important;
  }
  .d-print-flex {
    display: -ms-flexbox !important;
    display: flex !important;
  }
  .d-print-inline-flex {
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

.flex-row {
  -ms-flex-direction: row !important;
  flex-direction: row !important;
}

.flex-column {
  -ms-flex-direction: column !important;
  flex-direction: column !important;
}

.flex-row-reverse {
  -ms-flex-direction: row-reverse !important;
  flex-direction: row-reverse !important;
}

.flex-column-reverse {
  -ms-flex-direction: column-reverse !important;
  flex-direction: column-reverse !important;
}

.flex-wrap {
  -ms-flex-wrap: wrap !important;
  flex-wrap: wrap !important;
}

.flex-nowrap {
  -ms-flex-wrap: nowrap !important;
  flex-wrap: nowrap !important;
}

.flex-wrap-reverse {
  -ms-flex-wrap: wrap-reverse !important;
  flex-wrap: wrap-reverse !important;
}

.flex-fill {
  -ms-flex: 1 1 auto !important;
  flex: 1 1 auto !important;
}

.flex-grow-0 {
  -ms-flex-positive: 0 !important;
  flex-grow: 0 !important;
}

.flex-grow-1 {
  -ms-flex-positive: 1 !important;
  flex-grow: 1 !important;
}

.flex-shrink-0 {
  -ms-flex-negative: 0 !important;
  flex-shrink: 0 !important;
}

.flex-shrink-1 {
  -ms-flex-negative: 1 !important;
  flex-shrink: 1 !important;
}

.justify-content-start {
  -ms-flex-pack: start !important;
  justify-content: flex-start !important;
}

.justify-content-end {
  -ms-flex-pack: end !important;
  justify-content: flex-end !important;
}

.justify-content-center {
  -ms-flex-pack: center !important;
  justify-content: center !important;
}

.justify-content-between {
  -ms-flex-pack: justify !important;
  justify-content: space-between !important;
}

.justify-content-around {
  -ms-flex-pack: distribute !important;
  justify-content: space-around !important;
}

.align-items-start {
  -ms-flex-align: start !important;
  align-items: flex-start !important;
}

.align-items-end {
  -ms-flex-align: end !important;
  align-items: flex-end !important;
}

.align-items-center {
  -ms-flex-align: center !important;
  align-items: center !important;
}

.align-items-baseline {
  -ms-flex-align: baseline !important;
  align-items: baseline !important;
}

.align-items-stretch {
  -ms-flex-align: stretch !important;
  align-items: stretch !important;
}

.align-content-start {
  -ms-flex-line-pack: start !important;
  align-content: flex-start !important;
}

.align-content-end {
  -ms-flex-line-pack: end !important;
  align-content: flex-end !important;
}

.align-content-center {
  -ms-flex-line-pack: center !important;
  align-content: center !important;
}

.align-content-between {
  -ms-flex-line-pack: justify !important;
  align-content: space-between !important;
}

.align-content-around {
  -ms-flex-line-pack: distribute !important;
  align-content: space-around !important;
}

.align-content-stretch {
  -ms-flex-line-pack: stretch !important;
  align-content: stretch !important;
}

.align-self-auto {
  -ms-flex-item-align: auto !important;
  align-self: auto !important;
}

.align-self-start {
  -ms-flex-item-align: start !important;
  align-self: flex-start !important;
}

.align-self-end {
  -ms-flex-item-align: end !important;
  align-self: flex-end !important;
}

.align-self-center {
  -ms-flex-item-align: center !important;
  align-self: center !important;
}

.align-self-baseline {
  -ms-flex-item-align: baseline !important;
  align-self: baseline !important;
}

.align-self-stretch {
  -ms-flex-item-align: stretch !important;
  align-self: stretch !important;
}

@media (min-width: 576px) {
  .flex-sm-row {
    -ms-flex-direction: row !important;
    flex-direction: row !important;
  }
  .flex-sm-column {
    -ms-flex-direction: column !important;
    flex-direction: column !important;
  }
  .flex-sm-row-reverse {
    -ms-flex-direction: row-reverse !important;
    flex-direction: row-reverse !important;
  }
  .flex-sm-column-reverse {
    -ms-flex-direction: column-reverse !important;
    flex-direction: column-reverse !important;
  }
  .flex-sm-wrap {
    -ms-flex-wrap: wrap !important;
    flex-wrap: wrap !important;
  }
  .flex-sm-nowrap {
    -ms-flex-wrap: nowrap !important;
    flex-wrap: nowrap !important;
  }
  .flex-sm-wrap-reverse {
    -ms-flex-wrap: wrap-reverse !important;
    flex-wrap: wrap-reverse !important;
  }
  .flex-sm-fill {
    -ms-flex: 1 1 auto !important;
    flex: 1 1 auto !important;
  }
  .flex-sm-grow-0 {
    -ms-flex-positive: 0 !important;
    flex-grow: 0 !important;
  }
  .flex-sm-grow-1 {
    -ms-flex-positive: 1 !important;
    flex-grow: 1 !important;
  }
  .flex-sm-shrink-0 {
    -ms-flex-negative: 0 !important;
    flex-shrink: 0 !important;
  }
  .flex-sm-shrink-1 {
    -ms-flex-negative: 1 !important;
    flex-shrink: 1 !important;
  }
  .justify-content-sm-start {
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;
  }
  .justify-content-sm-end {
    -ms-flex-pack: end !important;
    justify-content: flex-end !important;
  }
  .justify-content-sm-center {
    -ms-flex-pack: center !important;
    justify-content: center !important;
  }
  .justify-content-sm-between {
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
  }
  .justify-content-sm-around {
    -ms-flex-pack: distribute !important;
    justify-content: space-around !important;
  }
  .align-items-sm-start {
    -ms-flex-align: start !important;
    align-items: flex-start !important;
  }
  .align-items-sm-end {
    -ms-flex-align: end !important;
    align-items: flex-end !important;
  }
  .align-items-sm-center {
    -ms-flex-align: center !important;
    align-items: center !important;
  }
  .align-items-sm-baseline {
    -ms-flex-align: baseline !important;
    align-items: baseline !important;
  }
  .align-items-sm-stretch {
    -ms-flex-align: stretch !important;
    align-items: stretch !important;
  }
  .align-content-sm-start {
    -ms-flex-line-pack: start !important;
    align-content: flex-start !important;
  }
  .align-content-sm-end {
    -ms-flex-line-pack: end !important;
    align-content: flex-end !important;
  }
  .align-content-sm-center {
    -ms-flex-line-pack: center !important;
    align-content: center !important;
  }
  .align-content-sm-between {
    -ms-flex-line-pack: justify !important;
    align-content: space-between !important;
  }
  .align-content-sm-around {
    -ms-flex-line-pack: distribute !important;
    align-content: space-around !important;
  }
  .align-content-sm-stretch {
    -ms-flex-line-pack: stretch !important;
    align-content: stretch !important;
  }
  .align-self-sm-auto {
    -ms-flex-item-align: auto !important;
    align-self: auto !important;
  }
  .align-self-sm-start {
    -ms-flex-item-align: start !important;
    align-self: flex-start !important;
  }
  .align-self-sm-end {
    -ms-flex-item-align: end !important;
    align-self: flex-end !important;
  }
  .align-self-sm-center {
    -ms-flex-item-align: center !important;
    align-self: center !important;
  }
  .align-self-sm-baseline {
    -ms-flex-item-align: baseline !important;
    align-self: baseline !important;
  }
  .align-self-sm-stretch {
    -ms-flex-item-align: stretch !important;
    align-self: stretch !important;
  }
}

@media (min-width: 768px) {
  .flex-md-row {
    -ms-flex-direction: row !important;
    flex-direction: row !important;
  }
  .flex-md-column {
    -ms-flex-direction: column !important;
    flex-direction: column !important;
  }
  .flex-md-row-reverse {
    -ms-flex-direction: row-reverse !important;
    flex-direction: row-reverse !important;
  }
  .flex-md-column-reverse {
    -ms-flex-direction: column-reverse !important;
    flex-direction: column-reverse !important;
  }
  .flex-md-wrap {
    -ms-flex-wrap: wrap !important;
    flex-wrap: wrap !important;
  }
  .flex-md-nowrap {
    -ms-flex-wrap: nowrap !important;
    flex-wrap: nowrap !important;
  }
  .flex-md-wrap-reverse {
    -ms-flex-wrap: wrap-reverse !important;
    flex-wrap: wrap-reverse !important;
  }
  .flex-md-fill {
    -ms-flex: 1 1 auto !important;
    flex: 1 1 auto !important;
  }
  .flex-md-grow-0 {
    -ms-flex-positive: 0 !important;
    flex-grow: 0 !important;
  }
  .flex-md-grow-1 {
    -ms-flex-positive: 1 !important;
    flex-grow: 1 !important;
  }
  .flex-md-shrink-0 {
    -ms-flex-negative: 0 !important;
    flex-shrink: 0 !important;
  }
  .flex-md-shrink-1 {
    -ms-flex-negative: 1 !important;
    flex-shrink: 1 !important;
  }
  .justify-content-md-start {
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;
  }
  .justify-content-md-end {
    -ms-flex-pack: end !important;
    justify-content: flex-end !important;
  }
  .justify-content-md-center {
    -ms-flex-pack: center !important;
    justify-content: center !important;
  }
  .justify-content-md-between {
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
  }
  .justify-content-md-around {
    -ms-flex-pack: distribute !important;
    justify-content: space-around !important;
  }
  .align-items-md-start {
    -ms-flex-align: start !important;
    align-items: flex-start !important;
  }
  .align-items-md-end {
    -ms-flex-align: end !important;
    align-items: flex-end !important;
  }
  .align-items-md-center {
    -ms-flex-align: center !important;
    align-items: center !important;
  }
  .align-items-md-baseline {
    -ms-flex-align: baseline !important;
    align-items: baseline !important;
  }
  .align-items-md-stretch {
    -ms-flex-align: stretch !important;
    align-items: stretch !important;
  }
  .align-content-md-start {
    -ms-flex-line-pack: start !important;
    align-content: flex-start !important;
  }
  .align-content-md-end {
    -ms-flex-line-pack: end !important;
    align-content: flex-end !important;
  }
  .align-content-md-center {
    -ms-flex-line-pack: center !important;
    align-content: center !important;
  }
  .align-content-md-between {
    -ms-flex-line-pack: justify !important;
    align-content: space-between !important;
  }
  .align-content-md-around {
    -ms-flex-line-pack: distribute !important;
    align-content: space-around !important;
  }
  .align-content-md-stretch {
    -ms-flex-line-pack: stretch !important;
    align-content: stretch !important;
  }
  .align-self-md-auto {
    -ms-flex-item-align: auto !important;
    align-self: auto !important;
  }
  .align-self-md-start {
    -ms-flex-item-align: start !important;
    align-self: flex-start !important;
  }
  .align-self-md-end {
    -ms-flex-item-align: end !important;
    align-self: flex-end !important;
  }
  .align-self-md-center {
    -ms-flex-item-align: center !important;
    align-self: center !important;
  }
  .align-self-md-baseline {
    -ms-flex-item-align: baseline !important;
    align-self: baseline !important;
  }
  .align-self-md-stretch {
    -ms-flex-item-align: stretch !important;
    align-self: stretch !important;
  }
}

@media (min-width: 992px) {
  .flex-lg-row {
    -ms-flex-direction: row !important;
    flex-direction: row !important;
  }
  .flex-lg-column {
    -ms-flex-direction: column !important;
    flex-direction: column !important;
  }
  .flex-lg-row-reverse {
    -ms-flex-direction: row-reverse !important;
    flex-direction: row-reverse !important;
  }
  .flex-lg-column-reverse {
    -ms-flex-direction: column-reverse !important;
    flex-direction: column-reverse !important;
  }
  .flex-lg-wrap {
    -ms-flex-wrap: wrap !important;
    flex-wrap: wrap !important;
  }
  .flex-lg-nowrap {
    -ms-flex-wrap: nowrap !important;
    flex-wrap: nowrap !important;
  }
  .flex-lg-wrap-reverse {
    -ms-flex-wrap: wrap-reverse !important;
    flex-wrap: wrap-reverse !important;
  }
  .flex-lg-fill {
    -ms-flex: 1 1 auto !important;
    flex: 1 1 auto !important;
  }
  .flex-lg-grow-0 {
    -ms-flex-positive: 0 !important;
    flex-grow: 0 !important;
  }
  .flex-lg-grow-1 {
    -ms-flex-positive: 1 !important;
    flex-grow: 1 !important;
  }
  .flex-lg-shrink-0 {
    -ms-flex-negative: 0 !important;
    flex-shrink: 0 !important;
  }
  .flex-lg-shrink-1 {
    -ms-flex-negative: 1 !important;
    flex-shrink: 1 !important;
  }
  .justify-content-lg-start {
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;
  }
  .justify-content-lg-end {
    -ms-flex-pack: end !important;
    justify-content: flex-end !important;
  }
  .justify-content-lg-center {
    -ms-flex-pack: center !important;
    justify-content: center !important;
  }
  .justify-content-lg-between {
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
  }
  .justify-content-lg-around {
    -ms-flex-pack: distribute !important;
    justify-content: space-around !important;
  }
  .align-items-lg-start {
    -ms-flex-align: start !important;
    align-items: flex-start !important;
  }
  .align-items-lg-end {
    -ms-flex-align: end !important;
    align-items: flex-end !important;
  }
  .align-items-lg-center {
    -ms-flex-align: center !important;
    align-items: center !important;
  }
  .align-items-lg-baseline {
    -ms-flex-align: baseline !important;
    align-items: baseline !important;
  }
  .align-items-lg-stretch {
    -ms-flex-align: stretch !important;
    align-items: stretch !important;
  }
  .align-content-lg-start {
    -ms-flex-line-pack: start !important;
    align-content: flex-start !important;
  }
  .align-content-lg-end {
    -ms-flex-line-pack: end !important;
    align-content: flex-end !important;
  }
  .align-content-lg-center {
    -ms-flex-line-pack: center !important;
    align-content: center !important;
  }
  .align-content-lg-between {
    -ms-flex-line-pack: justify !important;
    align-content: space-between !important;
  }
  .align-content-lg-around {
    -ms-flex-line-pack: distribute !important;
    align-content: space-around !important;
  }
  .align-content-lg-stretch {
    -ms-flex-line-pack: stretch !important;
    align-content: stretch !important;
  }
  .align-self-lg-auto {
    -ms-flex-item-align: auto !important;
    align-self: auto !important;
  }
  .align-self-lg-start {
    -ms-flex-item-align: start !important;
    align-self: flex-start !important;
  }
  .align-self-lg-end {
    -ms-flex-item-align: end !important;
    align-self: flex-end !important;
  }
  .align-self-lg-center {
    -ms-flex-item-align: center !important;
    align-self: center !important;
  }
  .align-self-lg-baseline {
    -ms-flex-item-align: baseline !important;
    align-self: baseline !important;
  }
  .align-self-lg-stretch {
    -ms-flex-item-align: stretch !important;
    align-self: stretch !important;
  }
}

@media (min-width: 1200px) {
  .flex-xl-row {
    -ms-flex-direction: row !important;
    flex-direction: row !important;
  }
  .flex-xl-column {
    -ms-flex-direction: column !important;
    flex-direction: column !important;
  }
  .flex-xl-row-reverse {
    -ms-flex-direction: row-reverse !important;
    flex-direction: row-reverse !important;
  }
  .flex-xl-column-reverse {
    -ms-flex-direction: column-reverse !important;
    flex-direction: column-reverse !important;
  }
  .flex-xl-wrap {
    -ms-flex-wrap: wrap !important;
    flex-wrap: wrap !important;
  }
  .flex-xl-nowrap {
    -ms-flex-wrap: nowrap !important;
    flex-wrap: nowrap !important;
  }
  .flex-xl-wrap-reverse {
    -ms-flex-wrap: wrap-reverse !important;
    flex-wrap: wrap-reverse !important;
  }
  .flex-xl-fill {
    -ms-flex: 1 1 auto !important;
    flex: 1 1 auto !important;
  }
  .flex-xl-grow-0 {
    -ms-flex-positive: 0 !important;
    flex-grow: 0 !important;
  }
  .flex-xl-grow-1 {
    -ms-flex-positive: 1 !important;
    flex-grow: 1 !important;
  }
  .flex-xl-shrink-0 {
    -ms-flex-negative: 0 !important;
    flex-shrink: 0 !important;
  }
  .flex-xl-shrink-1 {
    -ms-flex-negative: 1 !important;
    flex-shrink: 1 !important;
  }
  .justify-content-xl-start {
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;
  }
  .justify-content-xl-end {
    -ms-flex-pack: end !important;
    justify-content: flex-end !important;
  }
  .justify-content-xl-center {
    -ms-flex-pack: center !important;
    justify-content: center !important;
  }
  .justify-content-xl-between {
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
  }
  .justify-content-xl-around {
    -ms-flex-pack: distribute !important;
    justify-content: space-around !important;
  }
  .align-items-xl-start {
    -ms-flex-align: start !important;
    align-items: flex-start !important;
  }
  .align-items-xl-end {
    -ms-flex-align: end !important;
    align-items: flex-end !important;
  }
  .align-items-xl-center {
    -ms-flex-align: center !important;
    align-items: center !important;
  }
  .align-items-xl-baseline {
    -ms-flex-align: baseline !important;
    align-items: baseline !important;
  }
  .align-items-xl-stretch {
    -ms-flex-align: stretch !important;
    align-items: stretch !important;
  }
  .align-content-xl-start {
    -ms-flex-line-pack: start !important;
    align-content: flex-start !important;
  }
  .align-content-xl-end {
    -ms-flex-line-pack: end !important;
    align-content: flex-end !important;
  }
  .align-content-xl-center {
    -ms-flex-line-pack: center !important;
    align-content: center !important;
  }
  .align-content-xl-between {
    -ms-flex-line-pack: justify !important;
    align-content: space-between !important;
  }
  .align-content-xl-around {
    -ms-flex-line-pack: distribute !important;
    align-content: space-around !important;
  }
  .align-content-xl-stretch {
    -ms-flex-line-pack: stretch !important;
    align-content: stretch !important;
  }
  .align-self-xl-auto {
    -ms-flex-item-align: auto !important;
    align-self: auto !important;
  }
  .align-self-xl-start {
    -ms-flex-item-align: start !important;
    align-self: flex-start !important;
  }
  .align-self-xl-end {
    -ms-flex-item-align: end !important;
    align-self: flex-end !important;
  }
  .align-self-xl-center {
    -ms-flex-item-align: center !important;
    align-self: center !important;
  }
  .align-self-xl-baseline {
    -ms-flex-item-align: baseline !important;
    align-self: baseline !important;
  }
  .align-self-xl-stretch {
    -ms-flex-item-align: stretch !important;
    align-self: stretch !important;
  }
}
/*# sourceMappingURL=bootstrap-grid.css.map */
/*#region 初始化頁面 */

@font-face {
    font-family: 'Noto Sans TC';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Regular.woff2) format('woff2'), url(https://fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Regular.woff) format('woff'), url(https://fonts.gstatic.com/ea/notosanstc/v1/NotoSansTC-Regular.otf) format('opentype');
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-family: 'Noto Sans TC', "微軟正黑體";
    font-style: normal;
}

html, body {
    padding: 0px;
    margin: 0px;
    width: 100%;
    height: 100%;
    font-size: 16px;
}

body {
    overflow-x: hidden;
    overflow-y: hidden;
}

input.invisible {
    display: none;
}

#loading{
    position:fixed;
    width:100vw;
    height:100vh;
    z-index:9;
    display:none;
}

.spinner-border{
    display:inline-block;
    width:2rem;
    height:2rem;
    vertical-align:text-bottom;
    border: .25em solid currentColor;
    border-right-color:transparent;
    border-radius:50%;
    animation: spin 0.75s linear infinite;
}
@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

    #loading > div:first-child {
        background-color:white;
        opacity:0.5;
        position:fixed;
        width:100%;
        height:100%;
    }
#loading > div:last-child{
    display:flex;
    width:100%;
    height:100%;
    justify-content:center;
    align-items:center;
}

ul {
    list-style-type: none;
    list-style: none;
}

a {
    text-decoration: none;
}

body #header-container {
    width: 100%;
    position: relative;
    z-index: 11;
    background-color: white;
}

/* height和header高度變動有關 */
body #content-container {
    height: calc((var(--vh, 1vh) * 100) - 107px);
    padding: 0px;
    overflow-x: hidden;
    overflow-y: auto;
    scroll-behavior: smooth;
}
body #main-container {
    min-height: calc(100vh - 160px);
}

#app {
    width: 100%;
    background-color: #F0F9FF;
}

#footer-container {
    background-color: #1A82D9;
    color: white;
    padding: 20px;
    height: 60px;
    display: flex;
    align-items: center;
    width: 100%;
    font-size: 1rem;
}
.container-background {
    background-image: url('Images/背景.png');
    background-repeat: no-repeat;
    background-position: right bottom;
}

body #main-container .container.paddingBottom {
    padding-bottom: 30px;
    background-color: transparent;
}
.container-fluid.row {
    padding:0;
    margin: auto;
}
@media only screen and (min-width:1440px) {
    .container {
        max-width: 1400px;
    }
}

@media only screen and (min-width: 992px) and (max-width:1440px) {
    body, html {
        font-size: 14px;
    }
}

@media only screen and (min-width: 576px) and (max-width:992px) {
    body, html {
        font-size: 14px;
    }
    .container-fluid {
        min-width: unset;
    }
        .container {
            max-width: 960px;
        }

    .container-fluid, #header-container, #main-container, #footer-container {
        max-width: 992px;
    }
}

@media only screen and (max-width: 576px) {
    body, html {
        font-size: 12px;
    }

    .container-background {
        background-image: none;
    }
}


#headerContainer {
    background-color: white;
    padding: 0 15px 10px;
    box-shadow: 0px 0px 6px #00000029;
}

    #headerContainer .color-black {
        color: #121212;
    }

/* 最上方列logo與登入登出列 */

#header-container .left {
    text-align: left;
}

#header-container .home {
    height: 100%;
    display: flex;
    align-items: center;
}
#header-container .wra-logo {
    display: inline-block;
    background-image: url('Images/Wra_Rwd_Logo_Text.svg');
    background-repeat: no-repeat;
    background-position: center;
    width: 150px;
    min-width: 125px;
    height: 25px;
    margin-left: 3px;
}

#header-container .wra-icon {
    display: inline-block;
    background-image: url(Images/水利署logo.svg);
    background-repeat: no-repeat;
    background-position: center;
    width: 15px;
    min-width: 15px;
    height: 27px;
}

#header-container .row {
    justify-content: space-between;
}

#header-container .row .right { /*一些圖臺的功能列會跑版*/
    display: flex;
    text-align: right;
    justify-content: flex-end;
    height: 35px;
}

    #header-container .row .right .right-container {
        display: inline-block;
    }


#header-container .right-container {
    font-size: 1rem;
    line-height: 30px;
    position: relative;
    display: flex;
    justify-content: flex-end;
}

.right-container > * > span {
    white-space: nowrap;
}

#header-container .right-container > .menu-container {
    position: absolute;
    top: 30px;
    left: -12px;
    z-index: 3;
    display: none;
}

.right-container > * {
    display: inline-flex;
    padding: 0 5px;
    cursor: pointer;
    margin-top: 5px;
}

#headerContainer .editLayout .row {
    height: 25px;
    justify-content: space-between;
    text-align: right;
}

#header-container .right-container > .websiteTour {
    align-items: center;
}


    #header-container .right-container > .websiteTour > div {
        background-image: url('Images/Index/icon_網站導覽.svg');
        width: 21px;
        height: 30px;
        margin-right: 5px;
        background-position: center;
        background-repeat: no-repeat;
    }

#header-container .right-container > .login {
    display: inline-flex;
    padding: 0 10px;
}

    #header-container .right-container > .login > div {
        background-image: url('Images/Index/icon_系統登入.svg');
        width: 16px;
        margin-right: 5px;
        background-position: center;
        background-repeat: no-repeat;
    }

#header-container .right-container > .logout {
    display: none;
    display: inline-flex;
    margin-right: 5px;
}

    #header-container .right-container > .logout > div {
        background-image: url('Images/Index/icon_系統登入.svg');
        width: 16px;
        margin-right: 5px;
        background-position: center;
        background-repeat: no-repeat;
    }

/* 功能列 */

.navbar-container {
    height: 70px;
    align-content: center;
}

    .navbar-container .row {
        width: 100%;
        justify-content: space-between;
    }

    .navbar-container .title-container {
        display: flex;
        align-items: center;
        cursor: pointer;
    }

        .navbar-container .title-container .title-icon {
            background-image: url('Images/水利署logo.svg');
            background-repeat: no-repeat;
            background-size: contain;
            background-position: center;
            width: 40px;
            height: 60px;
        }

        .navbar-container .title-container .title-text {
            background-image: url('Images/Wra_Logo_Text.svg');
            background-repeat: no-repeat;
            background-size: contain;
            background-position: center;
            width: 330px;
            height: 60px;
        }

    .navbar-container .menu-container {
        font-size: 1.2rem;
        display: flex;
        justify-content: flex-end;
        align-items: center;
        position: relative;
    }

        .navbar-container .menu-container .menu-item {
            position: relative;
            z-index: 20;
            margin: 15px 3px 5px;
        }

            .navbar-container .menu-container .menu-item:first-child {
                margin-left: 0;
            }

        .navbar-container .menu-container .menu-title {
            padding: 8px;
            cursor: pointer;
            position: relative;
            z-index: 1;
            border-radius: 5px;
        }

        .navbar-container .menu-container .menu-admin-title {
            color: #FF8800;
        }

        .navbar-container .menu-container .active-menu {
            background-color: #1A82D9;
            color: white;
        }

        .navbar-container .menu-container .active-admin-menu {
            background-color: #FF8800;
            color: white;
        }

        .navbar-container .menu-container .submenu-item {
            background-color: white;
            width: calc(100% + 65px);
            border-radius: 8px;
            box-shadow: 0px 0px 6px #00000029;
            margin-top: 5px;
            position: absolute;
            left: 51%;
            transform: translate(-50%, 0); /*調整top會導致距離偏差值拉大*/
            cursor: pointer;
        }

        .navbar-container .menu-container .submenu-title {
            font-size: 1.1rem;
            margin: 5px 0;
            padding: 5px 5px 5px 10px;
        }

            .navbar-container .menu-container .submenu-title:hover {
                color: white;
                background-color: #1A82D9;
            }

        .navbar-container .menu-container .submenu-admin-title:hover {
            background-color: #FF8800;
        }

.foldmenu-search {
    margin: 0 10px;
    color: white;
    border-bottom: 1px solid white;
    display: none;
}

    .foldmenu-search input {
        background-color: transparent;
        border: 0;
        padding: 10px;
        width: 100%;
        font-size: 1.1rem;
        color: white;
    }

        .foldmenu-search input::placeholder {
            color: white;
        }

    .foldmenu-search span {
        width: 35px;
        height: 35px;
        background-image: url('Images/圖台_search_on.svg');
        background-repeat: no-repeat;
        background-position: center;
        cursor: pointer;
    }

/* 功能列web版搜尋圖樣 */
.search-icon {
    color: #6C6C6C;
    width: 25px;
    height: 25px;
    border: 1px solid;
    border-radius: 25px;
    text-align: center;
    align-content: center;
    font-size: 1rem;
    margin-top: 10px;
    cursor: pointer;
}

    .search-icon:hover {
        color: #1A82D9;
    }

.menu-search-bar {
    position: absolute;
    top: 105%;
    background-color: white;
    border-radius: 8px;
    box-shadow: 0px 0px 6px #00000029;
    padding: 10px;
    z-index: 30;
}

    .menu-search-bar .row {
        flex-wrap: nowrap;
        position: relative;
    }

    .menu-search-bar input {
        border: 0;
        border-bottom: 1px solid #6C6C6C;
        padding: 5px;
    }

    .menu-search-bar .row .fas {
        position: absolute;
        top: 50%;
        right: 0;
        transform: translate(0%, -50%);
        color: #6C6C6C;
        cursor: pointer;
    }

[v-cloak] {
    display: none;
}

.navbar-container .foldedMenu {
    display: none;
}

/* 進入其他頁面的功能列下拉選單 */
#header-container .right-container > .menu-container .item {
    position: relative;
    display: flex;
    width: 105px;
    align-items: center;
    justify-content: space-between;
    height: 38px;
    background: #333E53;
    color: #fff;
    padding: 0 10px;
}

    #header-container .right-container > .menu-container .item:hover {
        background: #EECC3F;
        color: #333E53;
    }

#header-container .right-container > .menu-container > .item > .submenu-container {
    position: absolute;
    top: 0px;
    left: 105px;
    display: none;
}

#header-container .right-container > .menu-container > .item:hover > .submenu-container {
    display: block;
}

#header-container .right-container .submenu-container > .item {
    line-height: 16px;
    text-align: left;
    width: 110px;
}

#header-container .right-container > .pageMenu {
    align-items: baseline;
}

    #header-container .right-container > .pageMenu ~ .search {
        display: none;
    }

    #header-container .right-container > .pageMenu:hover ~ .menu-container,
    #header-container .right-container > .menu-container:hover {
        display: block;
    }

    #header-container .right-container > .pageMenu > span {
        align-self: center;
    }

    #header-container .right-container > .pageMenu > .arrow-button {
        background-image: url('Images/Index/wra_down_arrow.png');
        width: 10px;
        background-position: center;
        background-repeat: no-repeat;
        margin-left: 6px;
        height: 30px;
    }

/*    #header-container .right-container > .pageMenu ~ .login {
        margin-right: 54px;
    }*/

    #header-container .right-container > .pageMenu ~ .logout {
        margin-right: 6px;
    }

@media (min-width: 576px) {
    .navbar-container .menu-container {
        display: flex !important;
    }
}
@media only screen and (min-width: 700px) and (max-width:900px) {
    .navbar-container .menu-container .menu-item {
        margin: 0;
    }
    .navbar-container .menu-container .menu-title {
        padding: 5px;
    }
}
@media only screen and (max-width:600px) {
    #header-container .right-container > .pageMenu ~ .websiteTel {
        display: none;
    }
}

@media only screen and (max-width: 576px) {

    #headerContainer {
        padding: 0 5px;
    }

        #headerContainer > div.container-fluid.editLayout {
            padding-right: 0;
        }

        #headerContainer .editLayout .row {
            padding-bottom: 36px;
            border-bottom: 1px solid #EFF4F8;
        }

    #header-container .right-container > * {
        padding: 0 2px;
        font-size: 0.75rem;
    }

    #header-container .right-container > .login > div,
    #header-container .right-container > .logout > div {
        margin-right: 2px;
    }

    .navbar-container {
        padding-top: 4%;
        align-content: flex-start;
    }

        .navbar-container .foldedMenu {
            display: inline-block;
            text-align: center;
            font-size: 1.7rem;
            color: #6C6C6C;
            cursor: pointer;
        }

    .foldmenu-search {
        display: block;
    }

    .menu-search {
        display: flex;
        justify-content: space-between;
        display: none;
    }

    .search-icon {
        display: none;
    }

    .navbar-container .menu-close-button {
        background-image: url('Images/漢堡夾_關閉.svg');
        width: 30px;
        background-repeat: no-repeat;
        background-position: center;
        cursor: pointer;
    }

    .navbar-container .menu-container {
        display: none;
        background-color: #1A82D9;
        color: white;
        opacity: 0.95;
        width: calc(100% + 60px);
        height: 100vh;
        margin: 15px -15px 0;
        padding-left: 20px;
        text-align: center;
        overflow-y: auto;
        max-height: 83vh;
    }

        .navbar-container .menu-container .active-menu {
            color: #1A82D9;
        }

        .navbar-container .menu-container .active-admin-menu {
            color: white;
            background-color: transparent;
        }

        .navbar-container .menu-container .active-menu:after {
            background-color: white;
        }

        .navbar-container .menu-container .active-admin-menu:after {
            background-color: #FF8800;
        }

        .navbar-container .menu-container .active-menu:after,
        .navbar-container .menu-container .active-admin-menu:after {
            content: '';
            height: 100%;
            z-index: -10;
            position: absolute;
            top: 0;
            left: 50%;
            transform: translate(-50%, 0%);
            border-radius: 5px;
            animation: expand 500ms forwards;
            animation-fill-mode: forwards;
        }


    @keyframes expand {
        0% {
            width: 0;
        }

        100% {
            width: 100%;
        }
    }

    .navbar-container .menu-container .submenu-item {
        position: relative;
        width: 100%;
        border-radius: 0;
        box-shadow: 0 0 0;
        top: 0;
        left: 0;
        transform: translate(0, 0);
        background-color: #1A82D9;
    }

    .navbar-container .menu-container .submenu-title {
        padding-left: 10px;
    }

        .navbar-container .menu-container .submenu-title:hover {
            background-color: inherit;
            color: inherit;
        }

    .navbar-container .title-container > .title-icon {
        width: 30px;
        height: 30px;
    }

    .navbar-container .title-container .title-text {
        background-image: url('Images/Wra_Rwd_Logo_Text.svg');
        width: 230px;
        height: 35px;
    }

    #header-container .right-container > .pageMenu ~ .login {
        margin-right: 5px;
    }

    #header-container .right-container > .pageMenu ~ .logout {
        margin-right: 0px;
    }
}


#footer-container {
    background-color: #1A82D9;
    color: white;
    padding: 20px;
    height: 60px;
    display: flex;
    align-items: center;
    width: 100%;
    font-size: 1rem;
}

    #footer-container .publicDeclare {
        cursor: pointer;
    }
    #footer-container .privatePolicy {
        cursor: pointer;
    }
    #footer-container .securityPolicy {
        cursor: pointer;
    }

    #footer-container .row > div:last-child {
        display: inline-flex;
        justify-content: center;
    }

        #footer-container .row > div:last-child > div {
            padding: 0px 20px;
            border-right: 1px solid white;
        }

            #footer-container .row > div:last-child > div:last-child {
                border: none;
            }

@media only screen and (max-width: 576px) {
    /*#region Footer */

    #footer-container {
        height: unset;
    }

        #footer-container .row > div:last-child {
            flex-wrap: wrap;
            justify-content: center;
            padding: 20px;
        }

            #footer-container .row > div:last-child > div {
                width: 100%;
                padding: 10px;
                text-align: center;
                border: 1px solid white;
                margin: 1px 0px;
            }

                #footer-container .row > div:last-child > div:last-child {
                    border: 1px solid white;
                }

    /*#endregion */
}

/*#endregion */

#main-container .title-image {
    width: 100%;
    position: relative;
    height: 400px;
    padding: 0;
}

ul.slides {
    display: block;
    height: inherit;
    margin: 0;
    padding: 0;
    overflow: hidden;
    list-style: none;
}

.slide-container {
    height: inherit;
    position: absolute;
    width: 100%;
    top: 0;
}

.slide-image {
    display: block;
    width: inherit;
    height: inherit;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    transition: opacity 1s ease-in-out;
}

.slide-container .slide-image2 {
    background-image: url('Images/水利地理視覺圖_2.jpg');
    opacity: 0;
}

.slide-container .slide-image1 {
    background-image: url('Images/水利地理視覺圖_1_v2.jpg');
}

/*圖片輪播左右控制鍵*/
.carousel-controls {
    display: flex;
    position: absolute;
    bottom: 20px;
    left: 85%;
    z-index: 2;
}

    .carousel-controls .control-common {
        background-color: #121212;
        position: relative;
        width: 35px;
        height: 45px;
        border-radius: 6px;
        opacity: 0.28;
        cursor: pointer;
    }

    .carousel-controls label:hover {
        opacity: 0.5;
    }

    .carousel-controls label.disabled {
        cursor: default;
    }

        .carousel-controls label.disabled:hover {
            opacity: 0.28;
        }

    .carousel-controls .prev-slide {
        margin-right: 12px;
        background-image: url('Images/Index/icon_輪播pre.svg');
    }

    .carousel-controls .next-slide {
        background-image: url('Images/Index/icon_輪播next.svg');
    }

    .carousel-controls label span {
        position: absolute;
        top: 40%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

.title-image .title {
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    height: 160px;
}

#main-container .search-container {
    background-color: #1A82D9;
    width: 70%;
    height: 38%;
    position: absolute;
    bottom: -80px;
    left: 45%;
    transform: translate(-50%);
    box-shadow: 0px 0px 6px #00000029;
    color: white;
    padding: 10px;
    display: flex;
    justify-content: center;
    padding: 25px 30px 10px 30px;
}

#main-container .search-container-info {
    min-width: 35%;
    margin-right: 3%;
}

    #main-container .search-container-info > div:first-child {
        font-size: 30px;
        font-weight: bold;
        margin-bottom: 20px
    }

#main-container .search-container-search {
    min-width: 50%;
}

#main-container .search-container .search-tip {
    margin: auto 20px auto 0px;
    padding: 10px;
    border-radius: 5px;
    cursor: pointer;
}

#main-container .search-container .searchSpot {
    background-color: white;
    color: #1A82D9;
}

#main-container .search-container .triangle {
    margin: 0px 32%;
    border-width: 8px;
    border-color: #1A82D9 #1A82D9 #1A82D9 #1A82D9;
    border-style: solid;
    width: 0px;
    height: 0px;
}

#main-container .search-container .triangleSpot {
    border-color: white #1A82D9 #1A82D9 #1A82D9;
}



#main-container .search-container select,
#main-container .search-container input {
    padding: 10px;
    border-radius: 5px;
    border: none;
    margin-bottom: 10px;
}

#main-container .search-container .slideInput {
    max-height: 150px;
    overflow-y: auto;
}

    #main-container .search-container .slideInput div {
        padding: 5px;
        cursor: pointer;
        border-radius: 0px;
        background-color: #eee;
        color: black;
    }

        #main-container .search-container .slideInput div:hover {
            background-color: #bbb;
        }

#main-container .search-container button {
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    border: none;
    background-color: #121212;
    color: white;
    font-size: 16px;
    cursor: pointer;
    margin-left: 10px;
}

.w-25 {
    width: 25%;
}

.w-80 {
    width: 80%;
}

.w-100 {
    width: 100%
}


.mr-3 {
    margin-right: 5px;
}

.h-100 {
    height: 100%;
}

.h-80 {
    height: 80%;
}

.position-relative {
    position: relative;
}

.position-absolute {
    position: absolute;
}


#main-container > .title-image > .container {
    height: 100%;
}

#main-container .title-image .row {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    justify-content: center;
}

/* 熱門主題地圖、最新消息 */
.info-combine-container {
    width: 85%;
    justify-content: center;
    margin: 10% auto 5%;
    position: relative;
    z-index: 2;
}

    .info-combine-container .title {
        margin-bottom: 20px;
    }

    .info-combine-container .map-card:last-child {
        margin: 0 0 0 20px;
    }

    .info-combine-container .map-card {
        width: calc(50% - 15px);
        background: #FFFFFF;
        box-shadow: 0px 0px 6px #00000029;
        border-radius: 6px;
        padding: 15px 10px 10px;
    }


        .info-combine-container .map-card img {
            width: 100%;
        }

        .info-combine-container .map-card a p:first-child {
            margin-top: 30%;
        }

    .info-combine-container .news-card {
        width: 100%;
        height: 120px;
        background: #FFFFFF;
        box-shadow: 0px 0px 6px #00000029;
        border-radius: 6px;
        margin-bottom: 10px;
        padding: 15px;
        position: relative;
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
    }

    .info-combine-container .news-date {
        position: absolute;
        top: 5px;
        right: 5px;
        color: #6C6C6C;
        font-weight: 200;
        font-size: 12px;
        margin: 0;
    }

    .info-combine-container .news-content {
        line-height: 1.4;
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        margin-top: 10px;
    }
.news-content ul {
    margin: 5px;
}

.tooltip {
    width: 100%;
    position: absolute;
    left: 0;
    top: 93%;
    padding: 5px 10px;
    background: #000;
    color: #fff;
    border-radius: 4px;
    z-index: 10;
    opacity: 0.9;
}
    .info-combine-container .linkButton {
        cursor: pointer;
        text-align: right;
        color: #1A82D9;
        margin-top: 20px;
        font-size: 1.2rem;
    }

.container .title {
    text-align: left;
}

    .container .title .main {
        display: block;
        color: #4D4D4D;
        font-size: 36px;
        font-weight: 700;
    }

    .container .title .second {
        color: #1A82D9;
        display: block;
        margin-top: 15px;
        font-size: 18px;
    }

.container .text-center {
    text-align: center;
}

.container {
    position: relative;
    z-index: 1;
}

.add-p-top {
    padding-top: 30px;
}

.index-button {
    width: 35px;
    height: 35px;
    cursor: pointer;
    background-color: #1A82D9;
    color: white;
    border: 0;
    border-radius: 25px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 1;
    position: relative;
}

.swipe-container {
    display: flex;
    width: 100%;
    margin: 2% auto 3%;
    justify-content: center;
    align-items: center;
    position: relative;
}

.overlay:first-child {
    top: 0;
    left: -10px;
}

.overlay:last-child {
    top: 0;
    right: -10px;
}

.swipe-cards-container {
    width: 90%;
    overflow: hidden;
    padding: 10px 0;
}

.swipe-wrapper {
    display: flex;
    width: 100%;
    transition: transform 0.5s ease;
}

.swipe-container .button-disabled {
    background-color: #71B5EE;
    cursor: default;
}

.swipe-container button::after:last-child {
    right: 0;
}

.button-left {
    background-image: url('Images/左.svg');
    margin-right: 10px;
}

.button-right {
    background-image: url('Images/右.svg');
    margin-left: 10px;
}

.video-card {
    min-width: calc((100% / 4) - 30px);
    height: 200px;
    margin: 0 15px 0 15px;
    padding: 0 10px;
    background: #FFFFFF;
    box-shadow: 0px 0px 6px #00000029;
    border-radius: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
}

    .video-card div {
        width: 100%;
    }

.video-icon {
    width: 100%;
    height: 100px;
    background-repeat: no-repeat;
    background-position: center;
    align-content: center;
}

.video-hover-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 25px 15px 10px;
    height: 100%;
}

.video-title {
    font-size: 1.3rem;
    font-weight: 700;
    text-align: center;
}

.video-play-group {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    font-weight: 700;
    text-decoration: underline;
    color: #4D4D4D;
}

    .video-play-group a {
        padding-top: 5px;
        color: #4D4D4D;
    }

        .video-play-group a:hover {
            color: #1A82D9;
        }

        .video-play-group a:first-child {
            padding-right: 10px;
            border-right: 2px solid #6C6C6C;
        }

        .video-play-group a:nth-child(2) {
            padding-left: 10px;
        }

/*常見問答*/

.faq-card {
    min-width: calc((100% / 3) - 30px);
    height: 350px;
    background: #FFFFFF;
    box-shadow: 0px 0px 6px #00000029;
    border-radius: 30px 6px 6px;
    margin: 0 15px;
    padding: 15px 10px 0;
    position: relative;
    transition: opacity 0.3s ease-in-out;
}

    .faq-card h3 {
        height: 12%;
        margin: 0 2% 5% 5%;
        padding-left: 15%;
        border-bottom: 2px solid #1A82D9;
        color: #1A82D9;
        display: flex;
        align-items: center;
    }

.faq-icon {
    background-image: url('./Images/問答.svg');
    background-repeat: no-repeat;
    width: 20%;
    height: 20%;
    position: absolute;
    top: 0;
    left: 0;
}

.faq-card span {
    margin-bottom: 5px;
}

.faq-question {
    cursor: pointer;
    display: flex;
}

    .faq-question:hover {
        color: #1A82D9;
    }

    .faq-question p {
        margin: 5px 0 10px;
        width: 85%;
    }

    .faq-question .Q-icon {
        width: 13%;
    }

.faq-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
}

.faq-modal {
    display: block;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #ffffff;
    width: 50%;
    max-height: 600px;
    padding-bottom: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    z-index: 1001;
    overflow-x: hidden;
    overflow-y: auto;
}

.faq-modal-question {
    color: #1A82D9;
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    margin: 20px 8px 0 10px;
    display: flex;
    align-items: baseline;
}

    .faq-modal-question p {
        width: 90%;
        margin-left: 5px;
    }

.faq-modal .close {
    font-weight: 700;
    position: absolute;
    right: 8px;
    top: 8px;
    width: 25px;
    height: 25px;
    border-radius: 25px;
    padding: 3px;
}

.faq-modal-question span, .faq-caption span {
    width: 5%;
}

.faq-caption {
    display: flex;
    align-items: baseline;
    padding: 0 15px;
}

    .faq-caption ul {
        list-style-type: disc;
        width: 92%;
        padding-left: 20px;
    }

    .faq-caption li {
        letter-spacing: 0.5px;
        line-height: 1.8;
        padding-bottom: 5px;
        word-break: break-all;
    }

        .faq-caption li a {
            color: #559AED;
            text-decoration: underline;
            cursor: pointer;
        }

        .faq-caption li span, .faq-tip span {
            font-weight: 900;
            position: relative;
            display: inline-block;
        }

        .faq-caption li span, .faq-tip div span {
            display: inline;
            background: linear-gradient(transparent 70%, rgba(249, 180, 70, 0.9) 30%);
        }

.faq-tip {
    background-color: #F0F9FF;
    margin: 10px 10px 0;
    padding: 15px 8px;
    border-radius: 8px;
    line-height: 1.8;
    letter-spacing: 0.5px;
}

    .faq-tip .tip-title {
        color: #1A82D9;
        font-size: 1.1rem;
    }

    .faq-tip div {
        margin: 5px 0 0 10px;
    }

.download-card-container {
    width: 93%;
    margin: 20px auto 5%;
    justify-content: center;
}

.row .download-card {
    width: calc(23% - 20px);
    height: 220px;
    background: #FFFFFF;
    box-shadow: 0px 0px 6px #00000029;
    border-radius: 3px;
    margin: 15px;
    position: relative;
}

.download-card .crown-icon {
    background: url('Images/Index/icon_最新上架圖資.svg') no-repeat;
    position: absolute;
    width: 20%;
    height: 20%;
    top: -10px;
    left: -10px;
}

.download-card .title {
    color: #121212;
    font-size: 16px;
    font-weight: 700;
    width: 75%;
    margin: 30px auto;
}

.download-card .card-text {
    width: 75%;
    margin: 0 auto;
}

.card-text div {
    margin-bottom: 8px;
}

.download-card .download {
    position: absolute;
    bottom: 20px;
    right: 20px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 70%;
    cursor: pointer;
    color: #1A82D9;
}

.download-icon {
    background: url('Images/Index/下載.svg') no-repeat;
    display: block;
    width: 15%;
    height: 20px;
}

.download-linkbutton {
    display: none;
    height: 60px;
    width: 40%;
    text-align: center;
    font-size: 18px;
    margin: 20px auto 10px;
    border: 2px solid #1A82D9;
    color: #1A82D9;
    border-radius: 8px;
    align-content: center;
    cursor: pointer;
}

    .download-linkbutton:hover {
        color: white;
        background-color: #1A82D9;
    }

.achievement {
    position: relative;
    padding: 10% 0 2%;
}

    .achievement > .row > .item {
        text-align: center;
        font-size: 1.2rem;
        padding: 30px 0px;
    }

        .achievement > .row > .item > div:first-child {
            width: 60px;
            height: 80px;
            background-position: center;
            background-repeat: no-repeat;
            margin: 0 auto;
        }

        .achievement > .row > .item > .views {
            background-image: url('Images/Index/icon_總瀏覽量.svg');
        }

        .achievement > .row > .item > .stores {
            background-image: url('Images/Index/icon_收納圖資.svg');
        }

        .achievement > .row > .item > .downloads {
            background-image: url('Images/Index/icon_公開資料下載.svg');
        }

        .achievement > .row > .item > .services {
            background-image: url('Images/Index/icon_服務供應.svg');
        }

        .achievement > .row > .item > .awards {
            background-image: url('Images/Index/icon_獲獎紀錄.svg');
        }

        .achievement > .row > .item > .number {
            margin-top: 10px;
        }

            .achievement > .row > .item > .number > a,
            .number > span {
                font-size: 1.8em;
                font-weight: 800;
                font-family: 'Poppins', sans-serif;
                letter-spacing: 1px;
                color: #1A82D9;
            }

.links-container {
    background-color: #00569E;
    color: white;
    padding: 5em 5em 3em;
    display: flex;
}

    .links-container .functionlink-container {
        flex: 0.83;
    }

    .links-container .firstTwo-links:first-child {
        margin-bottom: 30px;
    }

    .links-container .functionlink {
        width: 16%;
    }

    .links-container .title {
        font-size: 1.3rem;
        font-weight: 500;
        margin-bottom: 15px;
    }

    .links-container .sub-title {
        font-size: 1.03rem;
        font-weight: 100;
        letter-spacing: 1px;
        color: #CCCCCC;
        margin-bottom: 8px;
    }

    .links-container .functionlink .sub-title {
        cursor: pointer;
    }

    .links-container .unitInfo {
        flex: 0.18;
        padding-left: 2rem;
        border-left: 1px solid #CCCCCC;
    }

    .links-container .item:last-child {
        margin-top: 3.5rem;
    }

.container .customize-white-background {
    background-color: white;
    height: 100%;
    transform: translate(-50%, 33%);
}

.container .customize-cloud-background {
    transform: translate(-50%, -40%);
}

.container .customize-waterlevel-background {
    transform: translate(-50%, -20%) scaleX(-1);
}

.cloud-backgroundImage {
    background-image: url('Images/背景雲朵.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 100vw;
    height: 32vh;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -30%);
    z-index: -1;
    overflow: hidden;
}

.white-backgroundColor {
    background-color: #FBFBFB;
    width: 100vw;
    height: 95%;
    overflow: hidden;
    background-position: top;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, 25%);
    z-index: -1;
}

.waterlevel-backgroundImage {
    background-image: url('Images/背景水位.svg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 100vw;
    height: 20vh;
    overflow: hidden;
    top: 0;
    left: 50%;
    transform: translate(-50%, -36%);
    position: absolute;
    z-index: -1;
}

/* 快速連結 */

#fastLink {
    position: fixed;
    top: 150px;
    right: 15px;
    background-color: rgba(255, 255, 255, 0.75);
    color: rgba(0, 0, 0, 0.75);
    padding: 0 10px;
    border-radius: 5px;
    text-align: center;
    width: 52px;
    z-index: 3;
}

    #fastLink .icon-button {
        cursor: pointer;
        position: relative;
        z-index: 2;
        margin: 3px;
        padding: 7px 0;
        border-bottom: 1px solid #ffffff;
    }

        #fastLink .icon-button:last-child {
            border-bottom: 0;
        }

        #fastLink .icon-button .button-label {
            visibility: hidden;
            position: absolute;
            right: -12px;
            top: -3px;
            background-color: rgba(255, 255, 255, 1);
            color: #1A82D9;
            padding: 15px 55px 15px 14px;
            border-radius: 25px;
            white-space: nowrap;
            font-weight: 100;
            z-index: -1;
            align-content: center;
            font-size: 1.1rem;
        }

        #fastLink .icon-button:hover .button-label {
            visibility: visible;
        }

#backToTopButton {
    background-image: url('Images/Index/icon_回頂端.svg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    position: fixed;
    bottom: 20px;
    right: 15px;
    width: 60px;
    height: 60px;
    z-index: 2;
    cursor: pointer;
    background-color: #FFB82A;
    border-radius: 5px;
}

.z-0 {
    z-index: 0;
}

@media only screen and (min-width: 1500px) {
    .faq-card h3 {
        height: 15%;
    }
}

@media only screen and (min-width: 577px) and (max-width:1120px) {
    #main-container .search-container-info > div:first-child {
        margin-bottom: 5px;
        font-size: 1.8rem;
    }

    .row .download-card {
        height: 240px;
    }

    .slide-container .slide-image1 {
        background-image: url(Images/水利地理視覺圖_平板.jpg);
    }
}

@media only screen and (max-width:1120px) {
    .carousel-controls {
        display: none;
    }
}

    @media only screen and (min-width: 577px) and (max-width:790px) {
        .row .download-card {
            width: 35%;
            height: 160px;
            border-radius: 10px;
        }

        .white-backgroundColor {
            transform: translate(-50%, 15%);
        }

        .faq-card h3 {
            height: 10%;
        }
    }

    @media only screen and (max-width: 576px) {
        #fastLink {
            right: 5px;
            top: 110px;
            width: 45px;
        }

            #fastLink img {
                width: 110%;
            }

        #backToTopButton {
            right: 5px;
            width: 45px;
            height: 45px;
        }

        .faq-modal {
            width: 95%;
            max-height: 450px;
            top: 60%;
        }

        .faq-modal-question span, .faq-caption span {
            width: 8%;
        }

        .add-p-top {
            padding-top: 15%;
        }

        .slide-container .slide-image1 {
            background-image: url(Images/水利地理視覺圖_手機板.jpg);
        }

        .carousel-controls .control-common {
            width: 25px;
            height: 30px;
        }

        .container .title .main {
            font-size: 28px;
        }

        #main-container .search-container {
            display: block;
            padding: 20px;
            height: 50%;
            z-index: 9;
        }

        #main-container .search-container-info {
            display: block;
            width: 100%;
        }

            #main-container .search-container-info > div:first-child {
                display: block;
                width: 100%;
                font-size: 20px;
                margin-bottom: 5px;
            }

        #main-container .search-container-search {
            width: 100%;
            display: block;
            margin-top: 5px;
        }

        .video-card {
            min-width: calc(100% - 30px);
        }

        .faq-card {
            min-width: calc(100% - 20px);
            margin: 0 10px;
        }

        .faq-question {
            font-size: 0.9rem;
        }

        .index-button {
            width: 30px;
            height: 30px;
        }

        .row .download-card {
            width: 80%;
            height: 150px;
            border-radius: 10px;
        }

        .download-card:nth-child(n+6):nth-child(-n+8) {
            display: none;
        }

        .download-card .crown-icon {
            width: 23%;
            height: 23%;
        }

        .download-card .title {
            margin: 25px auto 10px;
        }

        .achievement > .row > .item {
            text-align: center;
            font-size: 0.75rem;
            padding: 20px 10px;
        }

        .last-two {
            margin-right: 0;
            margin-left: 50px;
        }

            .last-two:last-child {
                margin-left: 0;
                margin-right: 50px;
            }

        .links-container .functionlink-container {
            display: none;
        }

        .links-container .unitInfo {
            flex: 1;
            border: 0;
        }

        .info-combine-container .title {
            text-align: center;
        }

        .info-combine-container .map-card:last-child {
            margin: 5% 0 0;
        }

        .info-combine-container .map-card {
            width: 100%;
            background: #FFFFFF;
            box-shadow: 0px 0px 6px #00000029;
            border-radius: 6px;
        }

        .info-combine-container .news-card {
            height: 110px;
            margin-bottom: 20px;
        }

        .info-combine-container .news-content {
            font-size: 0.9rem;
        }


        .download-linkbutton {
            display: block;
        }

        .info-combine-container {
            margin-bottom: 60px;
        }

        /* 背景圖案 */
        .waterlevel-backgroundImage {
            height: 7vh;
        }

        .cloud-backgroundImage {
            width: 120%;
            height: 15vh;
            transform: translate(-50%, -25%);
        }

        .white-backgroundColor {
            background-color: white;
            height: 100%;
            transform: translate(-50%, 5%);
        }

        .waterlevel-backgroundImage {
            transform: translate(-50%, -10%);
        }

        .container .customize-white-background {
            height: 100%;
            transform: translate(-50%, 15%);
        }
    }
