html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block
}

body {
    line-height: 1
}

ol, ul {
    list-style: none
}

blockquote, q {
    quotes: none
}

    blockquote:before, blockquote:after, q:before, q:after {
        content: '';
        content: none
    }

table {
    border-collapse: collapse;
    border-spacing: 0
}

:focus {
    outline: 0
}

*, *:after, *:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

@font-face {
    font-family: 'robotolight';
    src: url("fonts/Roboto-Light-webfont.eot");
    src: url("fonts/Roboto-Light-webfont.eot?#iefix") format("embedded-opentype"),url("fonts/Roboto-Light-webfont.woff") format("woff"),url("fonts/Roboto-Light-webfont.ttf") format("truetype"),url("fonts/Roboto-Light-webfont.svg#robotolight") format("svg");
    font-weight: normal;
    font-style: normal
}

@font-face {
    font-family: 'OpenSans';
    src: url("fonts/OpenSans-Regular.ttf");
    font-weight: normal;
    font-style: normal
}

@font-face {
    font-family: 'OpenSans';
    src: url("fonts/OpenSans-Italic.ttf");
    font-weight: normal;
    font-style: italic
}

@font-face {
    font-family: 'OpenSans';
    src: url("fonts/OpenSans-Bold.ttf");
    font-weight: bold;
    font-style: normal
}

@font-face {
    font-family: 'icons';
    src: url("fonts/icons.woff2?u2sbp6") format("woff2"),url("fonts/icons.ttf?u2sbp6") format("truetype"),url("fonts/icons.woff?u2sbp6") format("woff"),url("fonts/icons.svg?u2sbp6#icons") format("svg");
    font-weight: normal;
    font-style: normal
}

.icon, [class^='icon-'], [class*=' icon-'] {
    font-family: 'icons';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 20px
}

html, body {
    height: 100%;
    font-family: "OpenSans",sans-serif,Arial;
    font-size: 15px;
    line-height: 1.6;
    color: #898989;
    background-color: #fff;
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: transparent
}

.container {
    max-width: 1200px;
    width: 95%;
    margin-left: auto;
    margin-right: auto;
    padding: 0 0
}

    .container.main, .container.main-small {
        margin-bottom: -65px;
        padding-top: 72px;
        min-height: 100%
    }

        .container.main:after, .container.main-small:after {
            content: "";
            display: block;
            height: 65px
        }

    .container.main-small {
        padding-top: 48px
    }

.footer {
    color: #898989;
    background-color: transparent;
    font-weight: normal;
    height: 65px;
    position: relative;
    font-size: 15px;
    line-height: 15px;
    border-top: 0 solid transparent
}

    .footer a {
        color: #898989;
        font-size: 15px;
        line-height: 15px;
        vertical-align: baseline
    }

        .footer a:hover {
            color: #898989;
            text-decoration: underline
        }

    .footer .container {
        padding: 24px 20px 16px 20px
    }

    .footer .klokan {
        font-size: 46px
    }

        .footer .klokan::after {
            content: "";
            display: inline-block;
            background-color: #898989;
            width: 1px;
            height: 15px;
            margin: 0 4px 0 14px
        }

@media (max-width: 768px) {
    .footer a {
        font-size: 10px
    }

    .footer .klokan {
        font-size: 32px
    }

        .footer .klokan::after {
            height: 10px
        }
}

*:focus {
    outline: none
}

hr, .hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #898989
}

article img, article iframe, .article img, .article iframe {
    margin: 20px;
    display: block;
    margin-left: auto;
    margin-right: auto
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: "OpenSans",sans-serif,Arial;
    font-weight: 300;
    line-height: 100%;
    color: #424242
}

    h1 small, h1 .small, h2 small, h2 .small, h3 small, h3 .small, h4 small, h4 .small, h5 small, h5 .small, h6 small, h6 .small, .h1 small, .h1 .small, .h2 small, .h2 .small, .h3 small, .h3 .small, .h4 small, .h4 .small, .h5 small, .h5 .small, .h6 small, .h6 .small {
        font-weight: normal;
        line-height: 1
    }

    h1.prim, h2.prim, h3.prim, h4.prim, h5.prim, h6.prim, .h1.prim, .h2.prim, .h3.prim, .h4.prim, .h5.prim, .h6.prim {
        font-family: "OpenSans",sans-serif,Arial
    }

h1, .h1, h2, .h2, h3, .h3 {
    margin-top: 20px;
    margin-bottom: 10px
}

h4, .h4, h5, .h5, h6, .h6 {
    margin-top: 10px;
    margin-bottom: 10px
}

h1, .h1 {
    font-size: 38px
}

h2, .h2 {
    font-size: 28px
}

h3, .h3 {
    font-size: 20px
}

h4, .h4 {
    font-size: 16px
}

h5, .h5 {
    font-size: 15px
}

h6, .h6 {
    font-size: 12px
}

p {
    margin: 0 0 10px;
    font-size: 15px
}

a {
    color: #3d82f7;
    text-decoration: none
}

    a:hover, a:focus {
        color: #649bf9;
        text-decoration: underline
    }

strong, b, .strong, .b {
    font-weight: bold
}

em, i, cite {
    font-style: italic
}

abbr, dfn {
    cursor: help;
    border-bottom: 1px dotted
}

ul {
    list-style-type: square;
    margin: 0 20px
}

ol {
    list-style-type: lower-latin;
    margin: 0 20px
}

mark {
    color: #424242;
    background-color: #f3f3f3
}

code, .code, pre {
    background-color: #f3f3f3;
    color: #424242;
    padding: 2px 6px;
    font-family: Menlo,Monaco,"Courier New",monospace;
    overflow: auto
}

small, .small {
    font-size: 85%
}

.smaller {
    font-size: 65%
}

.normal {
    font-size: 15px
}

big, .big {
    font-size: 115%
}

.bigger {
    font-size: 135%
}

.btn {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    color: #fff;
    background-color: #3d82f7;
    background: linear-gradient(#3d82f7, #2572f6);
    border: none;
    height: 40px;
    font-size: 14px;
    padding: 10px 16px;
    border-width: 0;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn:hover, .btn:focus, .btn:active, .btn.active {
        color: #fff;
        background: linear-gradient(#2572f6, #0c62f5)
    }

    .btn:hover, .btn:focus, .btn:active, .btn.active {
        text-decoration: none
    }

.btn-small {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    color: #fff;
    background-color: #3d82f7;
    background: linear-gradient(#3d82f7, #2572f6);
    border: none;
    height: 32px;
    font-size: 11.2px;
    padding: 8px 14px;
    border-width: 0;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-small:hover, .btn-small:focus, .btn-small:active, .btn-small.active {
        color: #fff;
        background: linear-gradient(#2572f6, #0c62f5)
    }

    .btn-small:hover, .btn-small:focus, .btn-small:active, .btn-small.active {
        text-decoration: none
    }

.btn-stroke {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    color: #3d82f7;
    background: transparent;
    border: #3d82f7;
    border-color: #3d82f7;
    height: 40px;
    font-size: 14px;
    padding: 8px 14px;
    border-width: 2px;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-stroke:hover, .btn-stroke:focus, .btn-stroke:active, .btn-stroke.active {
        color: #6ea2f9;
        background-color: transparent;
        border-color: #6ea2f9
    }

    .btn-stroke:hover, .btn-stroke:focus, .btn-stroke:active, .btn-stroke.active {
        text-decoration: none
    }

.btn-large {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    font-weight: normal;
    color: #fff;
    background-color: #3d82f7;
    background: linear-gradient(#3d82f7, #2572f6);
    border: none;
    font-size: 19.6px;
    padding: 20px 26px;
    border-width: 0;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-large:hover, .btn-large:focus, .btn-large:active, .btn-large.active {
        color: #fff;
        background: linear-gradient(#2572f6, #0c62f5)
    }

    .btn-large:hover, .btn-large:focus, .btn-large:active, .btn-large.active {
        text-decoration: none
    }

.btn-large-stroke {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    font-weight: normal;
    color: #3d82f7;
    background: transparent;
    border: #3d82f7;
    border-color: #3d82f7;
    font-size: 19.6px;
    padding: 20px 26px;
    border-width: 2px;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-large-stroke:hover, .btn-large-stroke:focus, .btn-large-stroke:active, .btn-large-stroke.active {
        color: #6ea2f9;
        background-color: transparent;
        border-color: #6ea2f9
    }

    .btn-large-stroke:hover, .btn-large-stroke:focus, .btn-large-stroke:active, .btn-large-stroke.active {
        text-decoration: none
    }

.btn-dark {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    color: #fff;
    background-color: #0c62f5;
    background: linear-gradient(#0c62f5, #0958de);
    border: none;
    height: 40px;
    font-size: 14px;
    padding: 10px 16px;
    border-width: 0;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-dark:hover, .btn-dark:focus, .btn-dark:active, .btn-dark.active {
        color: #fff;
        background: linear-gradient(#3d82f7, #2572f6)
    }

    .btn-dark:hover, .btn-dark:focus, .btn-dark:active, .btn-dark.active {
        text-decoration: none
    }

.btn-small-dark {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    color: #fff;
    background-color: #0c62f5;
    background: linear-gradient(#0c62f5, #0958de);
    border: none;
    height: 32px;
    font-size: 11.2px;
    padding: 8px 14px;
    border-width: 0;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-small-dark:hover, .btn-small-dark:focus, .btn-small-dark:active, .btn-small-dark.active {
        color: #fff;
        background: linear-gradient(#3d82f7, #2572f6)
    }

    .btn-small-dark:hover, .btn-small-dark:focus, .btn-small-dark:active, .btn-small-dark.active {
        text-decoration: none
    }

.btn-stroke-dark {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    color: #0c62f5;
    background: transparent;
    border: #0c62f5;
    border-color: #0c62f5;
    height: 40px;
    font-size: 14px;
    padding: 8px 14px;
    border-width: 2px;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-stroke-dark:hover, .btn-stroke-dark:focus, .btn-stroke-dark:active, .btn-stroke-dark.active {
        color: #3d82f7;
        background-color: transparent;
        border-color: #3d82f7
    }

    .btn-stroke-dark:hover, .btn-stroke-dark:focus, .btn-stroke-dark:active, .btn-stroke-dark.active {
        text-decoration: none
    }

.btn-large-dark {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    font-weight: normal;
    color: #fff;
    background-color: #0c62f5;
    background: linear-gradient(#0c62f5, #0958de);
    border: none;
    font-size: 19.6px;
    padding: 20px 26px;
    border-width: 0;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-large-dark:hover, .btn-large-dark:focus, .btn-large-dark:active, .btn-large-dark.active {
        color: #fff;
        background: linear-gradient(#3d82f7, #2572f6)
    }

    .btn-large-dark:hover, .btn-large-dark:focus, .btn-large-dark:active, .btn-large-dark.active {
        text-decoration: none
    }

.btn-large-stroke-dark {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    font-weight: normal;
    color: #0c62f5;
    background: transparent;
    border: #0c62f5;
    border-color: #0c62f5;
    font-size: 19.6px;
    padding: 20px 26px;
    border-width: 2px;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-large-stroke-dark:hover, .btn-large-stroke-dark:focus, .btn-large-stroke-dark:active, .btn-large-stroke-dark.active {
        color: #3d82f7;
        background-color: transparent;
        border-color: #3d82f7
    }

    .btn-large-stroke-dark:hover, .btn-large-stroke-dark:focus, .btn-large-stroke-dark:active, .btn-large-stroke-dark.active {
        text-decoration: none
    }

.btn-light {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    color: #fff;
    background-color: #6ea2f9;
    background: linear-gradient(#6ea2f9, #5592f8);
    border: none;
    height: 40px;
    font-size: 14px;
    padding: 10px 16px;
    border-width: 0;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-light:hover, .btn-light:focus, .btn-light:active, .btn-light.active {
        color: #fff;
        background: linear-gradient(#2572f6, #0c62f5)
    }

    .btn-light:hover, .btn-light:focus, .btn-light:active, .btn-light.active {
        text-decoration: none
    }

.btn-small-light {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    color: #fff;
    background-color: #6ea2f9;
    background: linear-gradient(#6ea2f9, #5592f8);
    border: none;
    height: 32px;
    font-size: 11.2px;
    padding: 8px 14px;
    border-width: 0;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-small-light:hover, .btn-small-light:focus, .btn-small-light:active, .btn-small-light.active {
        color: #fff;
        background: linear-gradient(#2572f6, #0c62f5)
    }

    .btn-small-light:hover, .btn-small-light:focus, .btn-small-light:active, .btn-small-light.active {
        text-decoration: none
    }

.btn-stroke-light {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    color: #6ea2f9;
    background: transparent;
    border: #6ea2f9;
    border-color: #6ea2f9;
    height: 40px;
    font-size: 14px;
    padding: 8px 14px;
    border-width: 2px;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-stroke-light:hover, .btn-stroke-light:focus, .btn-stroke-light:active, .btn-stroke-light.active {
        color: #9fc1fb;
        background-color: transparent;
        border-color: #9fc1fb
    }

    .btn-stroke-light:hover, .btn-stroke-light:focus, .btn-stroke-light:active, .btn-stroke-light.active {
        text-decoration: none
    }

.btn-large-light {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    font-weight: normal;
    color: #fff;
    background-color: #6ea2f9;
    background: linear-gradient(#6ea2f9, #5592f8);
    border: none;
    font-size: 19.6px;
    padding: 20px 26px;
    border-width: 0;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-large-light:hover, .btn-large-light:focus, .btn-large-light:active, .btn-large-light.active {
        color: #fff;
        background: linear-gradient(#2572f6, #0c62f5)
    }

    .btn-large-light:hover, .btn-large-light:focus, .btn-large-light:active, .btn-large-light.active {
        text-decoration: none
    }

.btn-large-stroke-light {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    font-weight: normal;
    color: #6ea2f9;
    background: transparent;
    border: #6ea2f9;
    border-color: #6ea2f9;
    font-size: 19.6px;
    padding: 20px 26px;
    border-width: 2px;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-large-stroke-light:hover, .btn-large-stroke-light:focus, .btn-large-stroke-light:active, .btn-large-stroke-light.active {
        color: #9fc1fb;
        background-color: transparent;
        border-color: #9fc1fb
    }

    .btn-large-stroke-light:hover, .btn-large-stroke-light:focus, .btn-large-stroke-light:active, .btn-large-stroke-light.active {
        text-decoration: none
    }

.btn-gray-dark {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    color: #f3f3f3;
    background-color: #424242;
    background: linear-gradient(#424242, #353535);
    border: none;
    height: 40px;
    font-size: 14px;
    padding: 10px 16px;
    border-width: 0;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-gray-dark:hover, .btn-gray-dark:focus, .btn-gray-dark:active, .btn-gray-dark.active {
        color: #f3f3f3;
        background: linear-gradient(#353535, #292929)
    }

    .btn-gray-dark:hover, .btn-gray-dark:focus, .btn-gray-dark:active, .btn-gray-dark.active {
        text-decoration: none
    }

.btn-small-gray-dark {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    color: #f3f3f3;
    background-color: #424242;
    background: linear-gradient(#424242, #353535);
    border: none;
    height: 32px;
    font-size: 11.2px;
    padding: 8px 14px;
    border-width: 0;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-small-gray-dark:hover, .btn-small-gray-dark:focus, .btn-small-gray-dark:active, .btn-small-gray-dark.active {
        color: #f3f3f3;
        background: linear-gradient(#353535, #292929)
    }

    .btn-small-gray-dark:hover, .btn-small-gray-dark:focus, .btn-small-gray-dark:active, .btn-small-gray-dark.active {
        text-decoration: none
    }

.btn-stroke-gray-dark {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    color: #424242;
    background: transparent;
    border: #424242;
    border-color: #424242;
    height: 40px;
    font-size: 14px;
    padding: 8px 14px;
    border-width: 2px;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-stroke-gray-dark:hover, .btn-stroke-gray-dark:focus, .btn-stroke-gray-dark:active, .btn-stroke-gray-dark.active {
        color: #5c5c5c;
        background-color: transparent;
        border-color: #5c5c5c
    }

    .btn-stroke-gray-dark:hover, .btn-stroke-gray-dark:focus, .btn-stroke-gray-dark:active, .btn-stroke-gray-dark.active {
        text-decoration: none
    }

.btn-large-gray-dark {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    font-weight: normal;
    color: #f3f3f3;
    background-color: #424242;
    background: linear-gradient(#424242, #353535);
    border: none;
    font-size: 19.6px;
    padding: 20px 26px;
    border-width: 0;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-large-gray-dark:hover, .btn-large-gray-dark:focus, .btn-large-gray-dark:active, .btn-large-gray-dark.active {
        color: #f3f3f3;
        background: linear-gradient(#353535, #292929)
    }

    .btn-large-gray-dark:hover, .btn-large-gray-dark:focus, .btn-large-gray-dark:active, .btn-large-gray-dark.active {
        text-decoration: none
    }

.btn-large-stroke-gray-dark {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    font-weight: normal;
    color: #424242;
    background: transparent;
    border: #424242;
    border-color: #424242;
    font-size: 19.6px;
    padding: 20px 26px;
    border-width: 2px;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-large-stroke-gray-dark:hover, .btn-large-stroke-gray-dark:focus, .btn-large-stroke-gray-dark:active, .btn-large-stroke-gray-dark.active {
        color: #5c5c5c;
        background-color: transparent;
        border-color: #5c5c5c
    }

    .btn-large-stroke-gray-dark:hover, .btn-large-stroke-gray-dark:focus, .btn-large-stroke-gray-dark:active, .btn-large-stroke-gray-dark.active {
        text-decoration: none
    }

.btn-gray-light {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    color: #424242;
    background-color: #f3f3f3;
    background: linear-gradient(#f3f3f3, #e6e6e6);
    border: none;
    height: 40px;
    font-size: 14px;
    padding: 10px 16px;
    border-width: 0;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-gray-light:hover, .btn-gray-light:focus, .btn-gray-light:active, .btn-gray-light.active {
        color: #424242;
        background: linear-gradient(#e6e6e6, #dadada)
    }

    .btn-gray-light:hover, .btn-gray-light:focus, .btn-gray-light:active, .btn-gray-light.active {
        text-decoration: none
    }

.btn-small-gray-light {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    color: #424242;
    background-color: #f3f3f3;
    background: linear-gradient(#f3f3f3, #e6e6e6);
    border: none;
    height: 32px;
    font-size: 11.2px;
    padding: 8px 14px;
    border-width: 0;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-small-gray-light:hover, .btn-small-gray-light:focus, .btn-small-gray-light:active, .btn-small-gray-light.active {
        color: #424242;
        background: linear-gradient(#e6e6e6, #dadada)
    }

    .btn-small-gray-light:hover, .btn-small-gray-light:focus, .btn-small-gray-light:active, .btn-small-gray-light.active {
        text-decoration: none
    }

.btn-stroke-gray-light {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    color: #f3f3f3;
    background: transparent;
    border: #f3f3f3;
    border-color: #f3f3f3;
    height: 40px;
    font-size: 14px;
    padding: 8px 14px;
    border-width: 2px;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-stroke-gray-light:hover, .btn-stroke-gray-light:focus, .btn-stroke-gray-light:active, .btn-stroke-gray-light.active {
        color: #fff;
        background-color: transparent;
        border-color: #fff
    }

    .btn-stroke-gray-light:hover, .btn-stroke-gray-light:focus, .btn-stroke-gray-light:active, .btn-stroke-gray-light.active {
        text-decoration: none
    }

.btn-large-gray-light {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    font-weight: normal;
    color: #424242;
    background-color: #f3f3f3;
    background: linear-gradient(#f3f3f3, #e6e6e6);
    border: none;
    font-size: 19.6px;
    padding: 20px 26px;
    border-width: 0;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-large-gray-light:hover, .btn-large-gray-light:focus, .btn-large-gray-light:active, .btn-large-gray-light.active {
        color: #424242;
        background: linear-gradient(#e6e6e6, #dadada)
    }

    .btn-large-gray-light:hover, .btn-large-gray-light:focus, .btn-large-gray-light:active, .btn-large-gray-light.active {
        text-decoration: none
    }

.btn-large-stroke-gray-light {
    display: inline-block;
    text-align: center;
    margin: 0;
    position: relative;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 600;
    line-height: 1.6;
    text-decoration: none;
    vertical-align: middle;
    background-image: none;
    letter-spacing: initial;
    font-weight: normal;
    color: #f3f3f3;
    background: transparent;
    border: #f3f3f3;
    border-color: #f3f3f3;
    font-size: 19.6px;
    padding: 20px 26px;
    border-width: 2px;
    border-style: solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none
}

    .btn-large-stroke-gray-light:hover, .btn-large-stroke-gray-light:focus, .btn-large-stroke-gray-light:active, .btn-large-stroke-gray-light.active {
        color: #fff;
        background-color: transparent;
        border-color: #fff
    }

    .btn-large-stroke-gray-light:hover, .btn-large-stroke-gray-light:focus, .btn-large-stroke-gray-light:active, .btn-large-stroke-gray-light.active {
        text-decoration: none
    }

.btns {
    display: inline-block
}

    .btns a, .btns li {
        background: linear-gradient(#3d82f7, #2572f6);
        padding: 3px 20px 5px 20px;
        display: table-cell;
        border-top: none;
        border-bottom: none;
        border-left: none;
        color: #fff
    }

        .btns a:first-child, .btns li:first-child {
            border-bottom-left-radius: 4px;
            border-top-left-radius: 4px
        }

        .btns a:last-child, .btns li:last-child {
            border-right: none;
            border-top-right-radius: 4px;
            border-bottom-right-radius: 4px
        }

        .btns a:hover, .btns a.open, .btns a:focus, .btns a.active, .btns li:hover, .btns li.open, .btns li:focus, .btns li.active {
            background: linear-gradient(#2572f6, #0c62f5);
            color: #fff;
            text-decoration: none
        }

.col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11, .col12 {
    float: left;
    width: 100%;
    padding: 20px 20px;
    margin: 0 0
}

.flip {
    float: right
}

@media (min-width: 480px) {
    .col1 {
        width: 50%
    }

    .col2 {
        width: 50%
    }

    .col3 {
        width: 50%
    }

    .col4 {
        width: 50%
    }

    .col5 {
        width: 50%
    }

    .col6 {
        width: 100%
    }

    .col7 {
        width: 100%
    }

    .col8 {
        width: 100%
    }

    .col9 {
        width: 100%
    }

    .col10 {
        width: 100%
    }

    .col11 {
        width: 100%
    }

    .col12 {
        width: 100%
    }
}

@media (min-width: 768px) {
    .col1 {
        width: 8.3333%
    }

    .col2 {
        width: 16.6666%
    }

    .col3 {
        width: 25%
    }

    .col4 {
        width: 33.3333%
    }

    .col5 {
        width: 41.6666%
    }

    .col6 {
        width: 50%
    }

    .col7 {
        width: 58.3333%
    }

    .col8 {
        width: 66.6666%
    }

    .col9 {
        width: 75%
    }

    .col10 {
        width: 83.3333%
    }

    .col11 {
        width: 91.6666%
    }

    .col12 {
        width: 100%
    }
}

@media (min-width: 768px) {
    .col1 {
        width: 8.3333%
    }

    .col2 {
        width: 16.6666%
    }

    .col3 {
        width: 25%
    }

    .col4 {
        width: 33.3333%
    }

    .col5 {
        width: 41.6666%
    }

    .col6 {
        width: 50%
    }

    .col7 {
        width: 58.3333%
    }

    .col8 {
        width: 66.6666%
    }

    .col9 {
        width: 75%
    }

    .col10 {
        width: 83.3333%
    }

    .col11 {
        width: 91.6666%
    }

    .col12 {
        width: 100%
    }

    .offset1 {
        margin-left: 8.3333%
    }

    .offset2 {
        margin-left: 16.6666%
    }

    .offset3 {
        margin-left: 25%
    }

    .offset4 {
        margin-left: 33.3333%
    }

    .offset5 {
        margin-left: 41.6666%
    }

    .offset6 {
        margin-left: 50%
    }

    .offset7 {
        margin-left: 58.3333%
    }

    .offset8 {
        margin-left: 66.6666%
    }

    .offset9 {
        margin-left: 75%
    }

    .offset10 {
        margin-left: 83.3333%
    }

    .offset11 {
        margin-left: 91.6666%
    }

    .offset12 {
        margin-left: 100%
    }
}

.rowactive {
    display: block
}

.row1 {
    height: 40px
}

.row2 {
    height: 80px
}

.row3 {
    height: 120px
}

.row4 {
    height: 160px
}

.row5 {
    height: 200px
}

.row6 {
    height: 240px
}

.row7 {
    height: 280px
}

.row8 {
    height: 320px
}

.row9 {
    height: 360px
}

.row10 {
    height: 400px
}

.row11 {
    height: 440px
}

.row12 {
    height: 480px
}

.row13 {
    height: 520px
}

.row14 {
    height: 560px
}

.row15 {
    height: 600px
}

.row16 {
    height: 640px
}

.no-padding {
    padding: 0
}

.no-margin {
    margin: 0
}

.col-img {
    border: none;
    float: left
}

@media (min-width: 768px) {
    .col-img {
        width: 50%
    }
}

@media (min-width: 992px) {
    .col-img {
        width: 25%
    }
}

.col-img img {
    width: 90%
}

table {
    width: 100%;
    border-spacing: inherit;
    margin: 10px 0
}

    table td, table th {
        text-decoration: none;
        border-collapse: collapse;
        border-spacing: 0;
        font-family: inherit;
        font-size: 15px;
        color: #424242;
        padding: 14px 28px;
        display: table-cell;
        border: 1px solid #eee
    }

    table tr {
        border-top: 1px solid #eee
    }

        table tr a:hover {
            cursor: pointer;
            text-decoration: none;
            color: #6ea2f9
        }

        table tr.clickable {
            cursor: pointer
        }

        table tr.hover:hover {
            background: #f3f3f3
        }

    table th, table thead, table tfoot {
        color: #424242;
        font-size: 15px;
        font-weight: bold;
        background: #f3f3f3;
        cursor: default
    }

    table .clear {
        font-weight: normal;
        background: transparent
    }

        table .clear:hover {
            background-color: transparent
        }

        table .clear tr, table .clear th {
            border-top: none;
            border-bottom: none
        }

    table tfoot {
        border-bottom: 1px solid #eee
    }

    table.striped td {
        border: none
    }

    table.hover tr:hover, table.hover th:hover {
        background: #f3f3f3
    }

    table.clickable tr, table.clickable th {
        cursor: pointer
    }

    table .icon {
        font-size: 15px
    }

.even {
    background-color: #eee5de
}

.odd {
    background-color: #f6f2ef
}

fieldset {
    padding: 0;
    margin: 0;
    border: 0;
    min-width: 0
}

legend {
    display: block;
    width: 100%;
    padding: 0;
    margin-bottom: 20px;
    font-size: 22.5px;
    line-height: inherit;
    color: #424242;
    border: 0
}

label {
    max-width: 100%;
    margin: 6px 0 4px 1px;
    font-weight: bold;
    font-size: 13.5px;
    color: #424242;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

input, textarea {
    padding: 8px 12px;
    line-height: 20px;
    color: #898989;
    background-color: #fff;
    background-image: none;
    border: 1px solid #898989;
    border-radius: 3px;
    font-family: "OpenSans",sans-serif,Arial;
    font-size: 12px;
    vertical-align: middle
}

    input.stretch, textarea.stretch {
        width: 100%
    }

    input:active, input:focus, textarea:active, textarea:focus {
        color: #000;
        border-color: #3d82f7;
        box-shadow: none
    }

    input[type='text'].search, input[type='password'].search, input[type='date'].search, input[type='email'].search, input[type='button'].search {
        display: inline-block
    }

    input[type='submit'], input[type='button'] {
        margin-top: 5px
    }

        input[type='submit'].search, input[type='button'].search {
            position: relative;
            display: inline-block;
            margin-top: 0;
            padding: 7px 10px;
            cursor: pointer
        }

            input[type='submit'].search:hover, input[type='button'].search:hover {
                color: #3d3d3d;
                border-color: #3d3d3d
            }

    input[type="radio"], input[type="checkbox"] {
        margin: 9px 0 0 1px;
        line-height: normal;
        display: inline-block
    }

    input[type="file"] {
        display: block
    }

    input[type="range"] {
        display: block;
        width: 100%
    }

select[multiple], select[size] {
    height: auto
}

input[type="file"]:focus, input[type="radio"]:focus, input[type="checkbox"]:focus {
    outline: none
}

output {
    display: block;
    padding-top: 21px;
    font-size: 15px;
    line-height: 1.6;
    color: #898989
}

input[type="search"] {
    -webkit-appearance: none
}

input[type="date"], input[type="time"], input[type="datetime-local"], input[type="month"] {
    line-height: 30px;
    line-height: 1.6 \0
}

    input[type="date"].input-sm, input[type="time"].input-sm, input[type="datetime-local"].input-sm, input[type="month"].input-sm {
        line-height: 20px
    }

form ul, form li {
    margin: 0;
    list-style-type: none
}

    form ul li label {
        display: inline-block;
        font-weight: normal
    }

.progress {
    width: 400px;
    padding: 30px 0 30px 0;
    min-height: 50px;
    font-size: 12px;
    line-height: 12px;
    margin: 0
}

    .progress .bar {
        width: 80%;
        height: 42px;
        float: left
    }

        .progress .bar .segment {
            float: left;
            height: 15px;
            display: block
        }

            .progress .bar .segment:first-child {
                background-color: #da4d00,#41768a,#d4c5a9 0
            }

            .progress .bar .segment:nth-child(1) {
                background-color: #da4d00
            }

            .progress .bar .segment:nth-child(2) {
                background-color: #41768a
            }

            .progress .bar .segment:nth-child(3) {
                background-color: #d4c5a9
            }

            .progress .bar .segment:first-child:before, .progress .bar .segment:nth-child(2):before {
                position: absolute;
                margin-top: -15px;
                padding-right: 10px;
                background: #fff;
                min-width: 55px
            }

            .progress .bar .segment.reviewed:first-child:before {
                content: 'Reviewed'
            }

            .progress .bar .segment.edited:nth-child(2):before {
                content: 'Edited'
            }

        .progress .bar .segment-label {
            position: absolute;
            background: #fff;
            font-size: 14px;
            margin-top: 15px;
            padding-top: 4px
        }

        .progress .bar .maps:after, .progress .bar .sheets:after, .progress .bar .bar:before, .progress .bar .bar-count, .progress .bar .bar-segment:first-child:before, .progress .bar .bar-segment:nth-child(2):before {
            background-color: #fff
        }

        .progress .bar .segment-label:after {
            position: absolute;
            margin-top: 12px;
            font-size: 10px;
            left: 0
        }

    .progress .sheets:after {
        content: " sheets"
    }

    .progress .maps:after {
        content: " maps"
    }

    .progress .percent:after {
        content: " %"
    }

    .progress .bar-count {
        position: relative;
        width: 16%;
        float: right;
        font-size: 28px;
        padding: 15px 2%;
        margin-top: -15px;
        z-index: 10
    }

        .progress .bar-count:after {
            padding-left: 10px;
            padding-bottom: 16px;
            font-size: 16px;
            position: absolute;
            margin-top: 10px;
            left: 0;
            display: block
        }

#navbar-top, #navbar-top-small {
    position: relative;
    height: 72px;
    margin-bottom: 20px;
    position: fixed;
    right: 0;
    left: 0;
    z-index: 90;
    top: 0;
    border-bottom: 0;
    background: transparent
}

    #navbar-top .logo h1, #navbar-top-small .logo h1, #navbar-top .title, #navbar-top-small .title {
        float: left;
        font-size: 24px;
        height: 72px;
        padding-top: 36px;
        padding-right: 20px;
        padding-bottom: 12px;
        padding-left: 20px;
        margin: 0;
        white-space: nowrap;
        color: #212121;
        font-family: "OpenSans",sans-serif;
        line-height: 24px;
        background: transparent;
        width: auto
    }

        #navbar-top .logo h1:hover, #navbar-top-small .logo h1:hover, #navbar-top .title:hover, #navbar-top-small .title:hover {
            text-decoration: none
        }

        #navbar-top .logo h1 a, #navbar-top-small .logo h1 a, #navbar-top .title a, #navbar-top-small .title a {
            color: #212121
        }

            #navbar-top .logo h1 a:hover, #navbar-top-small .logo h1 a:hover, #navbar-top .title a:hover, #navbar-top-small .title a:hover {
                text-decoration: none
            }

    #navbar-top .nav, #navbar-top-small .nav {
        float: right;
        padding: 0 20px
    }

        #navbar-top .nav li, #navbar-top-small .nav li {
            display: inline-block
        }

        #navbar-top .nav a, #navbar-top-small .nav a, #navbar-top .nav div, #navbar-top-small .nav div, #navbar-top .nav span, #navbar-top-small .nav span {
            text-decoration: none;
            font-size: 14px;
            font-family: "OpenSans",sans-serif,Arial;
            display: inline-block;
            padding: 40px 2px 12px 2px;
            line-height: 14px;
            font-weight: bold
        }

        #navbar-top .nav a, #navbar-top-small .nav a {
            color: #424242
        }

            #navbar-top .nav a:hover, #navbar-top-small .nav a:hover, #navbar-top .nav a:focus, #navbar-top-small .nav a:focus, #navbar-top .nav a.active, #navbar-top-small .nav a.active {
                color: #424242;
                background-color: transparent
            }

            #navbar-top .nav a.active, #navbar-top-small .nav a.active {
                border-bottom: 3px solid #3d82f7
            }

@media (max-width: 768px) {
    #navbar-top .nav, #navbar-top-small .nav {
        display: none
    }
}

#navbar-top .nav-mobile, #navbar-top-small .nav-mobile {
    margin: 0;
    padding: 0;
    font-size: 30px;
    float: right
}

@media (min-width: 768px) {
    #navbar-top .nav-mobile, #navbar-top-small .nav-mobile {
        display: none
    }
}

@media (max-width: 768px) {
    #navbar-top .nav-mobile, #navbar-top-small .nav-mobile {
        display: block
    }
}

#navbar-top .nav-mobile #nav-mobile-btn, #navbar-top-small .nav-mobile #nav-mobile-btn {
    color: #424242;
    height: 72px;
    padding: 16px;
    font-family: 'icons'
}

    #navbar-top .nav-mobile #nav-mobile-btn:hover, #navbar-top-small .nav-mobile #nav-mobile-btn:hover, #navbar-top .nav-mobile #nav-mobile-btn:active, #navbar-top-small .nav-mobile #nav-mobile-btn:active {
        cursor: pointer
    }

    #navbar-top .nav-mobile #nav-mobile-btn.active, #navbar-top-small .nav-mobile #nav-mobile-btn.active, #navbar-top .nav-mobile #nav-mobile-btn.open, #navbar-top-small .nav-mobile #nav-mobile-btn.open {
        color: #cf3510;
        margin: 0
    }

#navbar-top .nav-mobile::selection, #navbar-top-small .nav-mobile::selection, #navbar-top .nav-mobile::-moz-selection, #navbar-top-small .nav-mobile::-moz-selection {
    background: transparent
}

#navbar-top .nav-mobile #nav-mobile-nav, #navbar-top-small .nav-mobile #nav-mobile-nav {
    display: none;
    background: #fff;
    position: absolute;
    top: 72px;
    left: 40px;
    right: 40px;
    width: auto;
    list-style-type: none;
    font-size: 14px;
    padding: 10px 20px 0 20px 0;
    border: none;
    box-shadow: 2px 2px 20px -1px rgba(0,0,0,0.75);
    margin: 0
}

    #navbar-top .nav-mobile #nav-mobile-nav li a, #navbar-top-small .nav-mobile #nav-mobile-nav li a, #navbar-top .nav-mobile #nav-mobile-nav a, #navbar-top-small .nav-mobile #nav-mobile-nav a {
        color: #424242;
        text-decoration: none;
        padding: 16px;
        display: block;
        border-bottom: 1px solid #f3f3f3
    }

        #navbar-top .nav-mobile #nav-mobile-nav li a:hover, #navbar-top-small .nav-mobile #nav-mobile-nav li a:hover, #navbar-top .nav-mobile #nav-mobile-nav li a:active, #navbar-top-small .nav-mobile #nav-mobile-nav li a:active, #navbar-top .nav-mobile #nav-mobile-nav a:hover, #navbar-top-small .nav-mobile #nav-mobile-nav a:hover, #navbar-top .nav-mobile #nav-mobile-nav a:active, #navbar-top-small .nav-mobile #nav-mobile-nav a:active {
            list-style-type: none;
            text-decoration: none;
            color: primary;
            background: #f3f3f3
        }

    #navbar-top .nav-mobile #nav-mobile-nav.active, #navbar-top-small .nav-mobile #nav-mobile-nav.active, #navbar-top .nav-mobile #nav-mobile-nav.open, #navbar-top-small .nav-mobile #nav-mobile-nav.open {
        display: block !important
    }

#navbar-top-small {
    height: 48px
}

    #navbar-top-small .logo h1, #navbar-top-small .title {
        font-size: 16px;
        height: 48px;
        line-height: 48px;
        padding: 0
    }

    #navbar-top-small .nav a {
        height: 48px;
        padding-top: 17px;
        padding-bottom: 8px
    }

    #navbar-top-small .nav-mobile #nav-mobile-nav {
        top: 48px
    }

#nav-mobile-nav {
    display: none
}

    #nav-mobile-nav li a {
        display: block;
        width: 100%
    }

#nav-mobile-btn {
    min-height: 34px;
    cursor: pointer
}

@media (min-width: 768px) {
    #nav-mobile-btn {
        display: none
    }
}

@media (max-width: 768px) {
    #nav-mobile-nav.active {
        display: block
    }

    #navbar-kl .nav, #mt-nav ul {
        display: none
    }
}

.navside-bg {
    display: none;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0,0,0,0.6);
    z-index: 80
}

    .navside-bg.open {
        display: block
    }

.navside-btn {
    cursor: pointer;
    width: 50px;
    padding: 10px;
    text-align: center;
    background: transparent
}

.navside {
    position: fixed;
    left: -280px;
    width: 280px;
    display: block;
    background: #fff;
    top: 0;
    bottom: 0;
    padding: 0 0 20px 0;
    transition: all 300ms;
    z-index: 100;
    overflow-y: auto;
    overflow-x: none
}

    .navside a:not([class*=user-]), .navside p:not([class*=user-]) {
        color: #424242;
        margin: 0;
        display: block;
        font-weight: bold;
        padding: 20px;
        text-decoration: none;
        border: none;
        border-bottom: none
    }

        .navside a:not([class*=user-]).last, .navside p:not([class*=user-]).last {
            border-bottom: 1px solid #f3f3f3
        }

        .navside a:not([class*=user-]).open, .navside p:not([class*=user-]).open {
            color: #3d82f7
        }

        .navside a:not([class*=user-]):hover {
            text-decoration: none;
            background-color: #dfdfdf
        }

    .navside .sub a {
        padding-left: 55px;
        font-weight: normal
    }

    .navside.open {
        left: 0;
        box-shadow: 8px 8px 20px 0 rgba(0,0,0,0.2);
        transition: all 300ms
    }

    .navside .user-login {
        display: block;
        width: 100%;
        height: 72px;
        background-color: #f3f3f3;
        font-family: "OpenSans",sans-serif;
        padding: 32px 0 10px 20px;
        font-size: 20px;
        white-space: nowrap
    }

        .navside .user-login:hover {
            text-decoration: none
        }

    .navside .user-action {
        position: absolute;
        right: 20px;
        top: 10px;
        white-space: nowrap
    }

.map-fullscreen {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.map-controls {
    -webkit-box-shadow: 0px 0px 3px 0px rgba(132,135,136,0.3);
    -moz-box-shadow: 0px 0px 3px 0px rgba(132,135,136,0.3);
    box-shadow: 0px 0px 3px 0px rgba(132,135,136,0.3)
}

    .map-controls.horizontal a {
        display: inline-block
    }

    .map-controls.top-left {
        position: absolute;
        top: 20px;
        left: 0
    }

    .map-controls.top-right {
        position: absolute;
        top: 20px;
        right: 0
    }

    .map-controls.left {
        position: absolute;
        top: 50%;
        left: 0
    }

    .map-controls.right {
        position: absolute;
        top: 50%;
        right: 0
    }

    .map-controls.bottom-left {
        position: absolute;
        bottom: 20px;
        left: 0
    }

    .map-controls.bottom-right {
        position: absolute;
        bottom: 20px;
        right: 0
    }

    .map-controls .hidden, .map-controls.hidden {
        display: none
    }

    .map-controls .visible, .map-controls.visible {
        display: inline !important
    }

    .map-controls .tooltip {
        position: absolute;
        left: 37px;
        margin-top: -37px;
        height: 36px;
        width: 300px;
        display: block;
        vertical-align: middle;
        line-height: 36px;
        padding: 0 10px;
        background-color: rgba(255,255,255,0.6);
        z-index: 10
    }

    .map-controls a, .ol-control button {
        font-family: 'icons';
        display: block;
        position: relative;
        color: #848788;
        background: #fff;
        text-decoration: none;
        width: 36px;
        height: 36px;
        font-size: 21.6px;
        line-height: 36px;
        text-align: center;
        font-weight: bold;
        margin: -1px 0;
        z-index: 2;
        font-weight: bold;
        cursor: pointer;
        z-index: 10;
        border: 1px solid #aab1b8
    }

        .map-controls a.primary, .ol-control button.primary {
            color: #fff;
            background: #3d82f7;
            border: 1px solid #3d82f7
        }

            .map-controls a.primary:hover, .map-controls a.primary:active, .map-controls a.primary:focus, .ol-control button.primary:hover, .ol-control button.primary:active, .ol-control button.primary:focus {
                color: #fff;
                background: #3d82f7;
                border: 1px solid #3d82f7
            }

        .map-controls a:hover, .map-controls a:active, .map-controls a:focus, .ol-control button:hover, .ol-control button:active, .ol-control button:focus {
            color: #3d82f7;
            background: #fff;
            border: 1px solid #aab1b8
        }

        .map-controls a .disabled, .map-controls a.disabled, .ol-control button .disabled, .ol-control button.disabled {
            background-color: #e6e6e6
        }

        .map-controls a span:first-child, .ol-control button span:first-child {
            display: none
        }

        .map-controls a span:last-child, .ol-control button span:last-child {
            display: block
        }

        .map-controls a .enabled, .map-controls a.enabled, .ol-control button .enabled, .ol-control button.enabled {
            color: #3d82f7;
            background: #fff;
            border: 1px solid #3d82f7;
            z-index: 12
        }

            .map-controls a .enabled span:first-child, .map-controls a.enabled span:first-child, .ol-control button .enabled span:first-child, .ol-control button.enabled span:first-child {
                display: block
            }

            .map-controls a .enabled span:last-child, .map-controls a.enabled span:last-child, .ol-control button .enabled span:last-child, .ol-control button.enabled span:last-child {
                display: none
            }

.ol-control, .ol-control:hover {
    background-color: transparent;
    border-radius: 0;
    padding: 0
}

.ol-scale-line {
    background: transparent
}

.ol-scale-line-inner {
    border: 1px solid #fff;
    border-top: none;
    color: #fff
}

.map-layerswitcher {
    position: absolute;
    background: rgba(255,255,255,0.7);
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 20px 55px;
    z-index: 101;
    display: none;
    overflow-y: auto
}

    .map-layerswitcher.visible {
        display: block
    }

    .map-layerswitcher .thumb {
        display: inline-block;
        position: relative;
        overflow: hidden;
        text-align: center;
        width: 170px;
        height: 170px;
        margin: 10px 12px;
        border-radius: 5px;
        -webkit-box-shadow: 0px 0px 3px 0px rgba(132,135,136,0.3);
        -moz-box-shadow: 0px 0px 3px 0px rgba(132,135,136,0.3);
        box-shadow: 0px 0px 3px 0px rgba(132,135,136,0.3);
        cursor: pointer
    }

        .map-layerswitcher .thumb .preview {
            background: #f3f3f3;
            width: 170px;
            height: 170px
        }

        .map-layerswitcher .thumb .remover {
            position: absolute;
            top: 8px;
            right: 8px;
            background: #dfdfdf;
            width: 16px;
            height: 16px;
            text-align: center;
            line-height: 16px;
            border-radius: 8px;
            color: #fff;
            font-family: 'icons';
            font-size: 12px;
            text-decoration: none
        }

            .map-layerswitcher .thumb .remover:hover {
                background: #3d82f7
            }

        .map-layerswitcher .thumb .name {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            background: rgba(255,255,255,0.85);
            font-size: 12px;
            padding: 6px 6px;
            overflow: hidden !important;
            text-overflow: ellipsis
        }

        .map-layerswitcher .thumb:not(.default):before {
            content: 'custom';
            position: absolute;
            top: 20px;
            left: -30px;
            -webkit-transform: rotate(-45deg);
            transform: rotate(-45deg);
            background: #3d82f7;
            color: #fff;
            width: 120px;
            font-size: 0.9em;
            opacity: 0.9
        }

        .map-layerswitcher .thumb.active, .map-layerswitcher .thumb:hover {
            -webkit-box-shadow: 0px 0px 0px 1px #3d82f7;
            -moz-box-shadow: 0px 0px 0px 1px #3d82f7;
            box-shadow: 0px 0px 0px 1px #3d82f7
        }

            .map-layerswitcher .thumb.active .name, .map-layerswitcher .thumb:hover .name {
                color: #3d82f7
            }

.tabs ul {
    list-style-type: none;
    margin: 0;
    padding: 0
}

    .tabs ul li {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        font-size: 18px;
        display: inline-block;
        cursor: pointer;
        padding: 14px 20px 8px 20px;
        margin: 10px 0 0 0;
        font-weight: bold;
        border-bottom: 2px solid transparent;
        color: #898989
    }

        .tabs ul li:first-child {
            margin-left: 0
        }

        .tabs ul li:hover, .tabs ul li.active {
            color: #3d82f7
        }

        .tabs ul li.active {
            border-bottom: 2px solid #3d82f7
        }

.tabs .tabs-content {
    padding: 20px;
    border: none
}

    .tabs .tabs-content .tabs-tab {
        display: none
    }

        .tabs .tabs-content .tabs-tab p {
            margin: 0
        }

        .tabs .tabs-content .tabs-tab.active {
            display: block
        }

.social {
    text-align: center;
    display: inline-block
}

    .social p {
        padding: 0;
        margin: 0
    }

    .social a {
        font-family: 'icons';
        font-size: 24px;
        color: #dfdfdf;
        cursor: pointer;
        text-decoration: none !important
    }

        .social a.G {
            color: #d34836
        }

        .social a.F {
            color: #3B5998
        }

        .social a.T {
            color: #55ACEE
        }

        .social a.P {
            color: #C92228
        }

        .social a.L {
            color: #0077B5
        }

        .social a:hover {
            text-decoration: none !important;
            color: #dfdfdf
        }

#sync-indicator {
    position: absolute;
    top: 60px;
    left: 50%;
    width: 50px;
    height: 40px;
    margin-left: -25px;
    font-size: 38px;
    line-height: 100%;
    font-family: 'icons';
    text-align: center;
    text-shadow: 0 0 2px #ccc;
    z-index: 10;
    -webkit-animation: rotanim 1s infinite ease;
    animation: rotanim 1s infinite ease
}

    #sync-indicator span {
        transform: scaleX(-1);
        display: block;
        font-family: 'icons'
    }

    #sync-indicator #sync-syncing {
        display: none
    }

    #sync-indicator.loaded #sync-loading {
        display: none
    }

    #sync-indicator.loaded #sync-syncing {
        display: block
    }

.popup-bg {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(55,55,55,0.8);
    z-index: 101
}

.popup {
    z-index: 111;
    position: absolute;
    width: 400px;
    min-height: 100px;
    top: 30%;
    left: 50%;
    margin-left: -200px;
    padding: 25px;
    background: #fff
}

    .popup .popup-title {
        display: block;
        font-weight: bold;
        padding: 0 0 10px 0;
        font-size: 120%
    }

    .popup .popup-close {
        position: absolute;
        top: 10px;
        right: 10px;
        font-family: 'icons';
        cursor: pointer;
        color: #898989
    }

        .popup .popup-close:hover {
            text-decoration: none;
            color: #565656
        }

    .popup .popup-content {
        display: block
    }

    .popup .popup-actions {
        display: block;
        margin-top: 10px
    }

        .popup .popup-actions div {
            margin-right: 10px
        }

    .popup ul.options {
        max-height: 400px;
        overflow: auto
    }

        .popup ul.options li {
            cursor: pointer;
            display: block;
            padding: 2px
        }

            .popup ul.options li:nth-child(even) {
                background: #f9f9f9
            }

            .popup ul.options li:hover {
                font-weight: bold
            }

input.working {
    background: #fff linear-gradient(90deg, #ddf, #2066a0, #ddf);
    background-size: 180px 2px;
    background-repeat: repeat-x;
    animation: bkganim .9s infinite linear
}

@keyframes bkganim {
    0% {
        background-position: 0px 100%
    }

    100% {
        background-position: 180px 100%
    }
}

.ac-renderer {
    position: absolute;
    border: 1px solid #dfdfdf;
    margin-top: -1px;
    max-width: 400px
}

.ac-row {
    white-space: nowrap;
    position: relative;
    cursor: pointer;
    padding: 5px;
    background-color: #fff;
    overflow: hidden !important;
    text-overflow: ellipsis
}

    .ac-row .suffix {
        font-size: .8em;
        color: #ccc;
        padding: .1em 0 .1em 5px
    }

    .ac-row .type {
        font-size: .7em;
        color: #aaa;
        display: block;
        width: 100%
    }

.ac-highlighted {
    font-weight: bold
}

.ac-active {
    color: #424242;
    background-color: #f3f3f3
}

.ac-type {
    background-color: #990033;
    color: #FFFFFF;
    display: block;
    margin: 2px;
    padding: 2px;
    font-style: italic;
    float: right
}

.multicomplete {
    background-color: #fff;
    border: 1px solid #dfdfdf;
    cursor: text;
    display: block;
    padding: 2px;
    width: 300px;
    height: 100px;
    overflow-y: auto;
    overflow-x: hidden;
    margin-bottom: 0
}

    .multicomplete input {
        border: 0 !important;
        outline: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        height: 23px
    }

    .multicomplete div {
        display: inline-block;
        position: relative;
        font-size: 11px;
        padding: 3px 18px 3px 5px;
        margin: 0 4px 2px 0;
        cursor: default;
        border-radius: 2.5px;
        background-color: #dfdfdf;
        color: #fff
    }

        .multicomplete div a {
            display: block;
            width: 10px;
            height: 10px;
            position: absolute;
            top: 3px;
            right: 2px;
            text-decoration: none;
            color: #fff;
            font-size: 10px
        }

            .multicomplete div a:hover {
                color: #424242
            }

        .multicomplete div .mc-tag-remove {
            font-family: 'icons'
        }

.notice {
    text-align: center;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    height: 50px;
    background-color: #f3f3f3
}

    .notice p {
        display: inline-block;
        margin: 15px 30px
    }

    .notice button {
        display: inline-block;
        height: 30px;
        padding: 4px 10px
    }

.clearfix:before, .container:before, .row:before, .row1:before, .row2:before, .row3:before, .row4:before, .row5:before, .row6:before, #navbar-top:before, #navbar-top-small:before, .clearfix:after, .container:after, .row:after, .row1:after, .row2:after, .row3:after, .row4:after, .row5:after, .row6:after, #navbar-top:after, #navbar-top-small:after {
    display: table;
    content: ""
}

.clearfix:after, .container:after, .row:after, .row1:after, .row2:after, .row3:after, .row4:after, .row5:after, .row6:after, #navbar-top:after, #navbar-top-small:after {
    clear: both
}

.hidden {
    display: none
}

.clip {
    overflow: hidden
}

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

.contain {
    position: relative
}

.absolute {
    position: absolute
}

.circle {
    border-radius: 50%
}

.round {
    border-radius: 5px
}

.round-top-left {
    border-top-left-radius: 5px
}

.round-top-right {
    border-top-right-radius: 5px
}

.round-bottom-right {
    border-bottom-right-radius: 5px
}

.round-bottom-left {
    border-top-bottom-radius: 5px
}

.float-left {
    float: left
}

.float-right {
    float: right
}

.text-left {
    text-align: left
}

.text-right {
    text-align: right
}

center, .center, .text-center {
    text-align: center
}

.inline {
    display: inline-block
}

.width-100 {
    width: 100%
}

.width-50 {
    width: 50%
}

.overflow-no {
    overflow: hidden !important;
    text-overflow: ellipsis;
    white-space: nowrap
}

.border-primary {
    border: 1px solid #3d82f7
}

.bordertop-primary {
    border-top: 1px solid #3d82f7
}

.borderright-primary {
    border-right: 1px solid #3d82f7
}

.borderbottom-primary {
    border-bottom: 1px solid #3d82f7
}

.borderleft-primary {
    border-left: 1px solid #3d82f7
}

.border-gray-dark {
    border: 1px solid #424242
}

.bordertop-gray-dark {
    border-top: 1px solid #424242
}

.borderright-gray-dark {
    border-right: 1px solid #424242
}

.borderbottom-gray-dark {
    border-bottom: 1px solid #424242
}

.borderleft-gray-dark {
    border-left: 1px solid #424242
}

.border-gray {
    border: 1px solid #dfdfdf
}

.bordertop-gray {
    border-top: 1px solid #dfdfdf
}

.borderright-gray {
    border-right: 1px solid #dfdfdf
}

.borderbottom-gray {
    border-bottom: 1px solid #dfdfdf
}

.borderleft-gray {
    border-left: 1px solid #dfdfdf
}

.border-gray-light {
    border: 1px solid #f3f3f3
}

.bordertop-gray-light {
    border-top: 1px solid #f3f3f3
}

.borderright-gray-light {
    border-right: 1px solid #f3f3f3
}

.borderbottom-gray-light {
    border-bottom: 1px solid #f3f3f3
}

.borderleft-gray-light {
    border-left: 1px solid #f3f3f3
}

.border-black {
    border: 1px solid #fff
}

.bordertop-black {
    border-top: 1px solid #fff
}

.borderright-black {
    border-right: 1px solid #fff
}

.borderbottom-black {
    border-bottom: 1px solid #fff
}

.borderleft-black {
    border-left: 1px solid #fff
}

.mar-no, .mar-0 {
    margin: 0 !important
}

.mary-no, .mary-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important
}

.marx-no, .marx-0 {
    margin-left: 0 !important;
    margin-right: 0 !important
}

.martop-no, .mart-0 {
    margin-top: 0 !important
}

.marright-no, .marr-0 {
    margin-right: 0 !important
}

.marbottom-no, .marb-0 {
    margin-bottom: 0 !important
}

.marleft-no, .marl-0 {
    margin-left: 0 !important
}

.pad-no, .pad-0 {
    padding: 0 !important
}

.pady-no, .pady-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important
}

.padx-no, .padx-0 {
    padding-left: 0 !important;
    padding-right: 0 !important
}

.padtop-no, .padt-0 {
    padding-top: 0 !important
}

.padright-no, .padr-0 {
    padding-right: 0 !important
}

.padbottom-no, .padb-0 {
    padding-bottom: 0 !important
}

.padleft-no, .padl-0 {
    padding-left: 0 !important
}

.pad-1 {
    padding: 10px
}

.pad-2 {
    padding: 20px
}

.pad-3 {
    padding: 30px
}

.pad-4 {
    padding: 40px
}

.pad-5 {
    padding: 50px
}

.pad-6 {
    padding: 60px
}

.pad-7 {
    padding: 70px
}

.pad-8 {
    padding: 80px
}

.pad-9 {
    padding: 90px
}

.padx-1 {
    padding-left: 10px;
    padding-right: 10px
}

.padx-2 {
    padding-left: 20px;
    padding-right: 20px
}

.padx-3 {
    padding-left: 30px;
    padding-right: 30px
}

.padx-4 {
    padding-left: 40px;
    padding-right: 40px
}

.padx-5 {
    padding-left: 50px;
    padding-right: 50px
}

.padx-6 {
    padding-left: 60px;
    padding-right: 60px
}

.padx-7 {
    padding-left: 70px;
    padding-right: 70px
}

.padx-8 {
    padding-left: 80px;
    padding-right: 80px
}

.padx-9 {
    padding-left: 90px;
    padding-right: 90px
}

.padx-10 {
    padding-left: 100px;
    padding-right: 100px
}

.padt-1, .pady-1 {
    padding-top: 10px
}

.padt-2, .pady-2 {
    padding-top: 20px
}

.padt-3, .pady-3 {
    padding-top: 30px
}

.padt-4, .pady-4 {
    padding-top: 40px
}

.padt-5, .pady-5 {
    padding-top: 50px
}

.padt-6, .pady-6 {
    padding-top: 60px
}

.padt-7, .pady-7 {
    padding-top: 70px
}

.padt-8, .pady-8 {
    padding-top: 80px
}

.padt-9, .pady-9 {
    padding-top: 90px
}

.padt-10, .pady-10 {
    padding-top: 100px
}

.padb-1, .pady-1 {
    padding-bottom: 10px
}

.padb-2, .pady-2 {
    padding-bottom: 20px
}

.padb-3, .pady-3 {
    padding-bottom: 30px
}

.padb-4, .pady-4 {
    padding-bottom: 40px
}

.padb-5, .pady-5 {
    padding-bottom: 50px
}

.padb-6, .pady-6 {
    padding-bottom: 60px
}

.padb-7, .pady-7 {
    padding-bottom: 70px
}

.padb-8, .pady-8 {
    padding-bottom: 80px
}

.padb-9, .pady-9 {
    padding-bottom: 90px
}

.padb-10, .pady-10 {
    padding-bottom: 100px
}

.mar-1 {
    margin: 10px
}

.mar-2 {
    margin: 20px
}

.mar-3 {
    margin: 30px
}

.mar-4 {
    margin: 40px
}

.mar-5 {
    margin: 50px
}

.mar-6 {
    margin: 60px
}

.mar-7 {
    margin: 70px
}

.mar-8 {
    margin: 80px
}

.mar-9 {
    margin: 90px
}

.mar-10 {
    margin: 100px
}

.marx-1 {
    margin-left: 10px;
    margin-right: 10px
}

.marx-2 {
    margin-left: 20px;
    margin-right: 20px
}

.marx-3 {
    margin-left: 30px;
    margin-right: 30px
}

.marx-4 {
    margin-left: 40px;
    margin-right: 40px
}

.marx-5 {
    margin-left: 50px;
    margin-right: 50px
}

.marx-6 {
    margin-left: 60px;
    margin-right: 60px
}

.marx-7 {
    margin-left: 70px;
    margin-right: 70px
}

.marx-8 {
    margin-left: 80px;
    margin-right: 80px
}

.marx-9 {
    margin-left: 90px;
    margin-right: 90px
}

.marx-10 {
    margin-left: 100px;
    margin-right: 100px
}

.mary-1 {
    margin-top: 10px;
    margin-bottom: 10px
}

.mary-2 {
    margin-top: 20px;
    margin-bottom: 20px
}

.mary-3 {
    margin-top: 30px;
    margin-bottom: 30px
}

.mary-4 {
    margin-top: 40px;
    margin-bottom: 40px
}

.mary-5 {
    margin-top: 50px;
    margin-bottom: 50px
}

.mary-6 {
    margin-top: 60px;
    margin-bottom: 60px
}

.mary-7 {
    margin-top: 70px;
    margin-bottom: 70px
}

.mary-8 {
    margin-top: 80px;
    margin-bottom: 80px
}

.mary-9 {
    margin-top: 90px;
    margin-bottom: 90px
}

.mary-10 {
    margin-top: 100px;
    margin-bottom: 100px
}

.primary {
    color: #3d82f7
}

.secondary {
    color: #cf3510
}

.gray-light {
    color: #f3f3f3
}

.gray {
    color: #dfdfdf
}

.gray-dark {
    color: #424242
}

.success {
    color: #00AA4A
}

.warning {
    color: #EF8A00
}

.danger {
    color: #f6e5e0
}

.white {
    color: #ffffff
}

.black {
    color: #000000
}

.bg-primary {
    background-color: #3d82f7
}

.bg-secondary {
    background-color: #cf3510
}

.bg-gray-light {
    background-color: #f3f3f3
}

.bg-gray {
    background-color: #dfdfdf
}

.bg-gray-dark {
    background-color: #424242
}

.bg-success {
    background-color: #00AA4A
}

.bg-warning {
    background-color: #EF8A00
}

.bg-danger {
    background-color: #f6e5e0
}

.bg-white {
    background-color: #ffffff
}

.bg-black {
    background-color: #000000
}

.flashes {
    position: absolute;
    width: 440px;
    left: 50%;
    top: 68px;
    margin-left: -220px;
    z-index: 1000
}

.message {
    color: #ffffff;
    background-color: #3d82f7;
    padding: 20px 20px;
    font-weight: bold
}

    .message.success {
        background-color: #00AA4A
    }

    .message.warning {
        background-color: #EF8A00
    }

    .message.error {
        background-color: #f6e5e0
    }

.highlight {
    margin: 20px 0
}

.language-html .nt {
    color: #EF8A00
}

.language-html .na {
    color: #00AA4A
}

.language-html .s {
    color: #f6e5e0
}

.language-html .c {
    color: #424242;
    font-style: italic
}

html {
    background-color: transparent;
    background-image: url("img/bg.jpg");
    background-position: top center;
    background-size: contain;
    background-repeat: no-repeat;
    background-repeat: no-repeat;
    background-attachment: fixed
}

    html.clean-sky {
        background: #fff !important
    }

body {
    background-color: transparent;
    background: -moz-linear-gradient(top, rgba(231,231,231,0.65) 0%, transparent 100%);
    background: -webkit-linear-gradient(top, rgba(231,231,231,0.65) 0%, transparent 100%);
    background: linear-gradient(to bottom, rgba(231,231,231,0.65) 0%, transparent 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aee7e7e7', endColorstr='#00ffffff',GradientType=0 )
}

IE6-9 body.clean-sky {
    background: #fff !important
}

h1 {
    font-family: 'robotolight', sans-serif
}

input[type="radio"], input[type="checkbox"] {
    margin: 0
}

#navbar-top, #navbar-top-small {
    position: relative
}

    #navbar-top .nav a, #navbar-top-small .nav a {
        margin: 0 15px 0 0
    }

    #navbar-top .title, #navbar-top-small .title {
        margin-left: 85px;
        position: absolute
    }

    #navbar-top .title, #navbar-top-small .title, .logo {
        font-size: 24px;
        height: 72px;
        padding-top: 36px;
        padding-right: 15px;
        padding-bottom: 12px;
        padding-left: 100px;
        margin: 0;
        white-space: nowrap;
        color: #212121;
        font-family: "OpenSans",sans-serif;
        line-height: 24px
    }

        #navbar-top .title:before, #navbar-top-small .title:before, .logo:before {
            position: absolute;
            display: inline-block;
            width: 66px;
            height: 66px;
            content: ' ';
            background: url("img/du-logo.png");
            background-size: 66px 66px;
            background-repeat: no-repeat;
            margin-left: -85px;
            margin-top: -9px
        }

        #navbar-top .title:after, #navbar-top-small .title:after, .logo:after {
            /*content: "Save to my drive";*/
            position: absolute;
            color: #3d82f7;
            font-size: 17px;
            font-weight: normal;
            margin-left: -132px;
            margin-top: 22px
        }

        #navbar-top .title:hover, #navbar-top-small .title:hover, .logo:hover {
            color: #212121;
            text-decoration: none
        }

.footer .social a {
    font-size: 20px;
    vertical-align: bottom;
    color: #898989
}

    .footer .social a:hover {
        color: #434343
    }

.footer-tiny {
    position: fixed;
    width: 400px;
    text-align: center;
    left: 50%;
    margin-left: -200px;
    bottom: 0;
    background-color: #fff;
    padding-top: 7px
}

.btn-login {
    border: 2px solid #bdbdbd;
    width: 110px;
    text-align: center;
    border-radius: 5px;
    padding: 11px 2px 10px 2px !important;
    margin: 28px 0 0 0 !important;
    text-transform: uppercase;
    font-size: 12px !important
}

.btn-logout {
    border: 2px solid #bdbdbd;
    width: 110px;
    text-align: center;
    border-radius: 5px;
    text-transform: uppercase;
    font-size: 12px !important;
    font-weight: bold;
    padding: 7px 12px !important;
    display: block
}

    .btn-logout:hover {
        text-decoration: none !important
    }

.hp-title {
    font-size: 50px
}

.hp-bg {
    min-height: 500px
}

.lbl-username {
    color: #3d82f7 !important
}

.hp-wrap {
    top: 20%;
    position: absolute;
    width: 890px;
    left: 50%;
    margin-left: -445px
}

.gd-logo {
    width: 348px;
    height: 116px
}

@media (max-width: 890px) {
    .hp-wrap {
        left: 20px;
        right: 20px;
        margin-left: 0;
        width: auto
    }

        .hp-wrap p.big {
            font-size: 14px
        }

    .hp-title {
        font-size: 32px;
        margin: 20px 0 !important
    }

    .gd-logo {
        width: 174px;
        height: 58px
    }
}

.border-0 {
    border: none !important
}

.size-keeper {
    color: transparent;
    position: relative;
    visibility: hidden
}

.size-receiver {
    position: absolute;
    visibility: visible;
    left: 0
}

.caret {
    border-right: 3px solid #3d82f7;
    animation: caret-anim 0.9s infinite steps(1)
}

@keyframes caret-anim {
    0% {
        border-color: #3d82f7
    }

    50% {
        border-color: transparent
    }

    100% {
        border-color: #3d82f7
    }
}

.btn-large {
    padding: 16px 36px;
    font-size: 13px;
    font-weight: bold;
    border-radius: 4px
}

.icon.feature {
    font-size: 38px;
    margin: 0 20px 0 0;
    margin-bottom: -1px;
    line-height: 38px;
    vertical-align: text-bottom
}

.step-1, .step-2, .step-3, .step-4 {
    border-top: 1px solid #e5e5e5
}

.row-dynamic {
    text-align: center;
    padding: 100px
}

    .row-dynamic p {
        color: #757575
    }

    .row-dynamic div img {
        width: 50%
    }

    .row-dynamic .step-num {
        color: #3d82f7;
        font-size: 28px;
        background: #ececec;
        width: 72px;
        height: 72px;
        line-height: 70px;
        vertical-align: middle;
        text-align: center;
        border: 1px solid #e5e5e5;
        border-radius: 50%;
        margin: 0 auto;
        margin-top: -54px
    }

@media (max-width: 600px) {
    .row-dynamic {
        padding: 100px 20px
    }
}

.schroller {
    position: fixed;
    right: 120px;
    bottom: 40px;
    width: 40px;
    height: 40px;
    background: #3d82f7;
    font-family: 'icons';
    color: #fff;
    font-size: 32px;
    line-height: 40px;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    border-radius: 4px
}

    .schroller:hover {
        background: #6ea2f9
    }

.pricing table {
    background: rgba(255,255,255,0.4)
}

    .pricing table td {
        vertical-align: middle;
        line-height: 28px
    }

        .pricing table td:first-child {
            color: #898989;
            text-align: left
        }

    .pricing table thead, .pricing table tfoot {
        background: transparent
    }

        .pricing table thead tr td, .pricing table tfoot tr td {
            font-family: "OpenSans",sans-serif;
            font-size: 24px;
            font-weight: 400
        }

    .pricing table tfoot {
        background: #fafafa
    }

        .pricing table tfoot tr td {
            font-size: 16px;
            font-weight: bold
        }

.pricing .btn-stroke {
    border-color: #bdbdbd;
    line-height: 1.4
}

.uploader-detail .social a {
    font-size: 40px
}

.api .anim {
    width: 725px;
    height: auto;
    max-width: 100%
}

.api pre {
    background-color: #f7f7f7;
    color: #37474f;
    padding: 20px;
    margin: 20px 0;
    font-weight: normal
}

    .api pre .comment {
        color: #d81b60
    }

    .api pre .tag {
        color: #3b78e7
    }

    .api pre .attr {
        color: #9c27b0
    }

    .api pre .value {
        color: #0d904f
    }

    .api pre .num {
        color: #c53929
    }

.api code {
    background-color: #f7f7f7;
    color: #37474f;
    font-weight: normal;
    white-space: nowrap
}

.faq h3 {
    line-height: 1.3em;
    padding-top: 10px
}

.lbl {
    font-size: 10px;
    vertical-align: top;
    background: #bcbcbc;
    color: #fff;
    border-radius: 3px;
    padding: 2px 7px;
    font-weight: bold;
    font-family: "OpenSans",sans-serif
}

    .lbl.primary {
        background: #3d82f7
    }

    .lbl.secondary {
        background: #cf3510
    }

.inputlike {
    display: inline-block;
    padding: 2px;
    color: #898989;
    background: #fff;
    border: 1px solid #898989;
    margin: 0 10px;
    border-radius: 3px
}

.ads-2 {
    width: 100%
}

    .ads-2 .adsbygoogle {
        float: left;
        width: 50%
    }

.ads-3 {
    width: 100%
}

    .ads-3 .adsbygoogle {
        float: left;
        width: 33.33%
    }

.branding-logo {
    max-width: 100%
}

.du-wrap {
    background: #fff
}

.toggle {
    position: absolute;
    margin-left: -9999px;
    visibility: hidden
}

    .toggle + label {
        display: block;
        position: relative;
        cursor: pointer;
        outline: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }

input.toggle-round + label {
    padding: 2px;
    width: 40px;
    height: 20px;
    background-color: #dddddd;
    border-radius: 20px
}

    input.toggle-round + label:before, input.toggle-round + label:after {
        display: block;
        position: absolute;
        top: 1px;
        left: 1px;
        bottom: 1px;
        content: ""
    }

    input.toggle-round + label:before {
        right: 1px;
        background-color: #f1f1f1;
        border-radius: 20px;
        transition: background 0.4s
    }

    input.toggle-round + label:after {
        width: 19px;
        background-color: #fff;
        border-radius: 100%;
        box-shadow: 0 2px 5px rgba(0,0,0,0.3);
        transition: margin 0.4s
    }

input.toggle-round:checked + label:before {
    background-color: #3d82f7
}

input.toggle-round:checked + label:after {
    margin-left: 20px
}

.tabs .tabs-content {
    min-height: 320px
}

.switch {
    vertical-align: text-bottom
}

    .switch + label {
        display: inline-block;
        line-height: 20px;
        vertical-align: text-bottom
    }

.box-semi {
    background: rgba(255,255,255,0.4) !important;
    border: 1px solid #dfdfdf;
    border-top: none;
    padding: 30px
}

    .box-semi h2 {
        padding: 0;
        margin: 0 0 30px 0;
        color: #898989
    }

        .box-semi h2 a:hover {
            text-decoration: none
        }

    .box-semi.bg-gray h2, .box-semi.bg-gray a {
        color: #898989
    }

    .box-semi p:last-child {
        margin-bottom: 0
    }

.link-action {
    font-size: 16px;
    color: #898989
}

    .link-action span {
        vertical-align: bottom;
        margin: 0 3px
    }

.bg-semiwhite {
    background: rgba(255,255,255,0.4) !important
}

.bg-gray {
    background-color: #f0f0f0 !important
}

.bg-free {
    background: #d7e5fd
}

.bg-plus {
    background: #9dbffa
}

.bg-pro {
    background: #77a7f9
}

.color-free {
    color: #d7e5fd
}

.color-plus {
    color: #9dbffa
}

.color-pro {
    color: #77a7f9
}

.color-danger {
    color: #e87e74
}

.bg-danger {
    border: 1px solid #eccabf;
    color: #424242;
    margin-top: -1px;
    padding-left: 55px
}

    .bg-danger a, .bg-danger span {
        color: #e87e74
    }

        .bg-danger span.icon {
            position: absolute;
            margin-left: -40px;
            margin-top: -10px;
            font-size: 28px
        }

.icon.check {
    color: #00AA4A;
    font-size: 32px
}

.bordertop-gray {
    border-top: 1px solid #dfdfdf
}

.padx-8-desktop {
    padding-left: 80px;
    padding-right: 80px
}

.width-50-desktop {
    width: 50%
}

@media (max-width: 600px) {
    .padx-8-desktop {
        padding-left: 0;
        padding-right: 0
    }

    .width-50-desktop {
        width: 100%
    }
}

.ellipsis {
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis
}

@media (max-width: 768px) {
    .footer p {
        font-size: 10px
    }

    .footer .social a {
        font-size: 16px
    }
}