a {
    text-decoration: none;
    color: inherit
}

body {
      font-family: "Arial";
    text-align: center;
    margin: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
}

/*.overflow-wrap {*/
/*    overflow-x: hidden*/
/*}*/

/*.canvas {*/
/*    position: absolute;*/
/*    top: 0;*/
/*    left: 0;*/
/*    width: 100vw;*/
/*    height: 100%;*/
/*    background: url(../img/filler.png);*/
/*}*/

.button {
    padding: 10px 20px;
    border: 2px solid #fff;
    box-sizing: inherit;
    display: inline-block;
    font-size: 13pt;
    transition: all .5s;
    cursor: pointer
}

.button:hover {
    background-color: #d6eef8 !important;
    border-color: #d6eef8 !important;
    color: #01426a !important;
}

.button .mdi {
    vertical-align: middle !important;
}

.flex {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center
}

.flex.row {
    flex-direction: row
}

.flex.wrap {
    flex-wrap: wrap
}

@media only screen and (max-width:500px) {
    .header-dark {
        font-size: 30pt;
        line-height: 25pt
    }
    .header-light {
        font-size: 30pt;
        line-height: 25pt
    }
}

@media only screen and (min-width:500px) {
    .header-dark {
        font-size: 40pt
    }
    .header-light {
        font-size: 40pt
    }
}

.header-dark {
    color: #01426a;
    position: relative
}

.header-bar-dark {
    margin: 25px 0 75px 0;
    width: 85px;
    height: 4px;
    background: #01426a
}

.header-light {
    position: relative;
    color: #fff;
    position: relative
}

.header-bar-light {
    margin: 25px 0 75px 0;
    width: 85px;
    height: 4px;
    background: #fff
}

.label {
    font-size: 14pt;
    font-weight: 500
}

section {
    padding: 70px 0 70px 0;
    position: relative
}

.section1 {
    padding: 0 0 70px 0;
    position: relative
}

section .container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 10px;
    width: 100%;
    box-sizing: border-box
}

section:nth-of-type(1) {
    padding: 0 10px;
    color: #fff;
    height: calc(100vh + 53px)
}

section:nth-of-type(1) .button {
    padding: 12px 40px 12px 15px;
    position: relative;
}

section:nth-of-type(1) .button .mdi {
    transition: transform .3s !important;
    position: absolute !important;
    right: 15px !important;
    /*top: 11px !important;*/
}

section:nth-of-type(1) .site-dest:hover .mdi-rotate {
    margin-top: -15px;  
    transform: rotate(90deg)
}

section:nth-of-type(2) .label-wrap .label {
    margin: 20px 0 10px 0
}

section:nth-of-type(2) .highlight {
    color: #009ada
}

section:nth-of-type(2) .up-arrow {
    margin: 15px 0;
    height: 30px
}

section:nth-of-type(2) .bar {
    color: #666;
    height: 22px;
    position: relative;
    background-color: #eee;
    margin: 0 0 12px 0;
    align-items: flex-end;
    font-size: 7pt
}

section:nth-of-type(2) .bar:nth-child(1) .fill {
    transition: 1.1s .2s width ease-in-out
}

section:nth-of-type(2) .bar:nth-child(2) .fill {
    transition: 1.2s .2s width ease-in-out
}

section:nth-of-type(2) .bar:nth-child(3) .fill {
    transition: 1.3s .2s width ease-in-out
}

section:nth-of-type(2) .bar:nth-child(4) .fill {
    transition: 1.4s .2s width ease-in-out
}

section:nth-of-type(2) .bar:nth-child(5) .fill {
    transition: 1.5s .2s width ease-in-out
}

section:nth-of-type(2) .bar:nth-child(6) .fill {
    transition: 1.6s .2s width ease-in-out
}

section:nth-of-type(2) .bar:nth-child(7) .fill {
    transition: 1.7s .2s width ease-in-out
}

section:nth-of-type(2) .bar:nth-child(8) .fill {
    transition: 1.8s .2s width ease-in-out
}

section:nth-of-type(2) .bar:nth-child(9) .fill {
    transition: 1.9s .2s width ease-in-out
}

section:nth-of-type(2) .bar:nth-child(10) .fill {
    transition: 2s .2s width ease-in-out
}

section:nth-of-type(2) .bar span {
    display: none
}

section:nth-of-type(2) .bar.fill {
    top: 0;
    left: 0;
    position: absolute;
    background-color: #00a1a7;
    padding: 0;
    opacity: 1
}

section:nth-of-type(2) .bar span {
    z-index: 1;
    padding: 0 15px 0 0
}

section:nth-of-type(3) section:nth-of-type(3) .container {
    padding: 0
}

section:nth-of-type(3) .text {
    margin: 0 0 20px 0;
    top: 0;
    left: 0;
    position: absolute;
    width: 100%
}

section:nth-of-type(4) .flex.wrap {
    align-items: flex-start
}

section:nth-of-type(4) .bar {
    height: 3px;
    width: 25%;
    background: #71c5e8;
    margin: 10px 0
}

/*section:nth-of-type(4) .text {*/
/*    margin: 0 0 20px 0;*/
/*    font-size: 9pt;*/
/*    line-height: 13pt;*/
/*    max-height: 85px*/
/*}*/

section:nth-of-type(5) {
    background: #252934;
    color: #01426a;
    padding-top: 175px
}

section:nth-of-type(5) .header {
    color: #fff
}

section:nth-of-type(5) .header-bar {
    margin: 25px 0 40px 0;
    background: #01426a;
    width: 110px
}

section:nth-of-type(5) .highlight {
    font-weight: 600;
    color: #71c5e8
}

section:nth-of-type(5) svg {
    position: absolute;
    top: 0;
    left: 0
}

section:nth-of-type(5) form {
    margin: 40px auto 0 auto;
    min-width: 95%
}

section:nth-of-type(5) input[type=email],
section:nth-of-type(5) input[type=text],
section:nth-of-type(5) textarea {
    display: block;
    width: 100%;
    box-sizing: border-box;
    outline: 0;
    border: 0;
    padding: 10px 15px;
    background: #1e242c;
    font-size: 12pt;
    margin-bottom: 3px;
    color: #fff
}

section:nth-of-type(5) textarea {
    min-height: 150px;
    margin-bottom: 5px
}

section:nth-of-type(5) .button {
    float: right;
    /*margin: 5px 0 0 0;*/
    /*font-size: 12pt;*/
    /*padding: 10px 30px;*/
    color: #fff;
    background: 0 0;
    outline: 0
}

section:nth-of-type(5) .button:hover {
    background: #71c5e8
}

section:nth-of-type(5) #close {
    position: absolute;
    padding: 5px 15px;
    font-size: 12pt;
    font-weight: 600;
    right: 0;
    cursor: pointer
}

footer {
    background: #1b242f;
    padding: 70px 0 50px 0;
    position: relative
}

footer .mdi-chevron-double-up {
    position: absolute !important;
    top: -25px !important;
    background: #71c5e8 !important;
    font-size: 30pt !important;
    width: 47px !important;
    height: 50px !important;
    line-height: 40pt !important;
    left: 0 !important;
    right: 0 !important;
    margin: 0 auto !important;
    cursor: pointer !important;
    transition: .5s !important;
}

footer .mdi-chevron-double-up:hover {
    background: #fb1f79 !important;
}

footer .icon-wrap .icon {
    overflow: hidden;
    transition: background .3s, color .3s, box-shadow .3s, transform .3s;
    cursor: pointer;
    width: 55px;
    height: 55px;
    position: relative;
    text-align: center;
    margin: 0 15px;
    background: #262f38;
    font-size: 18pt
}

footer .icon-wrap .mdi {
    text-align: center;
    color: #fff
}

footer .icon-wrap .icon:hover {
    background: #ffffff;
    box-shadow: 0 0 0 3px rgba(4, 94, 201, .1);
    transform: scale(.9)
}

footer .icon-wrap .icon:hover .mdi {
    color: #01426a;
}

footer .icon-wrap .icon:hover .mdi {
    -webkit-animation: toBottomFromTop .3s forwards !important;
    -moz-animation: toBottomFromTop .3s forwards !important;
    animation: toBottomFromTop .3s forwards !important;
}


@media screen and (max-width:699px) {
    section:nth-of-type(1) .text {
        margin: 0 0 20px 0;
        font-size: 26pt;
        line-height: 30pt
    }
}

@media screen and (min-width:700px) {
    /*body {*/
    /*    font-size: 12pt*/
    /*}*/
    .container {
        padding: 0 20px
    }
    .header {
        font-size: 30pt
    }
    .header-bar {
        margin: 25px 0 100px 0
    }
    .label {
        font-size: 18pt
    }
    .slide {
        height: 450px
    }
    .mdi-chevron-left,
    .mdi-chevron-right {
        font-size: 25pt!important
    }
    .modal-wrap .modal {
        top: -6vh;
        height: initial
    }
    .modal-wrap .info-box {
        padding: 35px 60px 90px 25px
    }
    .modal-wrap .title {
        font-size: 22pt;
        line-height: 30pt
    }
    .modal-wrap .close {
        right: 25px
    }
    .modal-wrap .button {
        left: 25px
    }
    nav .link-wrap {
        position: initial;
        background: 0 0;
        overflow: visible;
        height: initial;
        text-align: left
    }
    nav .link-wrap div {
        margin: 0 20px;
        padding: initial;
        font-size: initial;
        display: inline
    }
    nav .link-wrap div:first-child {
        padding: 0
    }
    nav .mdi-menu {
        display: none
    }
    section .container {
        padding: 0 10px
    }
    section:nth-of-type(1) .text {
        margin: 0 0 20px 0;
        font-size: 32pt;
        line-height: 36pt
    }
    section:nth-of-type(1) .button {
        /*padding: 12px 50px 12px 20px*/
    }
    section:nth-of-type(1) .button .mdi {
        /*top: 16px !important;*/
    }
    section:nth-of-type(2) .label-wrap .label {
        margin: 15px 0 5px 0
    }
    section:nth-of-type(2) .label-wrap>div {
        padding: 0 15px
    }
    section:nth-of-type(2) .bar {
        height: 28px;
        margin: 0 0 15px 0;
        font-size: 11pt
    }
    section:nth-of-type(2) .bar span {
        display: initial
    }
    section:nth-of-type(4) .label {
        line-height: 22pt;
        font-size: 16pt
    }
    section:nth-of-type(4) .bar {
        margin: 15px 0
    }
    section:nth-of-type(4) .text {
        margin: 0 0 20px 0;
        font-size: 11pt;
        line-height: 15pt
    }
    section:nth-of-type(5) form {
        min-width: 500px
    }
}

@media screen and (min-width:960px) {
    .waypoint {
        opacity: 1
    }
    .canvas {
        background: #252934
    }
    .button {
        /*font-size: 16pt*/
    }
    section:nth-of-type(2) .bar {
        max-width: 90%
    }
}
