<style>


.mid-page.show-up {
    -webkit-animation: fadeInUp 2s both;
    animation: fadeInUp 2s both;
}
.mid-page {
position: absolute;
    width: 498px;
    height: 572px;
    left: 49%;
    top: 50%;
    margin-top: -293px;
    z-index: 999;
    display: block;
    opacity: 1;
}
.title{
  padding-top: 0px;
}
.title2{
font-size: 12px;
    background-color: #fdb901;
    width: 62px;
    margin-bottom: 0px;
    padding-top: 0px;
    padding: 6px;
    border-radius: 55px;
    color: #000000f3;
    font-weight: 500;
    margin-left: 11px;
}

.dist{
  display: none;
  opacity: 0;
}
.p3d-layer {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 9;
}
.page-2 .title {
    width: 299.6px;
    height: 140px;
    margin-bottom: 20px;
    margin-left: 20px;
    margin-top: 90px;
}
.p3d-page {
    width: 100%;
    height: 100%;
    position: absolute;
}

.page-2 .p2 {
    height: 520px;
}
.sub-page .p2 {
    position: absolute;
    right: 0;
    top: 44%;
    transform: translate(0, -50%);
}
.page-2 .p1 {
    width: 377.3px;
    height: 421.4px;
}
.sub-page .p1 {
    position: absolute;
    right: 6%;
    top: 50%;
    transform: translate(0, -50%);
}

.download-zone .download-btn .btn-zone {
    width: 180px;
    height: 100%;
    float: left;
    text-align: center;
    line-height: 42px;
}
.download-zone .download-btn .qr-zone {
    width: 42px;
    height: 100%;
 background-size: 17px 17px;
    float: left;
    position: relative;
}

.main2 .title2 {
    margin: 0;
    font-size: 60px;
    font-weight: 700;
    font-family: CenturyGothicBold;
    color: #ffffff;
}
.main2 {
    position: absolute;
}



.copyright3 {
    position: absolute;
    bottom: 0px;
    z-index: 200;
    width: 100%;
}

.vis {
    position: absolute;
    z-index: 100;
    width: 100%;
    top: 0px;
    text-align: center;
    background-image: url(bg.png);
}
.vis img {
    width: 95%;
}
img {
    border: none;
}
.vis_2 {
    width: 90%;
    margin: auto;
}
.vis_2 img {
    width: 45%;
    margin-top: 5%;
    margin-right: 2%;
    margin-left: 2%;
}
.top {
    height: 80px;
    background-repeat: repeat-x;
    padding-top: 20px;
    margin-right: auto;
    margin-left: auto;
    width: 100%;
    position: fixed;
    z-index: 1000;
    top: 0px;
}
.logo {
    height: 58px;
    width: 154px;
    float: left;
    padding-left: 30px;
}
.logo a {
height: 58px;
    width: 132px;
    text-decoration: none;
    display: block;
    background-image: url(logo_hover.png);
    background-size: 122px 54px;
    background-repeat: no-repeat;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    transform: rotate(0deg);
    background-position: left;
}
.logo a:hover {
    background-image: url(logo_hover.png);
    background-repeat: no-repeat;
    opacity: 0.5;
}
.b{
  margin-top: 150px;
}

.logos {
    width: 223px;
    height: 30px;
    float: left;
}
.logos a {
    text-decoration: none;
    display: block;
height: 89px;
    width: 95px;
    background-image: url(jiejin2.png);
    background-repeat: no-repeat;
    background-position: center bottom;
}
.c-footer{
  margin-top: 100px;
}

    *,
    :after,
    :before {
      box-sizing: inherit;
    }

    html {
      box-sizing: border-box
    }

    input[type=email],
    input[type=password],
    input[type=search],
    input[type=text] {
      -webkit-appearance: none;
      -moz-appearance: none
    }

    html {
      line-height: 1.15;
      -ms-text-size-adjust: 100%;
      -webkit-text-size-adjust: 100%
    }

    body {
      background-image: url("bg-2020-mar04.jpg");
      background-repeat: no-repeat;
      background-position: 50% 50%;
      background-size: cover;
      background-attachment: fixed;
      font-family: Helvetica, Tahoma, Arial, PingFang SC, STXihei, \\534E\6587\7EC6\9ED1, Microsoft YaHei, \\5FAE\8F6F\96C5\9ED1, sans-serif;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      color: #fff
    }

    body {
      margin: 0
    }

    article,
    aside,
    footer,
    header,
    nav,
    section {
      display: block
    }

    h1 {
      font-size: 2em;
      margin: .67em 0
    }

    figcaption,
    figure,
    main {
      display: block
    }

    figure {
      margin: 1em 40px
    }

    hr {
      box-sizing: content-box;
      height: 0;
      overflow: visible
    }

    pre {
      font-family: monospace, monospace;
      font-size: 1em
    }

    a {
      background-color: transparent;
      -webkit-text-decoration-skip: objects
    }

    abbr[title] {
      border-bottom: none;
      text-decoration: underline;
      text-decoration: underline dotted
    }

    b,
    strong {
      font-weight: inherit;
      font-weight: bolder
    }

    code,
    kbd,
    samp {
      font-family: monospace, monospace;
      font-size: 1em
    }

    dfn {
      font-style: italic
    }

    mark {
      background-color: #ff0;
      color: #000
    }

    small {
      font-size: 80%
    }

    sub,
    sup {
      font-size: 75%;
      line-height: 0;
      position: relative;
      vertical-align: baseline
    }

    sub {
      bottom: -.25em
    }

    sup {
      top: -.5em
    }

    audio,
    video {
      display: inline-block
    }

    audio:not([controls]) {
      display: none;
      height: 0
    }

    img {
      border-style: none
    }

    svg:not(:root) {
      overflow: hidden
    }

    button,
    input,
    optgroup,
    select,
    textarea {
      font-family: sans-serif;
      font-size: 100%;
      line-height: 1.15;
      margin: 0
    }

    button,
    input {
      overflow: visible
    }

    button,
    select {
      text-transform: none
    }

    [type=reset],
    [type=submit],
    button,
    html [type=button] {
      -webkit-appearance: button
    }

    [type=button]::-moz-focus-inner,
    [type=reset]::-moz-focus-inner,
    [type=submit]::-moz-focus-inner,
    button::-moz-focus-inner {
      border-style: none;
      padding: 0
    }

    [type=button]:-moz-focusring,
    [type=reset]:-moz-focusring,
    [type=submit]:-moz-focusring,
    button:-moz-focusring {
      outline: 1px dotted ButtonText
    }

    fieldset {
      padding: .35em .75em .625em
    }

    legend {
      box-sizing: border-box;
      color: inherit;
      display: table;
      max-width: 100%;
      padding: 0;
      white-space: normal
    }

    progress {
      display: inline-block;
      vertical-align: baseline
    }

    textarea {
      overflow: auto
    }

    [type=checkbox],
    [type=radio] {
      box-sizing: border-box;
      padding: 0
    }

    [type=number]::-webkit-inner-spin-button,
    [type=number]::-webkit-outer-spin-button {
      height: auto
    }

    [type=search] {
      -webkit-appearance: textfield;
      outline-offset: -2px
    }

    [type=search]::-webkit-search-cancel-button,
    [type=search]::-webkit-search-decoration {
      -webkit-appearance: none
    }

    ::-webkit-file-upload-button {
      -webkit-appearance: button;
      font: inherit
    }

    details,
    menu {
      display: block
    }

    summary {
      display: list-item
    }

    canvas {
      display: inline-block
    }

    [hidden],
    template {
      display: none
    }

    /*!
 * # Semantic UI 2.2.12 - Container
 * http://github.com/semantic-org/semantic-ui/
 *
 *
 * Released under the MIT license
 * http://opensource.org/licenses/MIT
 *
 */
    .ui.container {
      display: block;
      max-width: 100% !important
    }

    @media only screen and (max-width:767px) {
      .ui.container {
        margin-left: 1em !important;
        margin-right: 1em !important
      }

      .ui.container,
      .ui.grid.container,
      .ui.relaxed.grid.container,
      .ui.very.relaxed.grid.container {
        width: auto !important
      }
    }

    @media only screen and (min-width:768px) and (max-width:991px) {
      .ui.container {
        width: 723px;
        margin-left: auto !important;
        margin-right: auto !important
      }

      .ui.grid.container {
        width: calc(723px + 2rem) !important
      }

      .ui.relaxed.grid.container {
        width: calc(723px + 3rem) !important
      }

      .ui.very.relaxed.grid.container {
        width: calc(723px + 5rem) !important
      }
    }

    @media only screen and (min-width:992px) and (max-width:1199px) {
      .ui.container {
        width: 933px;
        margin-left: auto !important;
        margin-right: auto !important
      }

      .ui.grid.container {
        width: calc(933px + 2rem) !important
      }

      .ui.relaxed.grid.container {
        width: calc(933px + 3rem) !important
      }

      .ui.very.relaxed.grid.container {
        width: calc(933px + 5rem) !important
      }
    }

    @media only screen and (min-width:1200px) {
      .ui.container {
        width: 1127px;
        margin-left: auto !important;
        margin-right: auto !important
      }

      .ui.grid.container {
        width: calc(1127px + 2rem) !important
      }

      .ui.relaxed.grid.container {
        width: calc(1127px + 3rem) !important
      }

      .ui.very.relaxed.grid.container {
        width: calc(1127px + 5rem) !important
      }
    }

    .ui.text.container {
      font-family: Lato, Helvetica Neue, Arial, Helvetica, sans-serif;
      max-width: 700px !important;
      line-height: 1.5;
      font-size: 1.14285714rem
    }

    .ui.fluid.container {
      width: 100%
    }

    .ui[class*="left aligned"].container {
      text-align: left
    }

    .ui[class*="center aligned"].container {
      text-align: center
    }

    .ui[class*="right aligned"].container {
      text-align: right
    }

    .ui.justified.container {
      text-align: justify;
      -webkit-hyphens: auto;
      -ms-hyphens: auto;
      hyphens: auto
    }

    /*!
 * # Semantic UI 2.2.12 - Grid
 * http://github.com/semantic-org/semantic-ui/
 *
 *
 * Released under the MIT license
 * http://opensource.org/licenses/MIT
 *
 */
    .ui.grid {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -ms-flex-wrap: wrap;
      /*flex-wrap: wrap;*/ 20190522
      -webkit-box-align: stretch;
      -ms-flex-align: stretch;
      align-items: stretch;
      padding: 0;
      margin: -1rem
    }

    .ui.relaxed.grid {
      margin-left: -1.5rem;
      margin-right: -1.5rem
    }

    .ui[class*="very relaxed"].grid {
      margin-left: -2.5rem;
      margin-right: -2.5rem
    }

    .ui.grid+.grid {
      margin-top: 1rem
    }

    .ui.grid>.column:not(.row),
    .ui.grid>.row>.column {
      position: relative;
      display: inline-block;
      width: 6.25%;
      padding-left: 1rem;
      padding-right: 1rem;
      vertical-align: top
    }

    .ui.grid>* {
      padding-left: 1rem;
      padding-right: 1rem
    }

    .ui.grid>.row {
      position: relative;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
      -ms-flex-direction: row;
      flex-direction: row;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      -webkit-box-pack: inherit;
      -ms-flex-pack: inherit;
      justify-content: inherit;
      -webkit-box-align: stretch;
      -ms-flex-align: stretch;
      align-items: stretch;
      width: 100% !important;
      padding: 0;
      padding-top: 1rem;
      padding-bottom: 1rem
    }

    .ui.grid>.column:not(.row) {
      padding-top: 1rem;
      padding-bottom: 1rem
    }

    .ui.grid>.row>.column {
      margin-top: 0;
      margin-bottom: 0
    }

    .ui.grid>.row>.column>img,
    .ui.grid>.row>img {
      max-width: 100%
    }

    .ui.grid>.ui.grid:first-child {
      margin-top: 0
    }

    .ui.grid>.ui.grid:last-child {
      margin-bottom: 0
    }

    .ui.aligned.grid .column>.segment:not(.compact):not(.attached),
    .ui.grid .aligned.row>.column>.segment:not(.compact):not(.attached) {
      width: 100%
    }

    .ui.grid .row+.ui.divider {
      -webkit-box-flex: 1;
      -ms-flex-positive: 1;
      flex-grow: 1;
      margin: 1rem
    }

    .ui.grid .column+.ui.vertical.divider {
      height: calc(50% - 1rem)
    }

    .ui.grid>.column:last-child>.horizontal.segment,
    .ui.grid>.row>.column:last-child>.horizontal.segment {
      box-shadow: none
    }

    @media only screen and (max-width:767px) {
      .ui.page.grid {
        width: auto;
        padding-left: 0;
        padding-right: 0;
        margin-left: 0;
        margin-right: 0
      }
    }

    @media only screen and (min-width:768px) and (max-width:991px) {
      .ui.page.grid {
        width: auto;
        margin-left: 0;
        margin-right: 0;
        padding-left: 2em;
        padding-right: 2em
      }
    }

    @media only screen and (min-width:992px) and (max-width:1199px) {
      .ui.page.grid {
        width: auto;
        margin-left: 0;
        margin-right: 0;
        padding-left: 3%;
        padding-right: 3%
      }
    }

    @media only screen and (min-width:1200px) and (max-width:1919px) {
      .ui.page.grid {
        width: auto;
        margin-left: 0;
        margin-right: 0;
        padding-left: 15%;
        padding-right: 15%
      }
    }

    @media only screen and (min-width:1920px) {
      .ui.page.grid {
        width: auto;
        margin-left: 0;
        margin-right: 0;
        padding-left: 23%;
        padding-right: 23%
      }
    }

    .ui.grid>.column:only-child,
    .ui.grid>.row>.column:only-child,
    .ui[class*="one column"].grid>.column:not(.row),
    .ui[class*="one column"].grid>.row>.column {
      width: 100%
    }

    .ui[class*="two column"].grid>.column:not(.row),
    .ui[class*="two column"].grid>.row>.column {
      width: 50%
    }

    .ui[class*="three column"].grid>.column:not(.row),
    .ui[class*="three column"].grid>.row>.column {
      width: 33.33333333%
    }

    .ui[class*="four column"].grid>.column:not(.row),
    .ui[class*="four column"].grid>.row>.column {
      width: 25%
    }

    .ui[class*="five column"].grid>.column:not(.row),
    .ui[class*="five column"].grid>.row>.column {
      width: 20%
    }

    .ui[class*="six column"].grid>.column:not(.row),
    .ui[class*="six column"].grid>.row>.column {
      width: 16.66666667%
    }

    .ui[class*="seven column"].grid>.column:not(.row),
    .ui[class*="seven column"].grid>.row>.column {
      width: 14.28571429%
    }

    .ui[class*="eight column"].grid>.column:not(.row),
    .ui[class*="eight column"].grid>.row>.column {
      width: 12.5%
    }

    .ui[class*="nine column"].grid>.column:not(.row),
    .ui[class*="nine column"].grid>.row>.column {
      width: 11.11111111%
    }

    .ui[class*="ten column"].grid>.column:not(.row),
    .ui[class*="ten column"].grid>.row>.column {
      width: 10%
    }

    .ui[class*="eleven column"].grid>.column:not(.row),
    .ui[class*="eleven column"].grid>.row>.column {
      width: 9.09090909%
    }

    .ui[class*="twelve column"].grid>.column:not(.row),
    .ui[class*="twelve column"].grid>.row>.column {
      width: 8.33333333%
    }

    .ui[class*="thirteen column"].grid>.column:not(.row),
    .ui[class*="thirteen column"].grid>.row>.column {
      width: 7.69230769%
    }

    .ui[class*="fourteen column"].grid>.column:not(.row),
    .ui[class*="fourteen column"].grid>.row>.column {
      width: 7.14285714%
    }

    .ui[class*="fifteen column"].grid>.column:not(.row),
    .ui[class*="fifteen column"].grid>.row>.column {
      width: 6.66666667%
    }

    .ui[class*="sixteen column"].grid>.column:not(.row),
    .ui[class*="sixteen column"].grid>.row>.column {
      width: 6.25%
    }

    .ui.grid>[class*="one column"].row>.column {
      width: 100% !important
    }

    .ui.grid>[class*="two column"].row>.column {
      width: 50% !important
    }

    .ui.grid>[class*="three column"].row>.column {
      width: 33.33333333% !important
    }

    .ui.grid>[class*="four column"].row>.column {
      width: 25% !important
    }

    .ui.grid>[class*="five column"].row>.column {
      width: 20% !important
    }

    .ui.grid>[class*="six column"].row>.column {
      width: 16.66666667% !important
    }

    .ui.grid>[class*="seven column"].row>.column {
      width: 14.28571429% !important
    }

    .ui.grid>[class*="eight column"].row>.column {
      width: 12.5% !important
    }

    .ui.grid>[class*="nine column"].row>.column {
      width: 11.11111111% !important
    }

    .ui.grid>[class*="ten column"].row>.column {
      width: 10% !important
    }

    .ui.grid>[class*="eleven column"].row>.column {
      width: 9.09090909% !important
    }

    .ui.grid>[class*="twelve column"].row>.column {
      width: 8.33333333% !important
    }

    .ui.grid>[class*="thirteen column"].row>.column {
      width: 7.69230769% !important
    }

    .ui.grid>[class*="fourteen column"].row>.column {
      width: 7.14285714% !important
    }

    .ui.grid>[class*="fifteen column"].row>.column {
      width: 6.66666667% !important
    }

    .ui.grid>[class*="sixteen column"].row>.column {
      width: 6.25% !important
    }

    .ui.celled.page.grid {
      box-shadow: none
    }

    .ui.column.grid>[class*="one wide"].column,
    .ui.grid>.column.row>[class*="one wide"].column,
    .ui.grid>.row>[class*="one wide"].column,
    .ui.grid>[class*="one wide"].column {
      width: 6.25% !important
    }

    .ui.column.grid>[class*="two wide"].column,
    .ui.grid>.column.row>[class*="two wide"].column,
    .ui.grid>.row>[class*="two wide"].column,
    .ui.grid>[class*="two wide"].column {
      width: 12.5% !important
    }

    .ui.column.grid>[class*="three wide"].column,
    .ui.grid>.column.row>[class*="three wide"].column,
    .ui.grid>.row>[class*="three wide"].column,
    .ui.grid>[class*="three wide"].column {
      width: 18.75% !important
    }

    .ui.column.grid>[class*="four wide"].column,
    .ui.grid>.column.row>[class*="four wide"].column,
    .ui.grid>.row>[class*="four wide"].column,
    .ui.grid>[class*="four wide"].column {
      width: 45% !important
    }

    .ui.column.grid>[class*="five wide"].column,
    .ui.grid>.column.row>[class*="five wide"].column,
    .ui.grid>.row>[class*="five wide"].column,
    .ui.grid>[class*="five wide"].column {
      width: 31.25% !important
    }

    .ui.column.grid>[class*="six wide"].column,
    .ui.grid>.column.row>[class*="six wide"].column,
    .ui.grid>.row>[class*="six wide"].column,
    .ui.grid>[class*="six wide"].column {
      width: 37.5% !important
    }

    .ui.column.grid>[class*="seven wide"].column,
    .ui.grid>.column.row>[class*="seven wide"].column,
    .ui.grid>.row>[class*="seven wide"].column,
    .ui.grid>[class*="seven wide"].column {
      width: 43.75% !important
    }

    .ui.column.grid>[class*="eight wide"].column,
    .ui.grid>.column.row>[class*="eight wide"].column,
    .ui.grid>.row>[class*="eight wide"].column,
    .ui.grid>[class*="eight wide"].column {
      width: 50% !important
    }

    .ui.column.grid>[class*="nine wide"].column,
    .ui.grid>.column.row>[class*="nine wide"].column,
    .ui.grid>.row>[class*="nine wide"].column,
    .ui.grid>[class*="nine wide"].column {
      width: 56.25% !important
    }

    .ui.column.grid>[class*="ten wide"].column,
    .ui.grid>.column.row>[class*="ten wide"].column,
    .ui.grid>.row>[class*="ten wide"].column,
    .ui.grid>[class*="ten wide"].column {
      width: 62.5% !important
    }

    .ui.column.grid>[class*="eleven wide"].column,
    .ui.grid>.column.row>[class*="eleven wide"].column,
    .ui.grid>.row>[class*="eleven wide"].column,
    .ui.grid>[class*="eleven wide"].column {
      width: 68.75% !important
    }

    .ui.column.grid>[class*="twelve wide"].column,
    .ui.grid>.column.row>[class*="twelve wide"].column,
    .ui.grid>.row>[class*="twelve wide"].column,
    .ui.grid>[class*="twelve wide"].column {
      width: 75% !important
    }

    .ui.column.grid>[class*="thirteen wide"].column,
    .ui.grid>.column.row>[class*="thirteen wide"].column,
    .ui.grid>.row>[class*="thirteen wide"].column,
    .ui.grid>[class*="thirteen wide"].column {
      width: 81.25% !important
    }

    .ui.column.grid>[class*="fourteen wide"].column,
    .ui.grid>.column.row>[class*="fourteen wide"].column,
    .ui.grid>.row>[class*="fourteen wide"].column,
    .ui.grid>[class*="fourteen wide"].column {
      width: 87.5% !important
    }

    .ui.column.grid>[class*="fifteen wide"].column,
    .ui.grid>.column.row>[class*="fifteen wide"].column,
    .ui.grid>.row>[class*="fifteen wide"].column,
    .ui.grid>[class*="fifteen wide"].column {
      width: 93.75% !important
    }

    .ui.column.grid>[class*="sixteen wide"].column,
    .ui.grid>.column.row>[class*="sixteen wide"].column,
    .ui.grid>.row>[class*="sixteen wide"].column,
    .ui.grid>[class*="sixteen wide"].column {
      width: 100% !important
    }

    @media only screen and (min-width:320px) and (max-width:767px) {

      .ui.column.grid>[class*="one wide mobile"].column,
      .ui.grid>.column.row>[class*="one wide mobile"].column,
      .ui.grid>.row>[class*="one wide mobile"].column,
      .ui.grid>[class*="one wide mobile"].column {
        width: 6.25% !important
      }

      .ui.column.grid>[class*="two wide mobile"].column,
      .ui.grid>.column.row>[class*="two wide mobile"].column,
      .ui.grid>.row>[class*="two wide mobile"].column,
      .ui.grid>[class*="two wide mobile"].column {
        width: 12.5% !important
      }

      .ui.column.grid>[class*="three wide mobile"].column,
      .ui.grid>.column.row>[class*="three wide mobile"].column,
      .ui.grid>.row>[class*="three wide mobile"].column,
      .ui.grid>[class*="three wide mobile"].column {
        width: 18.75% !important
      }

      .ui.column.grid>[class*="four wide mobile"].column,
      .ui.grid>.column.row>[class*="four wide mobile"].column,
      .ui.grid>.row>[class*="four wide mobile"].column,
      .ui.grid>[class*="four wide mobile"].column {
        width: 25% !important
      }

      .ui.column.grid>[class*="five wide mobile"].column,
      .ui.grid>.column.row>[class*="five wide mobile"].column,
      .ui.grid>.row>[class*="five wide mobile"].column,
      .ui.grid>[class*="five wide mobile"].column {
        width: 31.25% !important
      }

      .ui.column.grid>[class*="six wide mobile"].column,
      .ui.grid>.column.row>[class*="six wide mobile"].column,
      .ui.grid>.row>[class*="six wide mobile"].column,
      .ui.grid>[class*="six wide mobile"].column {
        width: 37.5% !important
      }

      .ui.column.grid>[class*="seven wide mobile"].column,
      .ui.grid>.column.row>[class*="seven wide mobile"].column,
      .ui.grid>.row>[class*="seven wide mobile"].column,
      .ui.grid>[class*="seven wide mobile"].column {
        width: 43.75% !important
      }

      .ui.column.grid>[class*="eight wide mobile"].column,
      .ui.grid>.column.row>[class*="eight wide mobile"].column,
      .ui.grid>.row>[class*="eight wide mobile"].column,
      .ui.grid>[class*="eight wide mobile"].column {
        width: 50% !important
      }

      .ui.column.grid>[class*="nine wide mobile"].column,
      .ui.grid>.column.row>[class*="nine wide mobile"].column,
      .ui.grid>.row>[class*="nine wide mobile"].column,
      .ui.grid>[class*="nine wide mobile"].column {
        width: 56.25% !important
      }

      .ui.column.grid>[class*="ten wide mobile"].column,
      .ui.grid>.column.row>[class*="ten wide mobile"].column,
      .ui.grid>.row>[class*="ten wide mobile"].column,
      .ui.grid>[class*="ten wide mobile"].column {
        width: 62.5% !important
      }

      .ui.column.grid>[class*="eleven wide mobile"].column,
      .ui.grid>.column.row>[class*="eleven wide mobile"].column,
      .ui.grid>.row>[class*="eleven wide mobile"].column,
      .ui.grid>[class*="eleven wide mobile"].column {
        width: 68.75% !important
      }

      .ui.column.grid>[class*="twelve wide mobile"].column,
      .ui.grid>.column.row>[class*="twelve wide mobile"].column,
      .ui.grid>.row>[class*="twelve wide mobile"].column,
      .ui.grid>[class*="twelve wide mobile"].column {
        width: 75% !important
      }

      .ui.column.grid>[class*="thirteen wide mobile"].column,
      .ui.grid>.column.row>[class*="thirteen wide mobile"].column,
      .ui.grid>.row>[class*="thirteen wide mobile"].column,
      .ui.grid>[class*="thirteen wide mobile"].column {
        width: 81.25% !important
      }

      .ui.column.grid>[class*="fourteen wide mobile"].column,
      .ui.grid>.column.row>[class*="fourteen wide mobile"].column,
      .ui.grid>.row>[class*="fourteen wide mobile"].column,
      .ui.grid>[class*="fourteen wide mobile"].column {
        width: 87.5% !important
      }

      .ui.column.grid>[class*="fifteen wide mobile"].column,
      .ui.grid>.column.row>[class*="fifteen wide mobile"].column,
      .ui.grid>.row>[class*="fifteen wide mobile"].column,
      .ui.grid>[class*="fifteen wide mobile"].column {
        width: 93.75% !important
      }

      .ui.column.grid>[class*="sixteen wide mobile"].column,
      .ui.grid>.column.row>[class*="sixteen wide mobile"].column,
      .ui.grid>.row>[class*="sixteen wide mobile"].column,
      .ui.grid>[class*="sixteen wide mobile"].column {
        width: 100% !important
      }
    }

    @media only screen and (min-width:768px) and (max-width:991px) {

      .ui.column.grid>[class*="one wide tablet"].column,
      .ui.grid>.column.row>[class*="one wide tablet"].column,
      .ui.grid>.row>[class*="one wide tablet"].column,
      .ui.grid>[class*="one wide tablet"].column {
        width: 6.25% !important
      }

      .ui.column.grid>[class*="two wide tablet"].column,
      .ui.grid>.column.row>[class*="two wide tablet"].column,
      .ui.grid>.row>[class*="two wide tablet"].column,
      .ui.grid>[class*="two wide tablet"].column {
        width: 12.5% !important
      }

      .ui.column.grid>[class*="three wide tablet"].column,
      .ui.grid>.column.row>[class*="three wide tablet"].column,
      .ui.grid>.row>[class*="three wide tablet"].column,
      .ui.grid>[class*="three wide tablet"].column {
        width: 18.75% !important
      }

      .ui.column.grid>[class*="four wide tablet"].column,
      .ui.grid>.column.row>[class*="four wide tablet"].column,
      .ui.grid>.row>[class*="four wide tablet"].column,
      .ui.grid>[class*="four wide tablet"].column {
        width: 25% !important
      }

      .ui.column.grid>[class*="five wide tablet"].column,
      .ui.grid>.column.row>[class*="five wide tablet"].column,
      .ui.grid>.row>[class*="five wide tablet"].column,
      .ui.grid>[class*="five wide tablet"].column {
        width: 31.25% !important
      }

      .ui.column.grid>[class*="six wide tablet"].column,
      .ui.grid>.column.row>[class*="six wide tablet"].column,
      .ui.grid>.row>[class*="six wide tablet"].column,
      .ui.grid>[class*="six wide tablet"].column {
        width: 37.5% !important
      }

      .ui.column.grid>[class*="seven wide tablet"].column,
      .ui.grid>.column.row>[class*="seven wide tablet"].column,
      .ui.grid>.row>[class*="seven wide tablet"].column,
      .ui.grid>[class*="seven wide tablet"].column {
        width: 43.75% !important
      }

      .ui.column.grid>[class*="eight wide tablet"].column,
      .ui.grid>.column.row>[class*="eight wide tablet"].column,
      .ui.grid>.row>[class*="eight wide tablet"].column,
      .ui.grid>[class*="eight wide tablet"].column {
        width: 50% !important
      }

      .ui.column.grid>[class*="nine wide tablet"].column,
      .ui.grid>.column.row>[class*="nine wide tablet"].column,
      .ui.grid>.row>[class*="nine wide tablet"].column,
      .ui.grid>[class*="nine wide tablet"].column {
        width: 56.25% !important
      }

      .ui.column.grid>[class*="ten wide tablet"].column,
      .ui.grid>.column.row>[class*="ten wide tablet"].column,
      .ui.grid>.row>[class*="ten wide tablet"].column,
      .ui.grid>[class*="ten wide tablet"].column {
        width: 62.5% !important
      }

      .ui.column.grid>[class*="eleven wide tablet"].column,
      .ui.grid>.column.row>[class*="eleven wide tablet"].column,
      .ui.grid>.row>[class*="eleven wide tablet"].column,
      .ui.grid>[class*="eleven wide tablet"].column {
        width: 68.75% !important
      }

      .ui.column.grid>[class*="twelve wide tablet"].column,
      .ui.grid>.column.row>[class*="twelve wide tablet"].column,
      .ui.grid>.row>[class*="twelve wide tablet"].column,
      .ui.grid>[class*="twelve wide tablet"].column {
        width: 75% !important
      }

      .ui.column.grid>[class*="thirteen wide tablet"].column,
      .ui.grid>.column.row>[class*="thirteen wide tablet"].column,
      .ui.grid>.row>[class*="thirteen wide tablet"].column,
      .ui.grid>[class*="thirteen wide tablet"].column {
        width: 81.25% !important
      }

      .ui.column.grid>[class*="fourteen wide tablet"].column,
      .ui.grid>.column.row>[class*="fourteen wide tablet"].column,
      .ui.grid>.row>[class*="fourteen wide tablet"].column,
      .ui.grid>[class*="fourteen wide tablet"].column {
        width: 87.5% !important
      }

      .ui.column.grid>[class*="fifteen wide tablet"].column,
      .ui.grid>.column.row>[class*="fifteen wide tablet"].column,
      .ui.grid>.row>[class*="fifteen wide tablet"].column,
      .ui.grid>[class*="fifteen wide tablet"].column {
        width: 93.75% !important
      }

      .ui.column.grid>[class*="sixteen wide tablet"].column,
      .ui.grid>.column.row>[class*="sixteen wide tablet"].column,
      .ui.grid>.row>[class*="sixteen wide tablet"].column,
      .ui.grid>[class*="sixteen wide tablet"].column {
        width: 100% !important
      }
    }

    @media only screen and (min-width:992px) {

      .ui.column.grid>[class*="one wide computer"].column,
      .ui.grid>.column.row>[class*="one wide computer"].column,
      .ui.grid>.row>[class*="one wide computer"].column,
      .ui.grid>[class*="one wide computer"].column {
        width: 6.25% !important
      }

      .ui.column.grid>[class*="two wide computer"].column,
      .ui.grid>.column.row>[class*="two wide computer"].column,
      .ui.grid>.row>[class*="two wide computer"].column,
      .ui.grid>[class*="two wide computer"].column {
        width: 12.5% !important
      }

      .ui.column.grid>[class*="three wide computer"].column,
      .ui.grid>.column.row>[class*="three wide computer"].column,
      .ui.grid>.row>[class*="three wide computer"].column,
      .ui.grid>[class*="three wide computer"].column {
        width: 18.75% !important
      }

      .ui.column.grid>[class*="four wide computer"].column,
      .ui.grid>.column.row>[class*="four wide computer"].column,
      .ui.grid>.row>[class*="four wide computer"].column,
      .ui.grid>[class*="four wide computer"].column {
        width: 25% !important
      }

      .ui.column.grid>[class*="five wide computer"].column,
      .ui.grid>.column.row>[class*="five wide computer"].column,
      .ui.grid>.row>[class*="five wide computer"].column,
      .ui.grid>[class*="five wide computer"].column {
        width: 31.25% !important
      }

      .ui.column.grid>[class*="six wide computer"].column,
      .ui.grid>.column.row>[class*="six wide computer"].column,
      .ui.grid>.row>[class*="six wide computer"].column,
      .ui.grid>[class*="six wide computer"].column {
        width: 37.5% !important
      }

      .ui.column.grid>[class*="seven wide computer"].column,
      .ui.grid>.column.row>[class*="seven wide computer"].column,
      .ui.grid>.row>[class*="seven wide computer"].column,
      .ui.grid>[class*="seven wide computer"].column {
        width: 43.75% !important
      }

      .ui.column.grid>[class*="eight wide computer"].column,
      .ui.grid>.column.row>[class*="eight wide computer"].column,
      .ui.grid>.row>[class*="eight wide computer"].column,
      .ui.grid>[class*="eight wide computer"].column {
        width: 50% !important
      }

      .ui.column.grid>[class*="nine wide computer"].column,
      .ui.grid>.column.row>[class*="nine wide computer"].column,
      .ui.grid>.row>[class*="nine wide computer"].column,
      .ui.grid>[class*="nine wide computer"].column {
        width: 56.25% !important
      }

      .ui.column.grid>[class*="ten wide computer"].column,
      .ui.grid>.column.row>[class*="ten wide computer"].column,
      .ui.grid>.row>[class*="ten wide computer"].column,
      .ui.grid>[class*="ten wide computer"].column {
        width: 62.5% !important
      }

      .ui.column.grid>[class*="eleven wide computer"].column,
      .ui.grid>.column.row>[class*="eleven wide computer"].column,
      .ui.grid>.row>[class*="eleven wide computer"].column,
      .ui.grid>[class*="eleven wide computer"].column {
        width: 68.75% !important
      }

      .ui.column.grid>[class*="twelve wide computer"].column,
      .ui.grid>.column.row>[class*="twelve wide computer"].column,
      .ui.grid>.row>[class*="twelve wide computer"].column,
      .ui.grid>[class*="twelve wide computer"].column {
        width: 75% !important
      }

      .ui.column.grid>[class*="thirteen wide computer"].column,
      .ui.grid>.column.row>[class*="thirteen wide computer"].column,
      .ui.grid>.row>[class*="thirteen wide computer"].column,
      .ui.grid>[class*="thirteen wide computer"].column {
        width: 81.25% !important
      }

      .ui.column.grid>[class*="fourteen wide computer"].column,
      .ui.grid>.column.row>[class*="fourteen wide computer"].column,
      .ui.grid>.row>[class*="fourteen wide computer"].column,
      .ui.grid>[class*="fourteen wide computer"].column {
        width: 87.5% !important
      }

      .ui.column.grid>[class*="fifteen wide computer"].column,
      .ui.grid>.column.row>[class*="fifteen wide computer"].column,
      .ui.grid>.row>[class*="fifteen wide computer"].column,
      .ui.grid>[class*="fifteen wide computer"].column {
        width: 93.75% !important
      }

      .ui.column.grid>[class*="sixteen wide computer"].column,
      .ui.grid>.column.row>[class*="sixteen wide computer"].column,
      .ui.grid>.row>[class*="sixteen wide computer"].column,
      .ui.grid>[class*="sixteen wide computer"].column {
        width: 100% !important
      }
    }

    @media only screen and (min-width:1200px) and (max-width:1919px) {

      .ui.column.grid>[class*="one wide large screen"].column,
      .ui.grid>.column.row>[class*="one wide large screen"].column,
      .ui.grid>.row>[class*="one wide large screen"].column,
      .ui.grid>[class*="one wide large screen"].column {
        width: 6.25% !important
      }

      .ui.column.grid>[class*="two wide large screen"].column,
      .ui.grid>.column.row>[class*="two wide large screen"].column,
      .ui.grid>.row>[class*="two wide large screen"].column,
      .ui.grid>[class*="two wide large screen"].column {
        width: 12.5% !important
      }

      .ui.column.grid>[class*="three wide large screen"].column,
      .ui.grid>.column.row>[class*="three wide large screen"].column,
      .ui.grid>.row>[class*="three wide large screen"].column,
      .ui.grid>[class*="three wide large screen"].column {
        width: 18.75% !important
      }

      .ui.column.grid>[class*="four wide large screen"].column,
      .ui.grid>.column.row>[class*="four wide large screen"].column,
      .ui.grid>.row>[class*="four wide large screen"].column,
      .ui.grid>[class*="four wide large screen"].column {
        width: 25% !important
      }

      .ui.column.grid>[class*="five wide large screen"].column,
      .ui.grid>.column.row>[class*="five wide large screen"].column,
      .ui.grid>.row>[class*="five wide large screen"].column,
      .ui.grid>[class*="five wide large screen"].column {
        width: 31.25% !important
      }

      .ui.column.grid>[class*="six wide large screen"].column,
      .ui.grid>.column.row>[class*="six wide large screen"].column,
      .ui.grid>.row>[class*="six wide large screen"].column,
      .ui.grid>[class*="six wide large screen"].column {
        width: 37.5% !important
      }

      .ui.column.grid>[class*="seven wide large screen"].column,
      .ui.grid>.column.row>[class*="seven wide large screen"].column,
      .ui.grid>.row>[class*="seven wide large screen"].column,
      .ui.grid>[class*="seven wide large screen"].column {
        width: 43.75% !important
      }

      .ui.column.grid>[class*="eight wide large screen"].column,
      .ui.grid>.column.row>[class*="eight wide large screen"].column,
      .ui.grid>.row>[class*="eight wide large screen"].column,
      .ui.grid>[class*="eight wide large screen"].column {
        width: 50% !important
      }

      .ui.column.grid>[class*="nine wide large screen"].column,
      .ui.grid>.column.row>[class*="nine wide large screen"].column,
      .ui.grid>.row>[class*="nine wide large screen"].column,
      .ui.grid>[class*="nine wide large screen"].column {
        width: 56.25% !important
      }

      .ui.column.grid>[class*="ten wide large screen"].column,
      .ui.grid>.column.row>[class*="ten wide large screen"].column,
      .ui.grid>.row>[class*="ten wide large screen"].column,
      .ui.grid>[class*="ten wide large screen"].column {
        width: 62.5% !important
      }

      .ui.column.grid>[class*="eleven wide large screen"].column,
      .ui.grid>.column.row>[class*="eleven wide large screen"].column,
      .ui.grid>.row>[class*="eleven wide large screen"].column,
      .ui.grid>[class*="eleven wide large screen"].column {
        width: 68.75% !important
      }

      .ui.column.grid>[class*="twelve wide large screen"].column,
      .ui.grid>.column.row>[class*="twelve wide large screen"].column,
      .ui.grid>.row>[class*="twelve wide large screen"].column,
      .ui.grid>[class*="twelve wide large screen"].column {
        width: 75% !important
      }

      .ui.column.grid>[class*="thirteen wide large screen"].column,
      .ui.grid>.column.row>[class*="thirteen wide large screen"].column,
      .ui.grid>.row>[class*="thirteen wide large screen"].column,
      .ui.grid>[class*="thirteen wide large screen"].column {
        width: 81.25% !important
      }

      .ui.column.grid>[class*="fourteen wide large screen"].column,
      .ui.grid>.column.row>[class*="fourteen wide large screen"].column,
      .ui.grid>.row>[class*="fourteen wide large screen"].column,
      .ui.grid>[class*="fourteen wide large screen"].column {
        width: 87.5% !important
      }

      .ui.column.grid>[class*="fifteen wide large screen"].column,
      .ui.grid>.column.row>[class*="fifteen wide large screen"].column,
      .ui.grid>.row>[class*="fifteen wide large screen"].column,
      .ui.grid>[class*="fifteen wide large screen"].column {
        width: 93.75% !important
      }

      .ui.column.grid>[class*="sixteen wide large screen"].column,
      .ui.grid>.column.row>[class*="sixteen wide large screen"].column,
      .ui.grid>.row>[class*="sixteen wide large screen"].column,
      .ui.grid>[class*="sixteen wide large screen"].column {
        width: 100% !important
      }
    }

    @media only screen and (min-width:1920px) {

      .ui.column.grid>[class*="one wide widescreen"].column,
      .ui.grid>.column.row>[class*="one wide widescreen"].column,
      .ui.grid>.row>[class*="one wide widescreen"].column,
      .ui.grid>[class*="one wide widescreen"].column {
        width: 6.25% !important
      }

      .ui.column.grid>[class*="two wide widescreen"].column,
      .ui.grid>.column.row>[class*="two wide widescreen"].column,
      .ui.grid>.row>[class*="two wide widescreen"].column,
      .ui.grid>[class*="two wide widescreen"].column {
        width: 12.5% !important
      }

      .ui.column.grid>[class*="three wide widescreen"].column,
      .ui.grid>.column.row>[class*="three wide widescreen"].column,
      .ui.grid>.row>[class*="three wide widescreen"].column,
      .ui.grid>[class*="three wide widescreen"].column {
        width: 18.75% !important
      }

      .ui.column.grid>[class*="four wide widescreen"].column,
      .ui.grid>.column.row>[class*="four wide widescreen"].column,
      .ui.grid>.row>[class*="four wide widescreen"].column,
      .ui.grid>[class*="four wide widescreen"].column {
        width: 25% !important
      }

      .ui.column.grid>[class*="five wide widescreen"].column,
      .ui.grid>.column.row>[class*="five wide widescreen"].column,
      .ui.grid>.row>[class*="five wide widescreen"].column,
      .ui.grid>[class*="five wide widescreen"].column {
        width: 31.25% !important
      }

      .ui.column.grid>[class*="six wide widescreen"].column,
      .ui.grid>.column.row>[class*="six wide widescreen"].column,
      .ui.grid>.row>[class*="six wide widescreen"].column,
      .ui.grid>[class*="six wide widescreen"].column {
        width: 37.5% !important
      }

      .ui.column.grid>[class*="seven wide widescreen"].column,
      .ui.grid>.column.row>[class*="seven wide widescreen"].column,
      .ui.grid>.row>[class*="seven wide widescreen"].column,
      .ui.grid>[class*="seven wide widescreen"].column {
        width: 43.75% !important
      }

      .ui.column.grid>[class*="eight wide widescreen"].column,
      .ui.grid>.column.row>[class*="eight wide widescreen"].column,
      .ui.grid>.row>[class*="eight wide widescreen"].column,
      .ui.grid>[class*="eight wide widescreen"].column {
        width: 50% !important
      }

      .ui.column.grid>[class*="nine wide widescreen"].column,
      .ui.grid>.column.row>[class*="nine wide widescreen"].column,
      .ui.grid>.row>[class*="nine wide widescreen"].column,
      .ui.grid>[class*="nine wide widescreen"].column {
        width: 56.25% !important
      }

      .ui.column.grid>[class*="ten wide widescreen"].column,
      .ui.grid>.column.row>[class*="ten wide widescreen"].column,
      .ui.grid>.row>[class*="ten wide widescreen"].column,
      .ui.grid>[class*="ten wide widescreen"].column {
        width: 62.5% !important
      }

      .ui.column.grid>[class*="eleven wide widescreen"].column,
      .ui.grid>.column.row>[class*="eleven wide widescreen"].column,
      .ui.grid>.row>[class*="eleven wide widescreen"].column,
      .ui.grid>[class*="eleven wide widescreen"].column {
        width: 68.75% !important
      }

      .ui.column.grid>[class*="twelve wide widescreen"].column,
      .ui.grid>.column.row>[class*="twelve wide widescreen"].column,
      .ui.grid>.row>[class*="twelve wide widescreen"].column,
      .ui.grid>[class*="twelve wide widescreen"].column {
        width: 75% !important
      }

      .ui.column.grid>[class*="thirteen wide widescreen"].column,
      .ui.grid>.column.row>[class*="thirteen wide widescreen"].column,
      .ui.grid>.row>[class*="thirteen wide widescreen"].column,
      .ui.grid>[class*="thirteen wide widescreen"].column {
        width: 81.25% !important
      }

      .ui.column.grid>[class*="fourteen wide widescreen"].column,
      .ui.grid>.column.row>[class*="fourteen wide widescreen"].column,
      .ui.grid>.row>[class*="fourteen wide widescreen"].column,
      .ui.grid>[class*="fourteen wide widescreen"].column {
        width: 87.5% !important
      }

      .ui.column.grid>[class*="fifteen wide widescreen"].column,
      .ui.grid>.column.row>[class*="fifteen wide widescreen"].column,
      .ui.grid>.row>[class*="fifteen wide widescreen"].column,
      .ui.grid>[class*="fifteen wide widescreen"].column {
        width: 93.75% !important
      }

      .ui.column.grid>[class*="sixteen wide widescreen"].column,
      .ui.grid>.column.row>[class*="sixteen wide widescreen"].column,
      .ui.grid>.row>[class*="sixteen wide widescreen"].column,
      .ui.grid>[class*="sixteen wide widescreen"].column {
        width: 100% !important
      }
    }

    .ui.centered.grid,
    .ui.centered.grid>.row,
    .ui.grid>.centered.row {
      text-align: center;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center
    }

    .ui.centered.grid>.column:not(.aligned):not(.justified):not(.row),
    .ui.centered.grid>.row>.column:not(.aligned):not(.justified),
    .ui.grid .centered.row>.column:not(.aligned):not(.justified) {
      text-align: left
    }

    .ui.grid>.centered.column,
    .ui.grid>.row>.centered.column {
      display: block;
      margin-left: auto;
      margin-right: auto
    }

    .ui.grid>.relaxed.row>.column,
    .ui.relaxed.grid>.column:not(.row),
    .ui.relaxed.grid>.row>.column {
      padding-left: 1.5rem;
      padding-right: 1.5rem
    }

    .ui.grid>[class*="very relaxed"].row>.column,
    .ui[class*="very relaxed"].grid>.column:not(.row),
    .ui[class*="very relaxed"].grid>.row>.column {
      padding-left: 2.5rem;
      padding-right: 2.5rem
    }

    .ui.grid .relaxed.row+.ui.divider,
    .ui.relaxed.grid .row+.ui.divider {
      margin-left: 1.5rem;
      margin-right: 1.5rem
    }

    .ui.grid [class*="very relaxed"].row+.ui.divider,
    .ui[class*="very relaxed"].grid .row+.ui.divider {
      margin-left: 2.5rem;
      margin-right: 2.5rem
    }

    .ui.padded.grid:not(.vertically):not(.horizontally) {
      margin: 0 !important
    }

    [class*="horizontally padded"].ui.grid {
      margin-left: 0 !important;
      margin-right: 0 !important
    }

    [class*="vertically padded"].ui.grid {
      margin-top: 0 !important;
      margin-bottom: 0 !important
    }

    .ui.grid [class*="left floated"].column {
      margin-right: auto
    }

    .ui.grid [class*="right floated"].column {
      margin-left: auto
    }

    .ui.divided.grid:not([class*="vertically divided"])>.column:not(.row),
    .ui.divided.grid:not([class*="vertically divided"])>.row>.column {
      box-shadow: -1px 0 0 0 rgba(34, 36, 38, .15)
    }

    .ui[class*="vertically divided"].grid>.column:not(.row),
    .ui[class*="vertically divided"].grid>.row>.column {
      margin-top: 1rem;
      margin-bottom: 1rem;
      padding-top: 0;
      padding-bottom: 0
    }

    .ui[class*="vertically divided"].grid>.row {
      margin-top: 0;
      margin-bottom: 0
    }

    .ui.divided.grid:not([class*="vertically divided"])>.column:first-child,
    .ui.divided.grid:not([class*="vertically divided"])>.row>.column:first-child {
      box-shadow: none
    }

    .ui[class*="vertically divided"].grid>.row:first-child>.column {
      margin-top: 0
    }

    .ui.grid>.divided.row>.column {
      box-shadow: -1px 0 0 0 rgba(34, 36, 38, .15)
    }

    .ui.grid>.divided.row>.column:first-child {
      box-shadow: none
    }

    .ui[class*="vertically divided"].grid>.row {
      position: relative
    }

    .ui[class*="vertically divided"].grid>.row:before {
      position: absolute;
      content: "";
      top: 0;
      left: 0;
      width: calc(100% - 2rem);
      height: 1px;
      margin: 0 1rem;
      box-shadow: 0 -1px 0 0 rgba(34, 36, 38, .15)
    }

    .ui.padded.divided.grid:not(.vertically):not(.horizontally),
    [class*="horizontally padded"].ui.divided.grid {
      width: 100%
    }

    .ui[class*="vertically divided"].grid>.row:first-child:before {
      box-shadow: none
    }

    .ui.inverted.divided.grid:not([class*="vertically divided"])>.column:not(.row),
    .ui.inverted.divided.grid:not([class*="vertically divided"])>.row>.column {
      box-shadow: -1px 0 0 0 hsla(0, 0%, 100%, .1)
    }

    .ui.inverted.divided.grid:not([class*="vertically divided"])>.column:not(.row):first-child,
    .ui.inverted.divided.grid:not([class*="vertically divided"])>.row>.column:first-child {
      box-shadow: none
    }

    .ui.inverted[class*="vertically divided"].grid>.row:before {
      box-shadow: 0 -1px 0 0 hsla(0, 0%, 100%, .1)
    }

    .ui.relaxed[class*="vertically divided"].grid>.row:before {
      margin-left: 1.5rem;
      margin-right: 1.5rem;
      width: calc(100% - 3rem)
    }

    .ui[class*="very relaxed"][class*="vertically divided"].grid>.row:before {
      margin-left: 5rem;
      margin-right: 5rem;
      width: calc(100% - 5rem)
    }

    .ui.celled.grid {
      width: 100%;
      margin: 1em 0;
      box-shadow: 0 0 0 1px #d4d4d5
    }

    .ui.celled.grid>.row {
      width: 100% !important;
      margin: 0;
      padding: 0;
      box-shadow: 0 -1px 0 0 #d4d4d5
    }

    .ui.celled.grid>.column:not(.row),
    .ui.celled.grid>.row>.column {
      box-shadow: -1px 0 0 0 #d4d4d5
    }

    .ui.celled.grid>.column:first-child,
    .ui.celled.grid>.row>.column:first-child {
      box-shadow: none
    }

    .ui.celled.grid>.column:not(.row),
    .ui.celled.grid>.row>.column {
      padding: 1em
    }

    .ui.relaxed.celled.grid>.column:not(.row),
    .ui.relaxed.celled.grid>.row>.column {
      padding: 1.5em
    }

    .ui[class*="very relaxed"].celled.grid>.column:not(.row),
    .ui[class*="very relaxed"].celled.grid>.row>.column {
      padding: 2em
    }

    .ui[class*="internally celled"].grid {
      box-shadow: none;
      margin: 0
    }

    .ui[class*="internally celled"].grid>.row:first-child,
    .ui[class*="internally celled"].grid>.row>.column:first-child {
      box-shadow: none
    }

    .ui.grid>.row>[class*="top aligned"].column,
    .ui.grid>[class*="top aligned"].column:not(.row),
    .ui.grid>[class*="top aligned"].row>.column,
    .ui[class*="top aligned"].grid>.column:not(.row),
    .ui[class*="top aligned"].grid>.row>.column {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      vertical-align: top;
      -ms-flex-item-align: start !important;
      align-self: flex-start !important
    }

    .ui.grid>.row>[class*="middle aligned"].column,
    .ui.grid>[class*="middle aligned"].column:not(.row),
    .ui.grid>[class*="middle aligned"].row>.column,
    .ui[class*="middle aligned"].grid>.column:not(.row),
    .ui[class*="middle aligned"].grid>.row>.column {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      vertical-align: middle;
      -ms-flex-item-align: center !important;
      -ms-grid-row-align: center !important;
      align-self: center !important
    }

    .ui.grid>.row>[class*="bottom aligned"].column,
    .ui.grid>[class*="bottom aligned"].column:not(.row),
    .ui.grid>[class*="bottom aligned"].row>.column,
    .ui[class*="bottom aligned"].grid>.column:not(.row),
    .ui[class*="bottom aligned"].grid>.row>.column {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      vertical-align: bottom;
      -ms-flex-item-align: end !important;
      align-self: flex-end !important
    }

    .ui.grid>.row>.stretched.column,
    .ui.grid>.stretched.column:not(.row),
    .ui.grid>.stretched.row>.column,
    .ui.stretched.grid>.column,
    .ui.stretched.grid>.row>.column {
      display: -webkit-inline-box !important;
      display: -ms-inline-flexbox !important;
      display: inline-flex !important;
      -ms-flex-item-align: stretch;
      align-self: stretch;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column
    }

    .ui.grid>.row>.stretched.column>*,
    .ui.grid>.stretched.column:not(.row)>*,
    .ui.grid>.stretched.row>.column>*,
    .ui.stretched.grid>.column>*,
    .ui.stretched.grid>.row>.column>* {
      -webkit-box-flex: 1;
      -ms-flex-positive: 1;
      flex-grow: 1
    }

    .ui.grid>.row>[class*="left aligned"].column.column,
    .ui.grid>[class*="left aligned"].column.column,
    .ui.grid>[class*="left aligned"].row>.column,
    .ui[class*="left aligned"].grid>.column,
    .ui[class*="left aligned"].grid>.row>.column {
      text-align: left;
      -ms-flex-item-align: inherit;
      -ms-grid-row-align: inherit;
      align-self: inherit
    }

    .ui.grid>.row>[class*="center aligned"].column.column,
    .ui.grid>[class*="center aligned"].column.column,
    .ui.grid>[class*="center aligned"].row>.column,
    .ui[class*="center aligned"].grid>.column,
    .ui[class*="center aligned"].grid>.row>.column {
      text-align: center;
      -ms-flex-item-align: inherit;
      -ms-grid-row-align: inherit;
      align-self: inherit
    }

    .ui[class*="center aligned"].grid {
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center
    }

    .ui.grid>.row>[class*="right aligned"].column.column,
    .ui.grid>[class*="right aligned"].column.column,
    .ui.grid>[class*="right aligned"].row>.column,
    .ui[class*="right aligned"].grid>.column,
    .ui[class*="right aligned"].grid>.row>.column {
      text-align: right;
      -ms-flex-item-align: inherit;
      -ms-grid-row-align: inherit;
      align-self: inherit
    }

    .ui.grid>.justified.column.column,
    .ui.grid>.justified.row>.column,
    .ui.grid>.row>.justified.column.column,
    .ui.justified.grid>.column,
    .ui.justified.grid>.row>.column {
      text-align: justify;
      -webkit-hyphens: auto;
      -ms-hyphens: auto;
      hyphens: auto
    }

    .ui.grid>.row>.black.column,
    .ui.grid>.row>.blue.column,
    .ui.grid>.row>.brown.column,
    .ui.grid>.row>.green.column,
    .ui.grid>.row>.grey.column,
    .ui.grid>.row>.olive.column,
    .ui.grid>.row>.orange.column,
    .ui.grid>.row>.pink.column,
    .ui.grid>.row>.purple.column,
    .ui.grid>.row>.red.column,
    .ui.grid>.row>.teal.column,
    .ui.grid>.row>.violet.column,
    .ui.grid>.row>.yellow.column {
      margin-top: -1rem;
      margin-bottom: -1rem;
      padding-top: 1rem;
      padding-bottom: 1rem
    }

    .ui.grid>.red.column,
    .ui.grid>.red.row,
    .ui.grid>.row>.red.column {
      background-color: #db2828 !important;
      color: #fff
    }

    .ui.grid>.orange.column,
    .ui.grid>.orange.row,
    .ui.grid>.row>.orange.column {
      background-color: #f2711c !important;
      color: #fff
    }

    .ui.grid>.row>.yellow.column,
    .ui.grid>.yellow.column,
    .ui.grid>.yellow.row {
      background-color: #fbbd08 !important;
      color: #fff
    }

    .ui.grid>.olive.column,
    .ui.grid>.olive.row,
    .ui.grid>.row>.olive.column {
      background-color: #b5cc18 !important;
      color: #fff
    }

    .ui.grid>.green.column,
    .ui.grid>.green.row,
    .ui.grid>.row>.green.column {
      background-color: #21ba45 !important;
      color: #fff
    }

    .ui.grid>.row>.teal.column,
    .ui.grid>.teal.column,
    .ui.grid>.teal.row {
      background-color: #00b5ad !important;
      color: #fff
    }

    .ui.grid>.blue.column,
    .ui.grid>.blue.row,
    .ui.grid>.row>.blue.column {
      background-color: #2185d0 !important;
      color: #fff
    }

    .ui.grid>.row>.violet.column,
    .ui.grid>.violet.column,
    .ui.grid>.violet.row {
      background-color: #6435c9 !important;
      color: #fff
    }

    .ui.grid>.purple.column,
    .ui.grid>.purple.row,
    .ui.grid>.row>.purple.column {
      background-color: #a333c8 !important;
      color: #fff
    }

    .ui.grid>.pink.column,
    .ui.grid>.pink.row,
    .ui.grid>.row>.pink.column {
      background-color: #e03997 !important;
      color: #fff
    }

    .ui.grid>.brown.column,
    .ui.grid>.brown.row,
    .ui.grid>.row>.brown.column {
      background-color: #a5673f !important;
      color: #fff
    }

    .ui.grid>.grey.column,
    .ui.grid>.grey.row,
    .ui.grid>.row>.grey.column {
      background-color: #767676 !important;
      color: #fff
    }

    .ui.grid>.black.column,
    .ui.grid>.black.row,
    .ui.grid>.row>.black.column {
      background-color: #1b1c1d !important;
      color: #fff
    }

    .ui.grid>[class*="equal width"].row>.column,
    .ui[class*="equal width"].grid>.column:not(.row),
    .ui[class*="equal width"].grid>.row>.column {
      display: inline-block;
      -webkit-box-flex: 1;
      -ms-flex-positive: 1;
      flex-grow: 1
    }

    .ui.grid>[class*="equal width"].row>.wide.column,
    .ui[class*="equal width"].grid>.row>.wide.column,
    .ui[class*="equal width"].grid>.wide.column {
      -webkit-box-flex: 0;
      -ms-flex-positive: 0;
      flex-grow: 0
    }

    @media only screen and (max-width:767px) {

      .ui.grid>[class*="mobile reversed"].row,
      .ui[class*="mobile reversed"].grid,
      .ui[class*="mobile reversed"].grid>.row {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse
      }

      .ui.stackable[class*="mobile reversed"],
      .ui[class*="mobile vertically reversed"].grid {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse
      }

      .ui[class*="mobile reversed"].divided.grid:not([class*="vertically divided"])>.column:first-child,
      .ui[class*="mobile reversed"].divided.grid:not([class*="vertically divided"])>.row>.column:first-child {
        box-shadow: -1px 0 0 0 rgba(34, 36, 38, .15)
      }

      .ui[class*="mobile reversed"].divided.grid:not([class*="vertically divided"])>.column:last-child,
      .ui[class*="mobile reversed"].divided.grid:not([class*="vertically divided"])>.row>.column:last-child {
        box-shadow: none
      }

      .ui.grid[class*="vertically divided"][class*="mobile vertically reversed"]>.row:first-child:before {
        box-shadow: 0 -1px 0 0 rgba(34, 36, 38, .15)
      }

      .ui.grid[class*="vertically divided"][class*="mobile vertically reversed"]>.row:last-child:before {
        box-shadow: none
      }

      .ui[class*="mobile reversed"].celled.grid>.row>.column:first-child {
        box-shadow: -1px 0 0 0 #d4d4d5
      }

      .ui[class*="mobile reversed"].celled.grid>.row>.column:last-child {
        box-shadow: none
      }
    }

    @media only screen and (min-width:768px) and (max-width:991px) {

      .ui.grid>[class*="tablet reversed"].row,
      .ui[class*="tablet reversed"].grid,
      .ui[class*="tablet reversed"].grid>.row {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse
      }

      .ui[class*="tablet vertically reversed"].grid {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse
      }

      .ui[class*="tablet reversed"].divided.grid:not([class*="vertically divided"])>.column:first-child,
      .ui[class*="tablet reversed"].divided.grid:not([class*="vertically divided"])>.row>.column:first-child {
        box-shadow: -1px 0 0 0 rgba(34, 36, 38, .15)
      }

      .ui[class*="tablet reversed"].divided.grid:not([class*="vertically divided"])>.column:last-child,
      .ui[class*="tablet reversed"].divided.grid:not([class*="vertically divided"])>.row>.column:last-child {
        box-shadow: none
      }

      .ui.grid[class*="vertically divided"][class*="tablet vertically reversed"]>.row:first-child:before {
        box-shadow: 0 -1px 0 0 rgba(34, 36, 38, .15)
      }

      .ui.grid[class*="vertically divided"][class*="tablet vertically reversed"]>.row:last-child:before {
        box-shadow: none
      }

      .ui[class*="tablet reversed"].celled.grid>.row>.column:first-child {
        box-shadow: -1px 0 0 0 #d4d4d5
      }

      .ui[class*="tablet reversed"].celled.grid>.row>.column:last-child {
        box-shadow: none
      }
    }

    @media only screen and (min-width:992px) {

      .ui.grid>[class*="computer reversed"].row,
      .ui[class*="computer reversed"].grid,
      .ui[class*="computer reversed"].grid>.row {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse
      }

      .ui[class*="computer vertically reversed"].grid {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse
      }

      .ui[class*="computer reversed"].divided.grid:not([class*="vertically divided"])>.column:first-child,
      .ui[class*="computer reversed"].divided.grid:not([class*="vertically divided"])>.row>.column:first-child {
        box-shadow: -1px 0 0 0 rgba(34, 36, 38, .15)
      }

      .ui[class*="computer reversed"].divided.grid:not([class*="vertically divided"])>.column:last-child,
      .ui[class*="computer reversed"].divided.grid:not([class*="vertically divided"])>.row>.column:last-child {
        box-shadow: none
      }

      .ui.grid[class*="vertically divided"][class*="computer vertically reversed"]>.row:first-child:before {
        box-shadow: 0 -1px 0 0 rgba(34, 36, 38, .15)
      }

      .ui.grid[class*="vertically divided"][class*="computer vertically reversed"]>.row:last-child:before {
        box-shadow: none
      }

      .ui[class*="computer reversed"].celled.grid>.row>.column:first-child {
        box-shadow: -1px 0 0 0 #d4d4d5
      }

      .ui[class*="computer reversed"].celled.grid>.row>.column:last-child {
        box-shadow: none
      }
    }

    @media only screen and (min-width:768px) and (max-width:991px) {
      .ui.doubling.grid {
        width: auto
      }

      .ui.doubling.grid>.row,
      .ui.grid>.doubling.row {
        margin: 0 !important;
        padding: 0 !important
      }

      .ui.doubling.grid>.row>.column,
      .ui.grid>.doubling.row>.column {
        display: inline-block !important;
        padding-top: 1rem !important;
        padding-bottom: 1rem !important;
        box-shadow: none !important;
        margin: 0
      }

      .ui.grid>[class*="two column"].doubling.row.row>.column,
      .ui[class*="two column"].doubling.grid>.column:not(.row),
      .ui[class*="two column"].doubling.grid>.row>.column {
        width: 100% !important
      }

      .ui.grid>[class*="four column"].doubling.row.row>.column,
      .ui.grid>[class*="three column"].doubling.row.row>.column,
      .ui[class*="four column"].doubling.grid>.column:not(.row),
      .ui[class*="four column"].doubling.grid>.row>.column,
      .ui[class*="three column"].doubling.grid>.column:not(.row),
      .ui[class*="three column"].doubling.grid>.row>.column {
        width: 50% !important
      }

      .ui.grid>[class*="five column"].doubling.row.row>.column,
      .ui.grid>[class*="seven column"].doubling.row.row>.column,
      .ui.grid>[class*="six column"].doubling.row.row>.column,
      .ui[class*="five column"].doubling.grid>.column:not(.row),
      .ui[class*="five column"].doubling.grid>.row>.column,
      .ui[class*="seven column"].doubling.grid>.column:not(.row),
      .ui[class*="seven column"].doubling.grid>.row>.column,
      .ui[class*="six column"].doubling.grid>.column:not(.row),
      .ui[class*="six column"].doubling.grid>.row>.column {
        width: 33.33333333% !important
      }

      .ui.grid>[class*="eight column"].doubling.row.row>.column,
      .ui.grid>[class*="nine column"].doubling.row.row>.column,
      .ui[class*="eight column"].doubling.grid>.column:not(.row),
      .ui[class*="eight column"].doubling.grid>.row>.column,
      .ui[class*="nine column"].doubling.grid>.column:not(.row),
      .ui[class*="nine column"].doubling.grid>.row>.column {
        width: 25% !important
      }

      .ui.grid>[class*="eleven column"].doubling.row.row>.column,
      .ui.grid>[class*="ten column"].doubling.row.row>.column,
      .ui[class*="eleven column"].doubling.grid>.column:not(.row),
      .ui[class*="eleven column"].doubling.grid>.row>.column,
      .ui[class*="ten column"].doubling.grid>.column:not(.row),
      .ui[class*="ten column"].doubling.grid>.row>.column {
        width: 20% !important
      }

      .ui.grid>[class*="thirteen column"].doubling.row.row>.column,
      .ui.grid>[class*="twelve column"].doubling.row.row>.column,
      .ui[class*="thirteen column"].doubling.grid>.column:not(.row),
      .ui[class*="thirteen column"].doubling.grid>.row>.column,
      .ui[class*="twelve column"].doubling.grid>.column:not(.row),
      .ui[class*="twelve column"].doubling.grid>.row>.column {
        width: 16.66666667% !important
      }

      .ui.grid>[class*="fifteen column"].doubling.row.row>.column,
      .ui.grid>[class*="fourteen column"].doubling.row.row>.column,
      .ui[class*="fifteen column"].doubling.grid>.column:not(.row),
      .ui[class*="fifteen column"].doubling.grid>.row>.column,
      .ui[class*="fourteen column"].doubling.grid>.column:not(.row),
      .ui[class*="fourteen column"].doubling.grid>.row>.column {
        width: 14.28571429% !important
      }

      .ui.grid>[class*="sixteen column"].doubling.row.row>.column,
      .ui[class*="sixteen column"].doubling.grid>.column:not(.row),
      .ui[class*="sixteen column"].doubling.grid>.row>.column {
        width: 12.5% !important
      }
    }

    @media only screen and (max-width:767px) {

      .ui.doubling.grid>.row,
      .ui.grid>.doubling.row {
        margin: 0 !important;
        padding: 0 !important
      }

      .ui.doubling.grid>.row>.column,
      .ui.grid>.doubling.row>.column {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important;
        margin: 0 !important;
        box-shadow: none !important
      }

      .ui.grid>[class*="two column"].doubling:not(.stackable).row.row>.column,
      .ui[class*="two column"].doubling:not(.stackable).grid>.column:not(.row),
      .ui[class*="two column"].doubling:not(.stackable).grid>.row>.column {
        width: 100% !important
      }

      .ui.grid>[class*="eight column"].doubling:not(.stackable).row.row>.column,
      .ui.grid>[class*="five column"].doubling:not(.stackable).row.row>.column,
      .ui.grid>[class*="four column"].doubling:not(.stackable).row.row>.column,
      .ui.grid>[class*="seven column"].doubling:not(.stackable).row.row>.column,
      .ui.grid>[class*="six column"].doubling:not(.stackable).row.row>.column,
      .ui.grid>[class*="three column"].doubling:not(.stackable).row.row>.column,
      .ui[class*="eight column"].doubling:not(.stackable).grid>.column:not(.row),
      .ui[class*="eight column"].doubling:not(.stackable).grid>.row>.column,
      .ui[class*="five column"].doubling:not(.stackable).grid>.column:not(.row),
      .ui[class*="five column"].doubling:not(.stackable).grid>.row>.column,
      .ui[class*="four column"].doubling:not(.stackable).grid>.column:not(.row),
      .ui[class*="four column"].doubling:not(.stackable).grid>.row>.column,
      .ui[class*="seven column"].doubling:not(.stackable).grid>.column:not(.row),
      .ui[class*="seven column"].doubling:not(.stackable).grid>.row>.column,
      .ui[class*="six column"].doubling:not(.stackable).grid>.column:not(.row),
      .ui[class*="six column"].doubling:not(.stackable).grid>.row>.column,
      .ui[class*="three column"].doubling:not(.stackable).grid>.column:not(.row),
      .ui[class*="three column"].doubling:not(.stackable).grid>.row>.column {
        width: 50% !important
      }

      .ui.grid>[class*="eleven column"].doubling:not(.stackable).row.row>.column,
      .ui.grid>[class*="nine column"].doubling:not(.stackable).row.row>.column,
      .ui.grid>[class*="ten column"].doubling:not(.stackable).row.row>.column,
      .ui.grid>[class*="thirteen column"].doubling:not(.stackable).row.row>.column,
      .ui.grid>[class*="twelve column"].doubling:not(.stackable).row.row>.column,
      .ui[class*="eleven column"].doubling:not(.stackable).grid>.column:not(.row),
      .ui[class*="eleven column"].doubling:not(.stackable).grid>.row>.column,
      .ui[class*="nine column"].doubling:not(.stackable).grid>.column:not(.row),
      .ui[class*="nine column"].doubling:not(.stackable).grid>.row>.column,
      .ui[class*="ten column"].doubling:not(.stackable).grid>.column:not(.row),
      .ui[class*="ten column"].doubling:not(.stackable).grid>.row>.column,
      .ui[class*="thirteen column"].doubling:not(.stackable).grid>.column:not(.row),
      .ui[class*="thirteen column"].doubling:not(.stackable).grid>.row>.column,
      .ui[class*="twelve column"].doubling:not(.stackable).grid>.column:not(.row),
      .ui[class*="twelve column"].doubling:not(.stackable).grid>.row>.column {
        width: 33.33333333% !important
      }

      .ui.grid>[class*="fifteen column"].doubling:not(.stackable).row.row>.column,
      .ui.grid>[class*="fourteen column"].doubling:not(.stackable).row.row>.column,
      .ui.grid>[class*="sixteen column"].doubling:not(.stackable).row.row>.column,
      .ui[class*="fifteen column"].doubling:not(.stackable).grid>.column:not(.row),
      .ui[class*="fifteen column"].doubling:not(.stackable).grid>.row>.column,
      .ui[class*="fourteen column"].doubling:not(.stackable).grid>.column:not(.row),
      .ui[class*="fourteen column"].doubling:not(.stackable).grid>.row>.column,
      .ui[class*="sixteen column"].doubling:not(.stackable).grid>.column:not(.row),
      .ui[class*="sixteen column"].doubling:not(.stackable).grid>.row>.column {
        width: 25% !important
      }
    }

    @media only screen and (max-width:767px) {


      .ui.grid>.stackable.stackable.row>.column,
      .ui.stackable.grid>.column.grid>.column,
      .ui.stackable.grid>.column.row>.column,
      .ui.stackable.grid>.column:not(.row),
      .ui.stackable.grid>.row>.column,
      .ui.stackable.grid>.row>.wide.column,
      .ui.stackable.grid>.wide.column {
        width: 100% !important;
        margin: 0 !important;
        box-shadow: none !important;
        padding: 1rem !important
      }

      .ui.stackable.grid:not(.vertically)>.row {
        margin: 0;
        padding: 0
      }

      .ui.container>.ui.stackable.grid>.column,
      .ui.container>.ui.stackable.grid>.row>.column {
        padding-left: 0 !important;
        padding-right: 0 !important
      }

      .ui.grid .ui.stackable.grid,
      .ui.segment:not(.vertical) .ui.stackable.page.grid {
        margin-left: -1rem !important;
        margin-right: -1rem !important
      }

      .ui.stackable.celled.grid>.column:not(.row):first-child,
      .ui.stackable.celled.grid>.row:first-child>.column:first-child,
      .ui.stackable.divided.grid>.column:not(.row):first-child,
      .ui.stackable.divided.grid>.row:first-child>.column:first-child {
        border-top: none !important
      }

      .ui.inverted.stackable.celled.grid>.column:not(.row),
      .ui.inverted.stackable.celled.grid>.row>.column,
      .ui.inverted.stackable.divided.grid>.column:not(.row),
      .ui.inverted.stackable.divided.grid>.row>.column {
        border-top: 1px solid hsla(0, 0%, 100%, .1)
      }

      .ui.stackable.celled.grid>.column:not(.row),
      .ui.stackable.celled.grid>.row>.column,
      .ui.stackable.divided:not(.vertically).grid>.column:not(.row),
      .ui.stackable.divided:not(.vertically).grid>.row>.column {
        border-top: 1px solid rgba(34, 36, 38, .15);
        box-shadow: none !important;
        padding-top: 2rem !important;
        padding-bottom: 2rem !important
      }

      .ui.stackable.celled.grid>.row {
        box-shadow: none !important
      }

      .ui.stackable.divided:not(.vertically).grid>.column:not(.row),
      .ui.stackable.divided:not(.vertically).grid>.row>.column {
        padding-left: 0 !important;
        padding-right: 0 !important
      }
    }

    @media only screen and (max-width:767px) {

      .ui.grid.grid.grid>.row>[class*="computer only"].column:not(.mobile),
      .ui.grid.grid.grid>.row>[class*="large screen only"].column:not(.mobile),
      .ui.grid.grid.grid>.row>[class*="tablet only"].column:not(.mobile),
      .ui.grid.grid.grid>.row>[class*="widescreen only"].column:not(.mobile),
      .ui.grid.grid.grid>[class*="computer only"].column:not(.mobile),
      .ui.grid.grid.grid>[class*="computer only"].row:not(.mobile),
      .ui.grid.grid.grid>[class*="large screen only"].column:not(.mobile),
      .ui.grid.grid.grid>[class*="large screen only"].row:not(.mobile),
      .ui.grid.grid.grid>[class*="tablet only"].column:not(.mobile),
      .ui.grid.grid.grid>[class*="tablet only"].row:not(.mobile),
      .ui.grid.grid.grid>[class*="widescreen only"].column:not(.mobile),
      .ui.grid.grid.grid>[class*="widescreen only"].row:not(.mobile),
      .ui[class*="computer only"].grid.grid.grid:not(.mobile),
      .ui[class*="large screen only"].grid.grid.grid:not(.mobile),
      .ui[class*="tablet only"].grid.grid.grid:not(.mobile),
      .ui[class*="widescreen only"].grid.grid.grid:not(.mobile) {
        display: none !important
      }
    }

    @media only screen and (min-width:768px) and (max-width:991px) {

      .ui.grid.grid.grid>.row>[class*="computer only"].column:not(.tablet),
      .ui.grid.grid.grid>.row>[class*="large screen only"].column:not(.mobile),
      .ui.grid.grid.grid>.row>[class*="mobile only"].column:not(.tablet),
      .ui.grid.grid.grid>.row>[class*="widescreen only"].column:not(.mobile),
      .ui.grid.grid.grid>[class*="computer only"].column:not(.tablet),
      .ui.grid.grid.grid>[class*="computer only"].row:not(.tablet),
      .ui.grid.grid.grid>[class*="large screen only"].column:not(.mobile),
      .ui.grid.grid.grid>[class*="large screen only"].row:not(.mobile),
      .ui.grid.grid.grid>[class*="mobile only"].column:not(.tablet),
      .ui.grid.grid.grid>[class*="mobile only"].row:not(.tablet),
      .ui.grid.grid.grid>[class*="widescreen only"].column:not(.mobile),
      .ui.grid.grid.grid>[class*="widescreen only"].row:not(.mobile),
      .ui[class*="computer only"].grid.grid.grid:not(.tablet),
      .ui[class*="large screen only"].grid.grid.grid:not(.mobile),
      .ui[class*="mobile only"].grid.grid.grid:not(.tablet),
      .ui[class*="widescreen only"].grid.grid.grid:not(.mobile) {
        display: none !important
      }
    }

    @media only screen and (min-width:992px) and (max-width:1199px) {

      .ui.grid.grid.grid>.row>[class*="large screen only"].column:not(.mobile),
      .ui.grid.grid.grid>.row>[class*="mobile only"].column:not(.computer),
      .ui.grid.grid.grid>.row>[class*="tablet only"].column:not(.computer),
      .ui.grid.grid.grid>.row>[class*="widescreen only"].column:not(.mobile),
      .ui.grid.grid.grid>[class*="large screen only"].column:not(.mobile),
      .ui.grid.grid.grid>[class*="large screen only"].row:not(.mobile),
      .ui.grid.grid.grid>[class*="mobile only"].column:not(.computer),
      .ui.grid.grid.grid>[class*="mobile only"].row:not(.computer),
      .ui.grid.grid.grid>[class*="tablet only"].column:not(.computer),
      .ui.grid.grid.grid>[class*="tablet only"].row:not(.computer),
      .ui.grid.grid.grid>[class*="widescreen only"].column:not(.mobile),
      .ui.grid.grid.grid>[class*="widescreen only"].row:not(.mobile),
      .ui[class*="large screen only"].grid.grid.grid:not(.mobile),
      .ui[class*="mobile only"].grid.grid.grid:not(.computer),
      .ui[class*="tablet only"].grid.grid.grid:not(.computer),
      .ui[class*="widescreen only"].grid.grid.grid:not(.mobile) {
        display: none !important
      }
    }

    @media only screen and (min-width:1200px) and (max-width:1919px) {

      .ui.grid.grid.grid>.row>[class*="mobile only"].column:not(.computer),
      .ui.grid.grid.grid>.row>[class*="tablet only"].column:not(.computer),
      .ui.grid.grid.grid>.row>[class*="widescreen only"].column:not(.mobile),
      .ui.grid.grid.grid>[class*="mobile only"].column:not(.computer),
      .ui.grid.grid.grid>[class*="mobile only"].row:not(.computer),
      .ui.grid.grid.grid>[class*="tablet only"].column:not(.computer),
      .ui.grid.grid.grid>[class*="tablet only"].row:not(.computer),
      .ui.grid.grid.grid>[class*="widescreen only"].column:not(.mobile),
      .ui.grid.grid.grid>[class*="widescreen only"].row:not(.mobile),
      .ui[class*="mobile only"].grid.grid.grid:not(.computer),
      .ui[class*="tablet only"].grid.grid.grid:not(.computer),
      .ui[class*="widescreen only"].grid.grid.grid:not(.mobile) {
        display: none !important
      }
    }

    @media only screen and (min-width:1920px) {

      .ui.grid.grid.grid>.row>[class*="mobile only"].column:not(.computer),
      .ui.grid.grid.grid>.row>[class*="tablet only"].column:not(.computer),
      .ui.grid.grid.grid>[class*="mobile only"].column:not(.computer),
      .ui.grid.grid.grid>[class*="mobile only"].row:not(.computer),
      .ui.grid.grid.grid>[class*="tablet only"].column:not(.computer),
      .ui.grid.grid.grid>[class*="tablet only"].row:not(.computer),
      .ui[class*="mobile only"].grid.grid.grid:not(.computer),
      .ui[class*="tablet only"].grid.grid.grid:not(.computer) {
        display: none !important
      }
    }

    @font-face {
      font-family: CenturyGothicBold;
      src: url("cg.ttf")
    }

    body,
    html {
      width: 100%;
      height: 100%
    }

    .shadow {
      text-shadow: 0 0 15px rgba(0, 0, 0, .9)
    }

    .content {
      height: 100%;
      min-height: 750px;
      position: relative
    }

    .content a {
      cursor: pointer
    }

.content2 {
    height: 100%;
    min-height: 750px;
    position: relative;
    background-color: #000000c7;
  }


    .main {
      position: absolute
    }

    .main .title {
      margin: 0;
      font-size: 100px;
      font-weight: 700;
      font-family: CenturyGothicBold;
      color: #3a3a3a;
    }

    .main .description {
font-size: 18px;
    line-height: 2em;
    margin-left: 13px;
    color: #3a3a3a;
    }

    .main .download {
    display: block;
    border: 2px solid #000;
    background-color: rgb(0, 202, 251);
    border-radius: 50px;
    width: 216px;
    height: 54px;
    text-align: center;
    line-height: 54px;
    color: #000;
    text-decoration: none;
    font-size: 16px;
    transition: transform .25s ease-out;
    margin-left: 10px;
    }

    .main .download:hover {
      transform: scale(1.05)
    }

    .main .changelog {
 font-size: 14px;
    color: #3a3a3a;
    padding-left: 10px;
    }

    .main .changelog h3 {
      margin: 0;
      font-weight: 600
    }

    .main .changelog ol {
      padding-left: 1em;
      line-height: 2em
    }

    .footer {
      font-size: 14px;
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      margin-bottom: 0 !important
    }

    .footer p {
      margin: 0;
      padding-bottom: 7px
    }



    .footer a {
      color: #000;
      text-decoration: none;
      transition: opacity .15s ease-in
    }

    .footer a:hover {
      opacity: .5
    }

    .footer .desc {
      text-align: center
    }

    .footer .desc span:first-child {
      margin-right: 29px
    }

    .footer .contact {
      text-align: right
    }

    @media screen and (max-height:800px) {
      .main {
        padding-top: 70px
      }

      .main .title {
        margin-bottom: 20px
      }

      .main .description {
        margin-bottom: 60px
      }

      .main .download {
        margin-bottom: 20px
      }
    }

    @media screen and (min-height:750px) {
      .main {
        bottom: 31%;
      }
.main2 {
    bottom: 62%;
}
      .main .title {
        margin-bottom: 12px;
      }

      .main .description {
        margin-bottom: 35px;
      }

      .main .download {
        margin-bottom: 36px;
      }
    }

    @media screen and (min-width:768px) {
      body {
        overflow-x: hidden
      }
.main2 {
    left: 4%;
}
      .main {
        left: 22%;
      }

      .footer .langs {
width: 478px;
    height: 27px;
    float: left;
    font-family: "微软雅黑";
    font-size: 12px;
    line-height: 22px;
    color: #FFFFFF;
    padding-right: 20px;
    padding-left: 20px;
      }

      .footer .contact {
        padding-right: 30px
      }
    }

    @media screen and (max-width:767px) {

      .main {
        left: 30%;
        transform: translateX(-50%)
      }
.main .changelog ol {
    padding-left: 1em;
    line-height: 2em;
    font-size: 13px;
}
      .footer .column {
        padding: 0 !important
      }

      .footer .contact,
      .footer .desc,
      .footer .langs {
        position: relative;
        text-align: center;
        padding-bottom: 0
      }

      .footer .langs {
        top: 2.5rem
      }

      .footer .desc {
        top: 1.5rem
      }
    }

    @media screen and (min-width:1920px) {
      .main {
        left: 12.5%
      }
    }

    @media screen and (min-height:1080px) {
      .main {
        bottom: 38%
      }
    }

  
  </style>