@charset "UTF-8";

.h5, body, p {
    font-size: 14px
}

.block img, img {
    /*max-width: 100%;*/
}

@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 100;
    src: url(../fonts/roboto/roboto-v16-latin-100.eot);
    src: local("Roboto Thin"),local(Roboto-Thin),url(../fonts/roboto/roboto-v16-latin-100.eot?#iefix) format("embedded-opentype"),url(../fonts/roboto/roboto-v16-latin-100.woff2) format("woff2"),url(../fonts/roboto/roboto-v16-latin-100.woff) format("woff"),url(../fonts/roboto/roboto-v16-latin-100.ttf) format("truetype"),url(../fonts/roboto/roboto-v16-latin-100.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: italic;
    font-weight: 100;
    src: url(../fonts/roboto/roboto-v16-latin-100italic.eot);
    src: local("Roboto Thin Italic"),local(Roboto-ThinItalic),url(../fonts/roboto/roboto-v16-latin-100italic.eot?#iefix) format("embedded-opentype"),url(../fonts/roboto/roboto-v16-latin-100italic.woff2) format("woff2"),url(../fonts/roboto/roboto-v16-latin-100italic.woff) format("woff"),url(../fonts/roboto/roboto-v16-latin-100italic.ttf) format("truetype"),url(../fonts/roboto/roboto-v16-latin-100italic.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 300;
    src: url(../fonts/roboto/roboto-v16-latin-300.eot);
    src: local("Roboto Light"),local(Roboto-Light),url(../fonts/roboto/roboto-v16-latin-300.eot?#iefix) format("embedded-opentype"),url(../fonts/roboto/roboto-v16-latin-300.woff2) format("woff2"),url(../fonts/roboto/roboto-v16-latin-300.woff) format("woff"),url(../fonts/roboto/roboto-v16-latin-300.ttf) format("truetype"),url(../fonts/roboto/roboto-v16-latin-300.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: italic;
    font-weight: 300;
    src: url(../fonts/roboto/roboto-v16-latin-300italic.eot);
    src: local("Roboto Light Italic"),local(Roboto-LightItalic),url(../fonts/roboto/roboto-v16-latin-300italic.eot?#iefix) format("embedded-opentype"),url(../fonts/roboto/roboto-v16-latin-300italic.woff2) format("woff2"),url(../fonts/roboto/roboto-v16-latin-300italic.woff) format("woff"),url(../fonts/roboto/roboto-v16-latin-300italic.ttf) format("truetype"),url(../fonts/roboto/roboto-v16-latin-300italic.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/roboto/roboto-v16-latin-regular.eot);
    src: local(Roboto),local(Roboto-Regular),url(../fonts/roboto/roboto-v16-latin-regular.eot?#iefix) format("embedded-opentype"),url(../fonts/roboto/roboto-v16-latin-regular.woff2) format("woff2"),url(../fonts/roboto/roboto-v16-latin-regular.woff) format("woff"),url(../fonts/roboto/roboto-v16-latin-regular.ttf) format("truetype"),url(../fonts/roboto/roboto-v16-latin-regular.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: italic;
    font-weight: 400;
    src: url(../fonts/roboto/roboto-v16-latin-italic.eot);
    src: local("Roboto Italic"),local(Roboto-Italic),url(../fonts/roboto/roboto-v16-latin-italic.eot?#iefix) format("embedded-opentype"),url(../fonts/roboto/roboto-v16-latin-italic.woff2) format("woff2"),url(../fonts/roboto/roboto-v16-latin-italic.woff) format("woff"),url(../fonts/roboto/roboto-v16-latin-italic.ttf) format("truetype"),url(../fonts/roboto/roboto-v16-latin-italic.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 500;
    src: url(../fonts/roboto/roboto-v16-latin-500.eot);
    src: local("Roboto Medium"),local(Roboto-Medium),url(../fonts/roboto/roboto-v16-latin-500.eot?#iefix) format("embedded-opentype"),url(../fonts/roboto/roboto-v16-latin-500.woff2) format("woff2"),url(../fonts/roboto/roboto-v16-latin-500.woff) format("woff"),url(../fonts/roboto/roboto-v16-latin-500.ttf) format("truetype"),url(../fonts/roboto/roboto-v16-latin-500.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: italic;
    font-weight: 500;
    src: url(../fonts/roboto/roboto-v16-latin-500italic.eot);
    src: local("Roboto Medium Italic"),local(Roboto-MediumItalic),url(../fonts/roboto/roboto-v16-latin-500italic.eot?#iefix) format("embedded-opentype"),url(../fonts/roboto/roboto-v16-latin-500italic.woff2) format("woff2"),url(../fonts/roboto/roboto-v16-latin-500italic.woff) format("woff"),url(../fonts/roboto/roboto-v16-latin-500italic.ttf) format("truetype"),url(../fonts/roboto/roboto-v16-latin-500italic.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 700;
    src: url(../fonts/roboto/roboto-v16-latin-700.eot);
    src: local("Roboto Bold"),local(Roboto-Bold),url(../fonts/roboto/roboto-v16-latin-700.eot?#iefix) format("embedded-opentype"),url(../fonts/roboto/roboto-v16-latin-700.woff2) format("woff2"),url(../fonts/roboto/roboto-v16-latin-700.woff) format("woff"),url(../fonts/roboto/roboto-v16-latin-700.ttf) format("truetype"),url(../fonts/roboto/roboto-v16-latin-700.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: italic;
    font-weight: 700;
    src: url(../fonts/roboto/roboto-v16-latin-700italic.eot);
    src: local("Roboto Bold Italic"),local(Roboto-BoldItalic),url(../fonts/roboto/roboto-v16-latin-700italic.eot?#iefix) format("embedded-opentype"),url(../fonts/roboto/roboto-v16-latin-700italic.woff2) format("woff2"),url(../fonts/roboto/roboto-v16-latin-700italic.woff) format("woff"),url(../fonts/roboto/roboto-v16-latin-700italic.ttf) format("truetype"),url(../fonts/roboto/roboto-v16-latin-700italic.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 900;
    src: url(../fonts/roboto/roboto-v16-latin-900.eot);
    src: local("Roboto Black"),local(Roboto-Black),url(../fonts/roboto/roboto-v16-latin-900.eot?#iefix) format("embedded-opentype"),url(../fonts/roboto/roboto-v16-latin-900.woff2) format("woff2"),url(../fonts/roboto/roboto-v16-latin-900.woff) format("woff"),url(../fonts/roboto/roboto-v16-latin-900.ttf) format("truetype"),url(../fonts/roboto/roboto-v16-latin-900.svg#Roboto) format("svg")
}

@font-face {
    font-family: Roboto;
    font-style: italic;
    font-weight: 900;
    src: url(../fonts/roboto/roboto-v16-latin-900italic.eot);
    src: local("Roboto Black Italic"),local(Roboto-BlackItalic),url(../fonts/roboto/roboto-v16-latin-900italic.eot?#iefix) format("embedded-opentype"),url(../fonts/roboto/roboto-v16-latin-900italic.woff2) format("woff2"),url(../fonts/roboto/roboto-v16-latin-900italic.woff) format("woff"),url(../fonts/roboto/roboto-v16-latin-900italic.ttf) format("truetype"),url(../fonts/roboto/roboto-v16-latin-900italic.svg#Roboto) format("svg")
}

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

@media (max-width: 1031px) {
    .responsive, .responsive .text-left, .responsive .text-right, .responsive a, .responsive h1, .responsive h2, .responsive h3, .responsive img, .responsive p {
        text-align: center !important
    }
}

@media (max-width: 420px) {
    .responsive-phone {
        text-align: center
    }
}

body {
    color: #5e686f;
    font-family: Roboto,sans-serif,serif;
    height: 100%;
    line-height: 1.5;
    font-weight: 300;
    letter-spacing: .2px;
    padding-right: 0 !important
}

a {
    color: #557CB5
}

    a:active, a:focus, a:hover {
        outline: 0;
        text-decoration: none;
        color: #557CB5
    }

h1, h2, h3, h4, h5, h6 {
    color: #606676;
    font-weight: 300;
    font-family: Roboto,sans-serif
}

.h5 {
    font-weight: 400;
    letter-spacing: 4px;
    text-transform: uppercase
}

.section-title, p, ul li {
    font-weight: 300
}

p {
    letter-spacing: .2px;
    line-height: 25px
}

ul li {
    list-style: none
}

    ul li i {
        padding-right: 15px
    }

header h2 {
    line-height: 60px
}

.overflow-hide {
    overflow: hidden
}

.section-heading {
    text-align: center;
    padding-bottom: 40px
}

.section-title {
    color: #43484d
}

@media (min-width: 1031px) {
    .section-title {
        font-size: 52px
    }

    .enable-offcanvas #paper-offcanvas, .enable-offcanvas .paper-nav-toggle {
        display: block
    }
}

.section-subtitle {
    font-size: 22px;
    font-weight: 100;
    line-height: 32px;
    color: #5e6977;
    margin: 20px auto 40px
}

.page .page-header, .page .search-section {
    padding: 30px
}

    .page .page-header h1, .page .search-section h1 {
        font-size: 28px
    }

        .page .page-header h1 small, .page .search-section h1 small {
            background: #557CB5;
            color: #fff;
            font-size: 14px;
            font-weight: 300;
            padding: 3px 10px;
            vertical-align: middle
        }

#page_wrap {
    height: 100%;
    overflow-x: hidden;
    position: relative;
    transition: all .5s ease 0;
    width: 100%
}

.offcanvas #page_wrap {
    overflow: hidden;
    position: absolute
}

    .offcanvas #page_wrap::after {
        background: rgba(245,248,250,.7);
        bottom: 0;
        content: "";
        left: 0;
        position: absolute;
        right: 0;
        top: 0;
        transition: all 2s ease 0;
        z-index: 101
    }

.block {
    font-size: 14px
}

    .block img {
        border-radius: 3px;
        margin: 15px 0 20px
    }

.service-sidebar.sidebar-wrapper {
    background-color: #f9f9fb;
    border-radius: 5px;
    margin-bottom: 35px;
    padding: 20px
}

    .service-sidebar.sidebar-wrapper h2 {
        font-size: 24px;
        font-weight: 400;
        line-height: 36px;
        padding-bottom: 0;
        text-transform: capitalize
    }

.paper-block {
    padding: 15px;
    border: 3px solid #f5f8fa;
    border-radius: 3px;
    margin-bottom: 30px
}

.lSAction > .lSNext {
    right: 15px
}

.lSPager {
    margin-top: 30px !important
}

ul {
    padding: 0
}

    ul.iconList li {
        line-height: 3;
        padding-left: 30px;
        position: relative
    }

        ul.iconList li:before {
            color: #557CB5;
            content: "";
            display: inline-block;
            font-family: phpkbIcons
        }

    ul.arrowIcon li:before {
        content: ""
    }

    ul li:before {
        position: absolute;
        left: 0;
        top: 0
    }

@media (min-width: 1400px) {
    .inside {
        margin: 0 auto;
        background: #fff;
        width: 80%
    }
}

.section-heading-icon {
    padding-top: 84px;
    background: url(../img/icon/icon-stone1.png) center bottom no-repeat
}

.card-header {
    position: relative
}

    .card-header .card-handle {
        position: absolute;
        right: 20px
    }

.section {
    padding: 50px 0
}

    .section header {
        padding-bottom: 50px
    }

        .section header h1 {
            text-transform: uppercase
        }

.search-section {
    /*background-color: #0E3266;*/
    position: relative;
    background: url(../images/header-splash.jpg);
    background-size: cover;
    /*border-bottom: 1px solid #e1e8ee;
    border-top: 1px solid #e1e8ee;*/
}

.masthead {
    display: table-cell;
    vertical-align: middle;
    width: 1%;
    padding: 100px 0 20px;
    text-align: center
}

    .masthead h1 {
        color: #fff;
        font-weight: 700;
        font-size: 60px
    }

@media (max-width: 1031px) {
    .masthead h1 {
        font-size: 40px
    }
}

.masthead p {
    color: #5e686f;
    font-weight: 100;
    margin: 0 auto;
    padding-bottom: 15px;
    padding-top: 30px;
    text-align: center;
    width: 70%
}

@media (min-width: 1031px) {
    .masthead p {
        font-size: 22px
    }
}

.masthead form {
    position: relative;
    margin-top: 10px
}

    .masthead form button {
        position: absolute;
        right: 25px;
        top: 25px;
        background: 0 0;
        border: none;
        font-size: 30px;
        color: #5e686f
    }

.masthead .btn-hero {
    border: 3px solid #fff;
    color: #fff;
    border-radius: 5px;
    padding: 10px 20px;
    margin-top: 50px
}

    .masthead .btn-hero:hover {
        background: rgba(255,255,255,.2);
        -webkit-transition: background-color .5s ease-out .2s;
        -moz-transition: background-color .5s ease-out .2s;
        -o-transition: background-color .5s ease-out .2s;
        transition: background-color .5s ease-out .2s
    }

.section {
    margin-top: 80px;
    margin-bottom: 80px
}

    .section header {
        text-align: center;
        padding: 40px
    }

.template-genre .overlay {
    background: rgba(2,28,53,.9);
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.search-field {
    width: 100%;
    font-size: 18px;
    border-radius: 30px;
    border: 2px solid #e1e8ee;
    padding: 0 30px;
    margin-top: 20px;
    margin-bottom: 5px;
    height: 60px;
    outline: 0
}

#app {
    -webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -ms-transition: opacity 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out
}

.loaded {
    overflow: visible
}

.loader-fade {
    display: none
}

#nprogress {
    pointer-events: none
}

    #nprogress .bar {
        background: #557CB5;
        position: fixed;
        z-index: 9999;
        top: 0;
        left: 0;
        width: 100%;
        height: 2px
    }

    #nprogress .peg {
        display: block;
        position: absolute;
        right: 0;
        width: 100px;
        height: 100%;
        box-shadow: 0 0 10px #557CB5,0 0 5px #557CB5;
        opacity: 1;
        -webkit-transform: rotate(3deg) translate(0,-4px);
        -ms-transform: rotate(3deg) translate(0,-4px);
        transform: rotate(3deg) translate(0,-4px)
    }

    #nprogress .spinner {
        display: block;
        position: fixed;
        z-index: 9999;
        top: 15px;
        right: 15px
    }

    #nprogress .spinner-icon {
        width: 18px;
        height: 18px;
        box-sizing: border-box;
        border: 2px solid transparent;
        border-top-color: #557CB5;
        border-left-color: #557CB5;
        border-radius: 50%;
        -webkit-animation: nprogress-spinner .4s linear infinite;
        animation: nprogress-spinner .4s linear infinite
    }

.nprogress-custom-parent {
    overflow: hidden;
    position: relative
}

    .nprogress-custom-parent #nprogress .bar, .nprogress-custom-parent #nprogress .spinner {
        position: absolute
    }

@-webkit-keyframes nprogress-spinner {
    0% {
        -webkit-transform: rotate(0)
    }

    100% {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes nprogress-spinner {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(360deg)
    }
}

.dl-menuwrapper {
    width: 100%;
    max-width: 300px;
    float: left;
    -webkit-perspective: 1000px;
    perspective: 1000px;
    -webkit-perspective-origin: 50% 200%;
    perspective-origin: 50% 200%
}

    .dl-menuwrapper:first-child {
        margin-top: 25px
    }

    .dl-menuwrapper button {
        border: none;
        width: 48px;
        height: 45px;
        text-indent: -900em;
        overflow: hidden;
        position: relative;
        cursor: pointer;
        outline: 0
    }

        .dl-menuwrapper button:after {
            content: '';
            position: absolute;
            width: 68%;
            height: 5px;
            background: #fff;
            top: 10px;
            left: 16%;
            box-shadow: 0 10px 0 #fff,0 20px 0 #fff
        }

    .dl-menuwrapper ul {
        padding: 0;
        list-style: none;
        -webkit-transform-style: preserve-3d;
        transform-style: preserve-3d
    }

    .dl-menuwrapper li {
        position: relative
    }

        .dl-menuwrapper li a {
            display: block;
            position: relative;
            padding: 15px 20px;
            font-size: 13px;
            line-height: 20px;
            font-weight: 300;
            color: #fff;
            outline: 0
        }

.no-touch .dl-menuwrapper li a:hover {
    background: rgba(255,248,213,.1)
}

.dl-menuwrapper li.dl-back > a {
    padding-left: 30px;
    background: #f5f8fa
}

.dl-menuwrapper li.dl-back:after, .dl-menuwrapper li > a: not(: only-child):after {
    position: absolute;
    top: 0;
    line-height: 50px;
    font-family: phpkbIcons;
    speak: none;
    -webkit-font-smoothing: antialiased;
    content: "";
    font-size: 18px;
    right: 22px
}

.dl-menuwrapper li.dl-back:after {
    left: 10px;
    color: rgba(212,204,198,.6);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.dl-menuwrapper li > a:after {
    right: 10px;
    color: rgba(0,0,0,.15)
}

.dl-menuwrapper .dl-menu {
    margin: 0;
    position: absolute;
    width: 100%;
    opacity: 0;
    pointer-events: none;
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

    .dl-menuwrapper .dl-menu.dl-menu-toggle {
        transition: all .3s ease
    }

    .dl-menuwrapper .dl-menu.dl-menuopen {
        opacity: 1;
        pointer-events: auto;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    .dl-menuwrapper .dl-menu.dl-subview li, .dl-menuwrapper .dl-menu.dl-subview li.dl-subview > a, .dl-menuwrapper .dl-menu.dl-subview li.dl-subviewopen > a, .dl-menuwrapper li .dl-submenu {
        display: none
    }

        .dl-menuwrapper .dl-menu.dl-subview li.dl-subview, .dl-menuwrapper .dl-menu.dl-subview li.dl-subview .dl-submenu, .dl-menuwrapper .dl-menu.dl-subview li.dl-subviewopen, .dl-menuwrapper .dl-menu.dl-subview li.dl-subviewopen > .dl-submenu, .dl-menuwrapper .dl-menu.dl-subview li.dl-subviewopen > .dl-submenu > li, .no-js .dl-menuwrapper li .dl-submenu {
            display: block
        }

.dl-menuwrapper > .dl-submenu {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    margin: 0
}

.dl-menuwrapper .dl-menu.dl-animate-out-1 {
    -webkit-animation: MenuAnimOut1 .4s;
    animation: MenuAnimOut1 .4s
}

.dl-menuwrapper .dl-menu.dl-animate-out-2 {
    -webkit-animation: MenuAnimOut2 .3s ease-in-out;
    animation: MenuAnimOut2 .3s ease-in-out
}

.dl-menuwrapper .dl-menu.dl-animate-out-3 {
    -webkit-animation: MenuAnimOut3 .4s ease;
    animation: MenuAnimOut3 .4s ease
}

.dl-menuwrapper .dl-menu.dl-animate-out-4 {
    -webkit-animation: MenuAnimOut4 .4s ease;
    animation: MenuAnimOut4 .4s ease
}

.dl-menuwrapper .dl-menu.dl-animate-out-5 {
    -webkit-animation: MenuAnimOut5 .4s ease;
    animation: MenuAnimOut5 .4s ease
}

@-webkit-keyframes MenuAnimOut1 {
    50% {
        -webkit-transform: translateZ(-250px) rotateY(30deg)
    }

    75% {
        -webkit-transform: translateZ(-372.5px) rotateY(15deg);
        opacity: .5
    }

    100% {
        -webkit-transform: translateZ(-500px) rotateY(0);
        opacity: 0
    }
}

@-webkit-keyframes MenuAnimOut2 {
    100% {
        -webkit-transform: translateX(-100%);
        opacity: 0
    }
}

@-webkit-keyframes MenuAnimOut3 {
    100% {
        -webkit-transform: translateZ(300px);
        opacity: 0
    }
}

@-webkit-keyframes MenuAnimOut4 {
    100% {
        -webkit-transform: translateZ(-300px);
        opacity: 0
    }
}

@-webkit-keyframes MenuAnimOut5 {
    100% {
        -webkit-transform: translateY(40%);
        opacity: 0
    }
}

@keyframes MenuAnimOut1 {
    50% {
        -webkit-transform: translateZ(-250px) rotateY(30deg);
        transform: translateZ(-250px) rotateY(30deg)
    }

    75% {
        -webkit-transform: translateZ(-372.5px) rotateY(15deg);
        transform: translateZ(-372.5px) rotateY(15deg);
        opacity: .5
    }

    100% {
        -webkit-transform: translateZ(-500px) rotateY(0);
        transform: translateZ(-500px) rotateY(0);
        opacity: 0
    }
}

@keyframes MenuAnimOut2 {
    100% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        opacity: 0
    }
}

@keyframes MenuAnimOut3 {
    100% {
        -webkit-transform: translateZ(300px);
        transform: translateZ(300px);
        opacity: 0
    }
}

@keyframes MenuAnimOut4 {
    100% {
        -webkit-transform: translateZ(-300px);
        transform: translateZ(-300px);
        opacity: 0
    }
}

@keyframes MenuAnimOut5 {
    100% {
        -webkit-transform: translateY(40%);
        transform: translateY(40%);
        opacity: 0
    }
}

.dl-menuwrapper .dl-menu.dl-animate-in-1 {
    -webkit-animation: MenuAnimIn1 .3s;
    animation: MenuAnimIn1 .3s
}

.dl-menuwrapper .dl-menu.dl-animate-in-2 {
    -webkit-animation: MenuAnimIn2 .3s ease-in-out;
    animation: MenuAnimIn2 .3s ease-in-out
}

.dl-menuwrapper .dl-menu.dl-animate-in-3 {
    -webkit-animation: MenuAnimIn3 .4s ease;
    animation: MenuAnimIn3 .4s ease
}

.dl-menuwrapper .dl-menu.dl-animate-in-4 {
    -webkit-animation: MenuAnimIn4 .4s ease;
    animation: MenuAnimIn4 .4s ease
}

.dl-menuwrapper .dl-menu.dl-animate-in-5 {
    -webkit-animation: MenuAnimIn5 .4s ease;
    animation: MenuAnimIn5 .4s ease
}

@-webkit-keyframes MenuAnimIn1 {
    0% {
        -webkit-transform: translateZ(-500px) rotateY(0);
        opacity: 0
    }

    20% {
        -webkit-transform: translateZ(-250px) rotateY(30deg);
        opacity: .5
    }

    100% {
        -webkit-transform: translateZ(0) rotateY(0);
        opacity: 1
    }
}

@-webkit-keyframes MenuAnimIn2 {
    0% {
        -webkit-transform: translateX(-100%);
        opacity: 0
    }

    100% {
        -webkit-transform: translateX(0);
        opacity: 1
    }
}

@-webkit-keyframes MenuAnimIn3 {
    0% {
        -webkit-transform: translateZ(300px);
        opacity: 0
    }

    100% {
        -webkit-transform: translateZ(0);
        opacity: 1
    }
}

@-webkit-keyframes MenuAnimIn4 {
    0% {
        -webkit-transform: translateZ(-300px);
        opacity: 0
    }

    100% {
        -webkit-transform: translateZ(0);
        opacity: 1
    }
}

@-webkit-keyframes MenuAnimIn5 {
    0% {
        -webkit-transform: translateY(40%);
        opacity: 0
    }

    100% {
        -webkit-transform: translateY(0);
        opacity: 1
    }
}

@keyframes MenuAnimIn1 {
    0% {
        -webkit-transform: translateZ(-500px) rotateY(0);
        transform: translateZ(-500px) rotateY(0);
        opacity: 0
    }

    20% {
        -webkit-transform: translateZ(-250px) rotateY(30deg);
        transform: translateZ(-250px) rotateY(30deg);
        opacity: .5
    }

    100% {
        -webkit-transform: translateZ(0) rotateY(0);
        transform: translateZ(0) rotateY(0);
        opacity: 1
    }
}

@keyframes MenuAnimIn2 {
    0% {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
        opacity: 0
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1
    }
}

@keyframes MenuAnimIn3 {
    0% {
        -webkit-transform: translateZ(300px);
        transform: translateZ(300px);
        opacity: 0
    }

    100% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }
}

@keyframes MenuAnimIn4 {
    0% {
        -webkit-transform: translateZ(-300px);
        transform: translateZ(-300px);
        opacity: 0
    }

    100% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }
}

@keyframes MenuAnimIn5 {
    0% {
        -webkit-transform: translateY(40%);
        transform: translateY(40%);
        opacity: 0
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}

.dl-menuwrapper > .dl-submenu.dl-animate-in-1 {
    -webkit-animation: SubMenuAnimIn1 .4s ease;
    animation: SubMenuAnimIn1 .4s ease
}

.dl-menuwrapper > .dl-submenu.dl-animate-in-2 {
    -webkit-animation: SubMenuAnimIn2 .3s ease-in-out;
    animation: SubMenuAnimIn2 .3s ease-in-out
}

.dl-menuwrapper > .dl-submenu.dl-animate-in-3 {
    -webkit-animation: SubMenuAnimIn3 .4s ease;
    animation: SubMenuAnimIn3 .4s ease
}

.dl-menuwrapper > .dl-submenu.dl-animate-in-4 {
    -webkit-animation: SubMenuAnimIn4 .4s ease;
    animation: SubMenuAnimIn4 .4s ease
}

.dl-menuwrapper > .dl-submenu.dl-animate-in-5 {
    -webkit-animation: SubMenuAnimIn5 .4s ease;
    animation: SubMenuAnimIn5 .4s ease
}

@-webkit-keyframes SubMenuAnimIn1 {
    0% {
        -webkit-transform: translateX(50%);
        opacity: 0
    }

    100% {
        -webkit-transform: translateX(0);
        opacity: 1
    }
}

@-webkit-keyframes SubMenuAnimIn2 {
    0% {
        -webkit-transform: translateX(100%);
        opacity: 0
    }

    100% {
        -webkit-transform: translateX(0);
        opacity: 1
    }
}

@-webkit-keyframes SubMenuAnimIn3 {
    0% {
        -webkit-transform: translateZ(-300px);
        opacity: 0
    }

    100% {
        -webkit-transform: translateZ(0);
        opacity: 1
    }
}

@-webkit-keyframes SubMenuAnimIn4 {
    0% {
        -webkit-transform: translateZ(300px);
        opacity: 0
    }

    100% {
        -webkit-transform: translateZ(0);
        opacity: 1
    }
}

@-webkit-keyframes SubMenuAnimIn5 {
    0% {
        -webkit-transform: translateZ(-200px);
        opacity: 0
    }

    100% {
        -webkit-transform: translateZ(0);
        opacity: 1
    }
}

@keyframes SubMenuAnimIn1 {
    0% {
        -webkit-transform: translateX(50%);
        transform: translateX(50%);
        opacity: 0
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1
    }
}

@keyframes SubMenuAnimIn2 {
    0% {
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        opacity: 0
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1
    }
}

@keyframes SubMenuAnimIn3 {
    0% {
        -webkit-transform: translateZ(-300px);
        transform: translateZ(-300px);
        opacity: 0
    }

    100% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }
}

@keyframes SubMenuAnimIn4 {
    0% {
        -webkit-transform: translateZ(300px);
        transform: translateZ(300px);
        opacity: 0
    }

    100% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }
}

@keyframes SubMenuAnimIn5 {
    0% {
        -webkit-transform: translateZ(-200px);
        transform: translateZ(-200px);
        opacity: 0
    }

    100% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }
}

.dl-menuwrapper > .dl-submenu.dl-animate-out-1 {
    -webkit-animation: SubMenuAnimOut1 .4s ease;
    animation: SubMenuAnimOut1 .4s ease
}

.dl-menuwrapper > .dl-submenu.dl-animate-out-2 {
    -webkit-animation: SubMenuAnimOut2 .3s ease-in-out;
    animation: SubMenuAnimOut2 .3s ease-in-out
}

.dl-menuwrapper > .dl-submenu.dl-animate-out-3 {
    -webkit-animation: SubMenuAnimOut3 .4s ease;
    animation: SubMenuAnimOut3 .4s ease
}

.dl-menuwrapper > .dl-submenu.dl-animate-out-4 {
    -webkit-animation: SubMenuAnimOut4 .4s ease;
    animation: SubMenuAnimOut4 .4s ease
}

.dl-menuwrapper > .dl-submenu.dl-animate-out-5 {
    -webkit-animation: SubMenuAnimOut5 .4s ease;
    animation: SubMenuAnimOut5 .4s ease
}

@-webkit-keyframes SubMenuAnimOut1 {
    0% {
        -webkit-transform: translateX(0);
        opacity: 1
    }

    100% {
        -webkit-transform: translateX(50%);
        opacity: 0
    }
}

@-webkit-keyframes SubMenuAnimOut2 {
    0% {
        -webkit-transform: translateX(0);
        opacity: 1
    }

    100% {
        -webkit-transform: translateX(100%);
        opacity: 0
    }
}

@-webkit-keyframes SubMenuAnimOut3 {
    0% {
        -webkit-transform: translateZ(0);
        opacity: 1
    }

    100% {
        -webkit-transform: translateZ(-300px);
        opacity: 0
    }
}

@-webkit-keyframes SubMenuAnimOut4 {
    0% {
        -webkit-transform: translateZ(0);
        opacity: 1
    }

    100% {
        -webkit-transform: translateZ(300px);
        opacity: 0
    }
}

@-webkit-keyframes SubMenuAnimOut5 {
    0% {
        -webkit-transform: translateZ(0);
        opacity: 1
    }

    100% {
        -webkit-transform: translateZ(-200px);
        opacity: 0
    }
}

@keyframes SubMenuAnimOut1 {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1
    }

    100% {
        -webkit-transform: translateX(50%);
        transform: translateX(50%);
        opacity: 0
    }
}

@keyframes SubMenuAnimOut2 {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1
    }

    100% {
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        opacity: 0
    }
}

@keyframes SubMenuAnimOut3 {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }

    100% {
        -webkit-transform: translateZ(-300px);
        transform: translateZ(-300px);
        opacity: 0
    }
}

@keyframes SubMenuAnimOut4 {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }

    100% {
        -webkit-transform: translateZ(300px);
        transform: translateZ(300px);
        opacity: 0
    }
}

@keyframes SubMenuAnimOut5 {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }

    100% {
        -webkit-transform: translateZ(-200px);
        transform: translateZ(-200px);
        opacity: 0
    }
}

.no-js .dl-menuwrapper .dl-menu {
    position: relative;
    opacity: 1;
    -webkit-transform: none;
    transform: none
}

.no-js .dl-menuwrapper li.dl-back, .xv-menuwrapper .dl-trigger {
    display: none
}

.no-js .dl-menuwrapper li > a: not(: only-child) {
    background: rgba(0,0,0,.1)
}

    .no-js .dl-menuwrapper li > a: not(: only-child):after {
        content: ''
    }

.demo-1 .dl-menuwrapper button {
    background: #c62860
}

    .demo-1 .dl-menuwrapper button.dl-active, .demo-1 .dl-menuwrapper button:hover, .demo-1 .dl-menuwrapper ul {
        background: #9e1847
    }

.demo-2 .dl-menuwrapper button {
    background: #e86814
}

    .demo-2 .dl-menuwrapper button.dl-active, .demo-2 .dl-menuwrapper button:hover, .demo-2 .dl-menuwrapper ul {
        background: #D35400
    }

.demo-3 .dl-menuwrapper button {
    background: #08cbc4
}

    .demo-3 .dl-menuwrapper button.dl-active, .demo-3 .dl-menuwrapper button:hover, .demo-3 .dl-menuwrapper ul {
        background: #00b4ae
    }

.demo-4 .dl-menuwrapper button {
    background: #90b912
}

    .demo-4 .dl-menuwrapper button.dl-active, .demo-4 .dl-menuwrapper button:hover, .demo-4 .dl-menuwrapper ul {
        background: #79a002
    }

.demo-5 .dl-menuwrapper button {
    background: #744783
}

    .demo-5 .dl-menuwrapper button.dl-active, .demo-5 .dl-menuwrapper button:hover, .demo-5 .dl-menuwrapper ul {
        background: #643771
    }

.mainnav {
    padding: 0;
    z-index: 99;
    border-radius: 0;
    background: 0 0;
    border: none
}

@media (max-width: 1031px) {
    .mainnav {
        padding: 5px 15px;
    }
}

@media (min-width: 1031px) {
    .mainnav .dl-trigger {
        display: none
    }
}

.xv-menuwrapper {
    float: right
}

    .xv-menuwrapper .dl-menu {
        margin: 0;
        display: flex;
        position: static;
        padding: 0;
        text-align: left;
        float: none
    }

        .xv-menuwrapper .dl-menu > li.parent {
            position: relative
        }

            .xv-menuwrapper .dl-menu > li.parent > a:after {
                content: "";
                position: absolute;
                color: #ffffff;
                font-family: phpkbIcons;
                right: 0
            }

            .xv-menuwrapper .dl-menu > li.parent:hover > a:after {
                content: "";
                position: absolute;
                font-family: phpkbIcons;
                top: 43%;
                font-size: 36px;
                left: 32px;
                color: rgba(120,130,140,.13)
            }

        .xv-menuwrapper .dl-menu > li.active > a {
            color: #557CB5
        }

        .xv-menuwrapper .dl-menu > li > a {
            padding: 0 20px;
            display: block;
            font-size: 13px;
            font-weight: 400;
            color: #fff;
            line-height: 50px;
            position: relative;
            margin-left: 15px
        }

        .xv-menuwrapper .dl-menu > li.megamenu.active > a:after {
            font-family: phpkbIcons;
            content: "f0d8";
            width: 100%;
            text-align: center;
            height: 7px;
            position: absolute;
            left: 0;
            color: #fff;
            font-size: 20px;
            bottom: 42px
        }

        .xv-menuwrapper .dl-menu > li.megamenu.active:after {
            display: none
        }

        .xv-menuwrapper .dl-menu > li .btn {
            color: #fff !important;
            line-height: 20px !important;
            vertical-align: middle
        }

        .xv-menuwrapper .dl-menu li.parent {
            position: relative
        }

            .xv-menuwrapper .dl-menu li.parent.megamenu {
                position: static
            }

                .xv-menuwrapper .dl-menu li.parent.megamenu > .lg-submenu {
                    display: flex !important;
                    align-content: center !important;
                    flex-wrap: wrap !important;
                    width: auto;
                    text-align: justify;
                    left: auto;
                    right: 0;
                    padding: 15px 20px 0
                }

                    .xv-menuwrapper .dl-menu li.parent.megamenu > .lg-submenu.lg-submenu-left {
                        left: 20%;
                        right: auto !important
                    }

                    .xv-menuwrapper .dl-menu li.parent.megamenu > .lg-submenu::after {
                        width: 100%;
                        display: inline-block;
                        content: ".";
                        visibility: hidden
                    }

                    .xv-menuwrapper .dl-menu li.parent.megamenu > .lg-submenu > li {
                        display: inline-block;
                        text-align: left;
                        vertical-align: top;
                        position: relative;
                        padding: 20px
                    }

                        .xv-menuwrapper .dl-menu li.parent.megamenu > .lg-submenu > li:before {
                            height: 100%;
                            content: "";
                            display: block;
                            position: absolute;
                            border-right: 1px dashed rgba(120,130,140,.13);
                            top: 0;
                            left: -5px
                        }

                        .xv-menuwrapper .dl-menu li.parent.megamenu > .lg-submenu > li:nth-child(2):before {
                            border: none
                        }

                        .xv-menuwrapper .dl-menu li.parent.megamenu > .lg-submenu > li > a {
                            font-weight: 400;
                            display: block
                        }

                    .xv-menuwrapper .dl-menu li.parent.megamenu > .lg-submenu figure {
                        overflow: hidden;
                        max-width: 330px
                    }

                        .xv-menuwrapper .dl-menu li.parent.megamenu > .lg-submenu figure img {
                            width: 100%;
                            height: auto
                        }

                .xv-menuwrapper .dl-menu li.parent.megamenu > ul > li, .xv-menuwrapper .dl-menu li.parent.megamenu > ul > li.parent ul li {
                    border-top: none
                }

                .xv-menuwrapper .dl-menu li.parent.megamenu li {
                    list-style: none
                }

                    .xv-menuwrapper .dl-menu li.parent.megamenu li a {
                        line-height: 25px;
                        margin-bottom: 15px
                    }

            .xv-menuwrapper .dl-menu li.parent: last-child > ul {
                left: auto;
                right: 0
            }

            .xv-menuwrapper .dl-menu li.parent:hover > ul {
                visibility: visible;
                opacity: 1;
                transform: translateY(0);
                -webkit-transform: translateY(0);
                -moz-transform: translateY(0);
                -o-transform: translateY(0);
                -ms-transform: translateY(0)
            }

            .xv-menuwrapper .dl-menu li.parent > ul {
                background: #fff;
                padding: 0;
                position: absolute;
                left: 0;
                top: 100%;
                min-width: 215px;
                visibility: hidden;
                opacity: 0;
                transform: translateY(10px);
                -webkit-transform: translateY(10px);
                -moz-transform: translateY(10px);
                -o-transform: translateY(10px);
                -ms-transform: translateY(10px);
                -moz-box-shadow: 0 4px 12px rgba(0,0,0,.176);
                -webkit-box-shadow: 0 4px 12px rgba(0,0,0,.176);
                box-shadow: 0 4px 12px rgba(0,0,0,.176)
            }

                .xv-menuwrapper .dl-menu li.parent > ul > li {
                    display: block;
                    list-style: none;
                    border-top: 1px solid rgba(120,130,140,.13);
                    padding: 8px 10px
                }

                    .xv-menuwrapper .dl-menu li.parent > ul > li > a {
                        display: block;
                        line-height: 30px
                    }

                    .xv-menuwrapper .dl-menu li.parent > ul > li.parent ul {
                        position: absolute;
                        left: 100%;
                        top: 0
                    }

                    .xv-menuwrapper .dl-menu li.parent > ul > li.parent:after {
                        position: absolute;
                        top: 0;
                        right: 15px;
                        line-height: 50px;
                        font-family: phpkbIcons;
                        speak: none;
                        -webkit-font-smoothing: antialiased;
                        content: "";
                        color: #5e686f
                    }

                    .xv-menuwrapper .dl-menu li.parent > ul > li.parent:hover > ul {
                        visibility: visible;
                        opacity: 1;
                        transform: translateY(0);
                        -webkit-transform: translateY(0);
                        -moz-transform: translateY(0);
                        -o-transform: translateY(0);
                        -ms-transform: translateY(0)
                    }

            .xv-menuwrapper .dl-menu li.parent: last-child > ul > li.parent > ul {
                left: auto;
                right: 100%
            }

        .xv-menuwrapper .dl-menu a {
            font-size: 12px
        }

            .xv-menuwrapper .dl-menu a i {
                padding-right: 15px
            }

    .xv-menuwrapper button:after {
        display: none
    }

    .xv-menuwrapper .dl-back {
        display: none !important
    }

.dl-menuwrapper {
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%)
}

    .dl-menuwrapper .dl-menu {
        box-shadow: 0 0 6px rgba(0,0,0,.1);
        z-index: 9999;
        border-radius: 2px
    }

        .dl-menuwrapper .dl-menu .btn {
            border-radius: 0;
            padding: 0
        }

    .dl-menuwrapper button {
        background: #557CB5;
        float: right
    }

        .dl-menuwrapper button.dl-active, .dl-menuwrapper button:hover {
            background: #557CB5
        }

    .dl-menuwrapper ul {
        background: #fff
    }

        .dl-menuwrapper ul li {
            border-bottom: 1px solid #fafafa
        }

            .dl-menuwrapper ul li: last-child {
                border: none
            }

            .dl-menuwrapper ul li a {
                color: #5e686f
            }

.fixed-navigation.dl-menuwrapper {
    position: fixed;
    right: -80px;
    top: 40px;
    z-index: 9999
}

.dl-trigger-wrapper {
    position: relative
}

.lg-submenu:hover:active:focus::before {
    content: "";
    position: absolute;
    font-family: phpkbIcons;
    top: -11px;
    font-size: 22px;
    left: 32px;
    color: #ddd
}

.dropdown-toggle:hover, .nav .open > a, .nav .open > a:focus, .nav .open > a:hover {
    background-color: transparent;
    color: #557CB5
}

.mini-nav .paper-nav-toggle, .nav-offcanvas-desktop .paper-nav-toggle {
    display: block
}

.custome-select, .top-level-nav li {
    display: inline-block
}

.xv-menuwrapper .dl-menu > li.megamenu .lg-submenu li {
    line-height: 30px
}

    .xv-menuwrapper .dl-menu > li.megamenu .lg-submenu li .icon {
        margin-left: 0
    }

.navbar-default ul.dropdown-menu li a, .tags li a, .widget-cart-items, .widget-tags a, .xv-menuwrapper .dl-menu > li.parent > ul, .xv-menuwrapper .dl-menu > li.parent > ul > li.parent > ul {
    transition: all .3s ease-in-out 0
}

@media screen and (min-width: 768px) {
    .mini-nav .navbar {
        margin-bottom: 0;
        position: absolute;
        left: 0;
        right: 0;
        border: none !important;
        padding: 15px 0
    }
}

.nav-absolute nav {
    position: absolute;
    right: 0;
    left: 0 ;
    background: #07234A;
}

    .nav-absolute nav.original .xv-menuwrapper .dl-menu > li.parent > a:after, .nav-absolute nav.original .xv-menuwrapper .dl-menu > li > a, .nav-light nav .xv-menuwrapper .dl-menu > li.parent > a:after, .nav-light nav .xv-menuwrapper .dl-menu > li > a {
        color: #fff
    }

.nav-border nav {
    border-bottom: 1px solid rgba(255,255,255,.2)
}

.nav-border-dark nav {
    border-bottom: 1px solid #e1e8ee !important
}

.nav-slim .xv-menuwrapper .dl-menu > li > a {
    line-height: 60px
}

.nav-slim .xv-menuwrapper li.parent.megamenu > .lg-submenu.lg-submenu-left {
    left: auto
}

.nav-sticky.sticky nav {
    position: relative !important;
    transition: background .3s,color .3s,border-color .3s,padding .2s
}

nav ul {
    padding: 0
}

nav strong {
    font-weight: 400;
    font-size: 12px
}

@media (min-width: 1031px) {
    nav li .divider {
        border-bottom: 1px dashed rgba(120,130,140,.13);
        margin: 5px 0
    }
}

nav .b-l, nav .b-r {
    border-color: rgba(255,255,255,.2)
}

nav .user-avatar img {
    width: 40px;
    margin-left: 5px
}

nav.nav-inverse .xv-menuwrapper .dl-menu > li.parent ul {
    background: #272C33
}

nav.nav-flat .dl-menu > li > a {
    text-transform: uppercase;
    letter-spacing: 3px;
    font-weight: 100
}

.btn-big, .has-overlay small {
    letter-spacing: 2px;
    text-transform: uppercase
}

nav.nav-flat .navbar-brand {
    font-size: 2.1rem
}

.offcanvas .badge, nav .badge {
    padding: 4px 7px;
    margin-left: 5px;
    border-radius: 2px
}

.navbar {
    margin-bottom: 0;
    background: #07234A;
}

    .navbar .brand img {
        padding-top: 25px
    }

    .navbar li a {
        padding-right: 20px;
        color: #5e686f
    }

        .navbar li a:focus, .navbar li a:hover {
            opacity: .8;
            text-decoration: none;
            outline: 0;
            color: #f8bd08;
            font-weight: 700;
        }

    .navbar .nav-btn {
        border-radius: 3px;
        padding: 8px 20px !important
    }

    .navbar .dropdown .dropdown-item {
        padding: .25rem 1rem;
        font-size: 12px;
        font-weight: 300
    }

    .navbar .icon {
        margin-left: 10px
    }

.top-level-nav {
    padding: 0;
    text-align: left
}

    .top-level-nav.text-right {
        text-align: right
    }

    .top-level-nav li + li:before {
        content: "|";
        padding: 0 10px;
        color: #fff
    }

    .top-level-nav li a {
        color: #fff
    }

.slect-lang a {
    opacity: .5
}

    .slect-lang a.active {
        opacity: 1;
        margin-right: 1px
    }

        .slect-lang a.active img, .slect-lang a:hover img {
            border: 1px solid #13212d;
            margin: -1px
        }

.custome-select {
    width: 85px;
    max-width: 100%;
    position: relative;
    height: 25px;
    line-height: 25px;
    text-align: left;
    cursor: pointer
}

    .custome-select.style2 {
        width: 100%;
        border: 1px solid #e1e8ee;
        padding: 5px;
        height: 35px;
        background: #fff;
        margin-bottom: 10px
    }

        .custome-select.style2::after {
            content: "";
            font-family: phpkbIcons;
            position: absolute;
            top: 4px;
            right: 20px;
            color: #e1e8ee
        }

        .custome-select.style2.normal {
            max-width: 300px
        }

    .custome-select span {
        width: 100%;
        color: #fff;
        padding-left: 5px;
        font-size: 15px;
        display: block;
        font-weight: 400
    }

    .custome-select.style2 span {
        color: #000
    }

    .custome-select span b {
        float: right;
        margin-top: 5px;
        margin-right: 5px
    }

    .custome-select select {
        opacity: 0;
        position: absolute;
        width: 100%;
        left: 0;
        top: 0;
        height: 25px
    }

.breadcrumbs {
    background: #fff;
    padding: 12px;
    border-bottom: 1px solid #e1e8ee
}

    .breadcrumbs ol {
        margin: 0;
        padding: 0
    }

        .breadcrumbs ol li {
            display: inline-block;
            color: #5e6977;
            font-size: 14px
        }

            .breadcrumbs ol li a {
                text-decoration: none;
                color: #557CB5
            }

            .breadcrumbs ol li::after {
                content: " / ";
                padding: 0 10px;
                color: #e1e8ee
            }

            .breadcrumbs ol li: last-child::after {
                content: " "
            }

.comments .comment-list li {
    position: relative;
    margin-bottom: 15px;
    overflow: visible;
    list-style: none;
    background: #fff;
    border: 1px solid #e1e8ee;
    border-radius: 5px
}

    .comments .comment-list li .avatar {
        border-radius: 50%;
        margin-left: -28px;
        margin-top: 15px;
        padding: 5px;
        position: absolute;
        border: 1px solid #eee;
        height: 58px
    }

    .comments .comment-list li .description {
        padding: 15px 30px 10px 48px
    }

        .comments .comment-list li .description li {
            background: 0 0;
            padding: 0;
            border: none;
            margin: 0
        }

    .comments .comment-list li .reply {
        float: right
    }

    .comments .comment-list li .comments-meta {
        border-top: 1px solid #eee;
        background: #f5f8fa;
        padding: 5px 10px
    }

        .comments .comment-list li .comments-meta li {
            background: 0 0;
            display: inline;
            border: none;
            margin-top: 0
        }

        .comments .comment-list li .comments-meta time::before {
            content: "|";
            display: inline-block;
            padding: 0 10px
        }

        .comments .comment-list li .comments-meta a {
            font-size: 13px;
            font-weight: 300
        }

    .comments .comment-list li ol.comment-list-child {
        padding: 0
    }

        .comments .comment-list li ol.comment-list-child .comment {
            margin-top: 0;
            border: none
        }

            .comments .comment-list li ol.comment-list-child .comment .description {
                padding: 15px 48px 10px 30px
            }

            .comments .comment-list li ol.comment-list-child .comment .avatar {
                right: -28px
            }

.comments .comment-list.no-m li {
    margin-bottom: 0 !important
}

.page-header-style1 {
    background: #fff;
    text-align: center;
    border-bottom: none;
    padding: 45px 0 60px
}

.has-overlay, .has-overlay h1 {
    background-size: cover !important
}

.page-header-style1 h1 {
    color: #606676;
    font-size: 24px
}

.page-header-style1 p {
    margin: 0 auto;
    padding-top: 30px;
    font-size: 16px;
    width: 60%
}

.has-overlay {
    z-index: 0;
    background-position: center;
    position: relative
}

    .has-overlay .container {
        z-index: 1
    }

    .has-overlay small {
        font-size: 14px;
        font-weight: 300
    }

    .has-overlay h1 {
        font-weight: 100;
        font-size: 36px
    }

    .has-overlay p {
        font-size: 18px;
        font-weight: 100;
        line-height: 36px;
        margin-top: 20px
    }

@media (max-width: 1031px) {
    .has-overlay {
        text-align: center
    }

        .has-overlay img {
            margin: 0 auto;
            padding-top: 30px
        }
}

.overlay {
    z-index: -1;
    opacity: .5;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

footer {
    background-color: #fff;
    border-top: 1px solid #eee;
    padding: 35px 0 0
}

@media (max-width: 420px) {
    footer .brand {
        text-align: center
    }
}

footer h6 {
    font-weight: 400
}

footer .brand img {
    padding-top: 50px;
    padding-bottom: 50px
}

footer ul {
    padding: 0
}

footer .footer-links {
    padding-top: 5px
}

    footer .footer-links li {
        display: block;
        list-style: none
    }

        footer .footer-links li a {
            color: #5e686f;
            line-height: 26px
        }

            footer .footer-links li a:hover {
                color: #557CB5
            }

footer .social {
    padding: 20px 0
}

footer .copyright {
    color: #5e6977
}

footer li {
    position: relative
}

footer .customeIconList {
    margin-top: 30px
}

    footer .customeIconList li {
        position: relative;
        padding-left: 15px;
        display: block;
        margin-bottom: 25px
    }

footer ul.customeIconList > li {
    padding-left: 30px
}

footer .customeIconList li .icon {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 16px;
    color: #5fb7ea
}

footer hr {
    border-top: 1px solid rgba(255,255,255,.05)
}

footer .copyrights {
    padding: 10px 0;
    font-weight: 300
}

ul.arrow-list {
    padding: 0
}

    ul.arrow-list li {
        padding-left: 20px;
        margin-bottom: 10px;
        position: relative
    }

        ul.arrow-list li::before {
            content: "";
            display: block;
            font-family: phpkbIcons;
            width: 10px;
            height: 10px;
            position: absolute;
            left: 0
        }

.horizontal-rule {
    overflow: hidden;
    position: relative;
    display: block;
    margin: 30px 0;
    height: 14px;
    height: 20px
}

    .horizontal-rule.no-icon:after, .horizontal-rule.on-left:before, .horizontal-rule.on-right:after {
        display: none
    }

    .horizontal-rule .icon {
        font-size: 18px;
        position: absolute;
        left: 50%;
        margin-left: -15px;
        width: 30px;
        height: 14px;
        z-index: 10;
        text-align: center
    }

    .horizontal-rule:after, .horizontal-rule:before {
        content: '';
        position: absolute;
        bottom: 12px;
        width: 50%;
        border-top: 1px solid #e1e8ee
    }

    .horizontal-rule:before {
        left: -15px;
        margin-left: -15px
    }

    .horizontal-rule:after {
        right: -15px;
        margin-right: -15px
    }

    .horizontal-rule.dashed:after, .horizontal-rule.dashed:before {
        border-top: 1px dashed #e1e8ee
    }

    .horizontal-rule.on-left:after {
        width: 100%;
        margin-right: -25px
    }

    .horizontal-rule.on-left .icon {
        left: 0;
        margin-left: -7px
    }

    .horizontal-rule.on-right:before {
        width: 100%;
        margin-left: -25px
    }

    .horizontal-rule.on-right .icon {
        right: 0;
        left: auto;
        margin-left: 0;
        margin-right: -7px
    }

    .horizontal-rule.no-icon:before {
        width: 100%;
        margin-left: 0
    }

.widget {
    border: 3px solid #f5f8fa;
    border-radius: 3px;
    margin-bottom: 20px;
    background: #f0f4f7;
}

.widget-padded {
    padding: 5px 10px 10px
}

.widget a {
    color: #5e686f
}

.widget h3 {
    font-size: 14px;
    font-weight: 400;
    line-height: 25px
}

    .widget h3::after {
        background: #1bb1f5;
        content: "";
        display: block;
        height: 3px;
        margin-top: 9px;
        width: 60px
    }

.widget .icon {
    float: right;
    padding-right: 20px
}

.widget-support-forum {
    margin-bottom: 24px;
    margin-top: 50px
}

    .widget-support-forum p {
        font-size: 16px;
        font-weight: 400;
        color: #5e686f;
        padding-top: 30px;
        padding-bottom: 30px
    }

.widget_categories li {
    list-style: none;
    padding-left: 5px;
    padding-top: 15px
}

    .widget_categories li a {
        padding-left: 15px;
        color: #5e686f;
        font-size: 14px;
        font-weight: 400;
        font-family: Roboto,sans-serif;
        text-decoration: none;
        outline: 0
    }

        .widget_categories li a:hover {
            color: #557CB5
        }

    .widget_categories li ul {
        padding-left: 30px;
        padding-bottom: 20px
    }

        .widget_categories li ul li:before {
            font-family: phpkbIcons;
            content: ""
        }

    .widget_categories li:before {
        font-family: phpkbIcons;
        content: "";
        color: #b5bfc7;
        font-size: 18px
    }

.search-widget {
    border: none;
    position: relative;
    width: 100%;
    padding: 0
}

    .search-widget button {
        background: 0 0;
        border-style: none;
        color: #e1e8ee;
        height: 100%;
        margin: 0;
        padding: 0;
        position: absolute;
        right: 8px;
        top: 0;
        width: 35px;
        font-size: 20px
    }

        .search-widget button:hover {
            color: #557CB5
        }

.shop-product {
    padding: 15px 0
}

    .shop-product .product-info {
        padding-top: 16px
    }

        .shop-product .product-info > a {
            font-size: 12px;
            padding-top: 25px;
            font-weight: 400
        }

    .shop-product figure {
        float: left;
        width: 80px
    }

    .shop-product: last-child {
        border: none
    }

.header-top {
    border-bottom: 1px solid #eee;
    position: relative;
    z-index: 9997
}

    .header-top ul li a {
        padding: 5px 0;
        font-size: 12px;
        font-weight: 400;
        color: #5e686f
    }

        .header-top ul li a:hover {
            text-decoration: none;
            color: #557CB5
        }

    .header-top .left-ul > li {
        display: inline-block;
        margin-right: 20px
    }

    .header-top .right-ul .icon {
        padding-right: 5px
    }

        .header-top .right-ul .icon:hover {
            color: #5cb0e2
        }

    .header-top .right-ul > li {
        display: inline-block;
        margin-left: 15px
    }

@media (max-width: 1031px) {
    .header-top {
        display: none
    }
}

.top-nav {
    padding: 0;
    margin: 0
}

    .top-nav > li {
        display: inline-block;
        position: relative
    }

.header-top ul.top-nav > li > a {
    display: block;
    padding: 10px;
    position: relative
}

.header-top ul.top-nav > li:first-child > a {
    padding-left: 0
}

.header-top ul.top-nav > li: last-child > a {
    padding-right: 0
}

.header-top ul.top-nav > li > a > .icon {
    margin-right: 10px
}

.header-light .header-top ul.top-nav > li > a > .icon {
    color: #fff
}

.header-light .header-top ul.top-nav > li.opened > a, .header-light .header-top ul.top-nav > li:hover > a {
    color: #202731
}

.header-top ul.top-nav > li > a > span {
    margin: 0 5px
}

.header-top ul.top-nav > li.opened > a, .header-top ul.top-nav > li:hover > a {
    color: #5cb0e2
}

.header-top ul.top-nav > li > ul {
    position: absolute;
    top: 100%;
    background: #fff;
    padding: 4px 0;
    display: none;
    min-width: 150px;
    -moz-box-shadow: -1px 2px 3px rgba(0,0,0,.2);
    -webkit-box-shadow: -1px 2px 3px rgba(0,0,0,.2);
    box-shadow: -1px 2px 3px rgba(0,0,0,.2)
}

    .header-top ul.top-nav > li:hover > ul, .header-top ul.top-nav > li > ul > li, .setting-switcher.active > ul {
        display: block
    }

.header-light .header-top ul.top-nav > li > ul {
    color: #0e1b23
}

.header-top ul.top-nav > li.parent > a:after {
    font-family: phpkbIcons;
    content: "\f107";
    padding-left: 5px
}

.header-top ul.top-nav > li > ul > li > a {
    display: block;
    padding: 4px 10px
}

.regionalSetting {
    position: absolute;
    top: 100%;
    padding: 20px;
    left: 0;
    width: 250px;
    background: #fff;
    -moz-box-shadow: -1px 2px 3px rgba(0,0,0,.2);
    -webkit-box-shadow: -1px 2px 3px rgba(0,0,0,.2);
    box-shadow: -1px 2px 3px rgba(0,0,0,.2)
}

    .regionalSetting h6 {
        margin-top: 0;
        padding-bottom: 10px;
        border-bottom: 1px solid #eee
    }

.setting-switcher {
    height: 30px;
    width: 100%;
    position: relative;
    border: 1px solid #ddd;
    border-radius: 2px;
    margin: 5px 0 10px;
    z-index: 20
}

    .setting-switcher.active {
        z-index: 50
    }

    .setting-switcher > span {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        padding: 5px 10px 0
    }

    .setting-switcher > ul {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        padding: 0;
        margin: 0;
        height: 300px;
        overflow: hidden;
        overflow-y: auto;
        background: #fff
    }

        .setting-switcher > ul > li {
            display: block;
            padding: 5px 10px;
            cursor: pointer
        }

            .setting-switcher > ul > li + li {
                border-top: 1px solid #ddd
            }

            .setting-switcher > ul > li > em {
                width: 130px;
                display: inline-block
            }

.mega-child {
    display: none
}

.newsletter form, .subscribe form {
    padding: 30px 0
}

    .newsletter form .icon-btn, .subscribe form .icon-btn {
        background: 0 0;
        border: none;
        color: #5e686f;
        font-size: 30px;
        position: absolute;
        right: 25px;
        top: 44px
    }

#home2carousel img, .topics-wrapper {
    border-radius: 5px
}

.newsletter form .subscribe, .subscribe form .subscribe {
    margin-top: 30px
}

.services img {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.services h3 {
    color: #43484d;
    font-size: 15px !important;
    text-align: center;
    font-weight: 400
}

.services p {
    color: #5e686f;
    font-size: 16px;
    margin: 0 auto;
    padding-bottom: 15px;
    padding-top: 30px;
    text-align: center
}

.newsletter {
    background: url(../images/icon-fan.png) center bottom no-repeat #f5f8fa;
    position: relative;
    border-top: 1px solid #E1E8EE;
    /*border-bottom: 1px solid #E1E8EE*/
}

.media-border, .topics header {
    border-bottom: 1px solid #eee
}

.testimonials {
    padding: 0 0 90px;
    color: #5e6977;
    margin: 0 auto
}

    .testimonials .testimonial-content {
        font-weight: 100;
        font-size: 20px;
        max-width: 670px;
        margin: 0 auto
    }

.topics header h2, .topics header p {
    font-weight: 300;
    font-family: Roboto,sans-serif
}

.icon-heading {
    background: url(../img/icon/icon-stone1.png) center bottom no-repeat;
    height: 258px;
    margin-bottom: 36px;
    padding-top: 84px
}

.users-slider {
    margin: 0 auto;
    max-width: 864px;
    position: relative
}

    .users-slider .lSSlideWrapper {
        position: absolute;
        bottom: 0
    }

    .users-slider .lSSlideOuter {
        height: 350px;
        margin-bottom: 20px;
        overflow: hidden;
        position: relative;
        text-align: center
    }

        .users-slider .lSSlideOuter img {
            width: 80px;
            margin: 35px auto 0
        }

        .users-slider .lSSlideOuter .active img {
            transition: all .3s;
            width: 160px
        }

.clients {
    padding: 100px 0
}

#home2carousel {
    margin: 20px 0 100px
}

.ab-brand img {
    float: right;
    position: absolute;
    right: 65px;
    top: 24px;
    width: 40px
}

.topics {
    padding: 50px 0
}

    .topics header {
        position: relative
    }

        .topics header h2 {
            font-size: 38px;
            color: #43484d
        }

        .topics header p {
            font-size: 16px;
            color: #5e6977
        }

    .topics .topics-btn {
        margin-top: 30px
    }

        .topics .topics-btn .btn {
            margin-top: 60px;
            color: #358ed7
        }

        .topics .topics-btn span {
            display: inline;
            padding-left: 30px
        }

    .topics h3 a {
        font-size: 18px;
        font-weight: 400;
        font-family: Roboto,sans-serif;
        color: #606676;
        text-decoration: none
    }

        .topics h3 a:hover {
            color: #2196F3
        }

.topics-wrapper {
    margin-bottom: 20px;
    position: relative;
    height: 100%
}

    .topics-wrapper h3 {
        padding: 0
    }

    .topics-wrapper .topics-list {
        padding: 20px 0
    }

        .topics-wrapper .topics-list li {
            list-style: none;
            line-height: 35px
        }

            .topics-wrapper .topics-list li a {
                padding-left: 0;
                color: #5e686f;
                text-decoration: none;
                outline: 0
            }

                .topics-wrapper .topics-list li a:hover {
                    color: #557CB5
                }

            .topics-wrapper .topics-list li i {
                padding-right: 8px
            }

    .topics-wrapper .topics-meta {
        padding: 7px 0;
        margin: 0;
        border-top: 1px solid #e1e8ee;
        position: absolute;
        width: 100%;
        bottom: 0
    }

.icon-not, .icon-yes {
    width: 32px;
    height: 32px;
    display: inline-block
}

.topics-wrapper .topics-meta li {
    list-style: none;
    display: inline-block;
    color: #5e6977;
    font-size: 14px;
    font-weight: 300;
    padding-right: 10px
}

.topics-wrapper .icon {
    color: #4ea9e0;
    font-size: 24px;
    font-weight: 700;
    margin-right: 15px
}

.topics-wrapper.border-style {
    border: 3px solid #e1e8ee
}

    .topics-wrapper.border-style h3 {
        padding: 20px 20px 0
    }

    .topics-wrapper.border-style .topics-list {
        padding: 10px 20px 20px
    }

        .topics-wrapper.border-style .topics-list li {
            position: relative;
            padding-left: 5px
        }

    .topics-wrapper.border-style .topics-meta {
        background: #f5f8fa;
        padding: 7px 10px;
        text-align: center;
        border-top: 1px solid #e1e8ee
    }

.icon-left-arrow, .icon-right-arrow {
    line-height: 40px;
    font-weight: 700;
    font-size: 38px
}

.icon-yes {
    background: url(../images/icon-yes.png) no-repeat
}

.icon-not {
    background: url(../images/icon-not.png) no-repeat
}

.icon-article {
    background: url(../img/icon/icon-article.png) no-repeat;
    display: inline-block;
    width: 24px;
    height: 32px
}

.icon-img, .icon-video {
    width: 32px;
    height: 32px;
    display: inline-block
}

.icon-video {
    background: url(../img/icon/icon-video.png) no-repeat
}

.icon-img {
    background: url(../img/icon/icon-photo.png) no-repeat
}

.icon-envelope-line {
    background: url(../images/icon-envelope.png) no-repeat;
    display: inline-block;
    width: 64px;
    height: 64px
}

.icon-download {
    background: url(../img/icon/icon-download.png) no-repeat;
    display: inline-block;
    width: 24px;
    height: 24px
}

.icon-rocket {
    background: url(../img/icon/icon-rocket.png) no-repeat;
    display: inline-block;
    width: 64px;
    height: 64px
}

.blog .post {
    border: 3px solid #f5f8fa;
    border-radius: 3px;
    margin-bottom: 30px;
    padding: 25px
}

.blog .ico {
    position: absolute;
    top: 50px;
    font-size: 40px;
    color: #E1E8EE
}

.blog h2 {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    padding-bottom: 10px;
    padding-top: 100px
}

    .blog h2 a {
        color: #43484d
    }

.blog .pagination > li > a, .blog .pagination > li > span {
    color: #557CB5
}

.testimonial {
    font-size: 20px;
    line-height: 30px;
    padding-bottom: 65px;
    padding-top: 50px;
    position: relative;
    text-align: center !important
}

    .testimonial p {
        font-size: 16px;
        font-weight: 300
    }

    .testimonial i {
        margin: 0 auto 20px;
        text-align: center;
        display: block;
        font-size: 64px;
        color: #C3CFD8
    }

    .testimonial .lSPager.lSGallery {
        margin: 0 auto !important;
        text-align: center !important;
        bottom: -38px;
        left: 0;
        position: absolute;
        right: 0
    }

        .testimonial .lSPager.lSGallery img {
            opacity: .3
        }

            .testimonial .lSPager.lSGallery .active img, .testimonial .lSPager.lSGallery img:hover {
                opacity: 1
            }

    .testimonial .testimonial blockquote {
        font-size: 20px;
        line-height: 30px
    }

.testimonial-slider-coltrols li.active::before {
    color: #2bb7ff;
    content: "";
    font-family: phpkbIcons;
    height: 6px;
    left: 50%;
    margin-left: -5px;
    position: absolute;
    top: -24px;
    width: 11px
}

.counter > div {
    background: #fff;
    display: inline-block;
    height: 100px;
    padding: 20px 0;
    text-align: center;
    vertical-align: middle;
    width: 100px;
    font-size: 16px;
    font-weight: 300;
    margin-bottom: 30px
}

    .counter > div span:first-child {
        font-size: 28px;
        display: block
    }

.btn-fab, .btn-line, .paper-nav-toggle i {
    display: inline-block
}

.form-control {
    border: 1px solid #e1e8ee;
    box-shadow: none;
    border-radius: 3px;
    height: 40px
}

    .form-control:focus {
        box-shadow: none;
        border-color: #1BB1F5
    }

.form-group {
    position: relative
}

    .form-group.has-icon i {
        font-size: 14px;
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        margin-left: 20px
    }

        .form-group.has-icon i:after {
            content: "";
            height: 30px;
            width: 1px;
            border-right: solid 1px #e1e8ee;
            position: absolute;
            top: 50%;
            left: 30px;
            -webkit-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            transform: translateY(-50%)
        }

    .form-group.has-icon input {
        padding-left: 68px
    }

.has-warning .form-control {
    border-color: orange
}

form label {
    margin-bottom: 5px;
    margin-top: 10px;
    font-size: 12px;
    font-weight: 400
}

.form-control-lg, .input-group-lg > .form-control, .input-group-lg > .input-group-addon, .input-group-lg > .input-group-btn > .btn {
    border: 2px solid #e1e8ee;
    border-radius: 5px;
    color: #43484d;
    font-size: 14px;
    height: 46px;
    padding: 10px;
    width: 100%
}

    .form-control-lg:focus, .input-group-lg > .form-control:focus, .input-group-lg > .input-group-addon:focus, .input-group-lg > .input-group-btn > .btn:focus {
        border-color: #557CB5 !important
    }

.input-group-lg > .input-group-btn > textarea.btn, .input-group-lg > textarea.form-control, .input-group-lg > textarea.input-group-addon, textarea.form-control-lg {
    height: 100px
}

.btn-fab, .social li {
    height: 40px;
    text-align: center
}

input[type=checkbox], input[type=radio] {
    margin-right: 10px !important
}

.btn {
    border-radius: 2px;
    font-weight: 300
}

    .btn i {
        padding-right: 10px
    }

    .btn .icon {
        padding-right: 15px
    }

    .btn:hover {
        border: 1px solid transparent
    }

.btn-default {
    border: 1px solid #e1e8ee
}

    .btn-default:hover {
        background: #557CB5;
        color: #fff;
        border: 1px solid #557CB5;
        box-shadow: none
    }

.btn-danger, .btn-primary, .btn-success, .btn-warning {
    border-color: transparent;
    color: #fff
}

    .btn-big:hover, .btn-danger:focus, .btn-danger:hover, .btn-fab:hover, .btn-img img:hover, .btn-primary:focus, .btn-primary:hover, .btn-social:focus, .btn-social:hover, .btn-success:focus, .btn-success:hover, .btn-warning:focus, .btn-warning:hover {
        box-shadow: 0 3px 9px 0 rgba(0,0,0,.26)
    }

.btn-fixed-top-left {
    position: fixed;
    left: 52px;
    top: 66px;
    z-index: 99
}

.btn-primary:focus, .btn-primary:hover {
    opacity: .8;
    color: #fff;
    background: #557CB5
}

.btn-danger:focus, .btn-danger:hover {
    opacity: .8;
    color: #fff;
    background: #ED5564
}

.btn-warning:focus, .btn-warning:hover {
    opacity: .8;
    color: #fff;
    background: #FCCE54
}

.btn-success:focus, .btn-success:hover {
    opacity: .8;
    color: #fff;
    background: #7dc855
}

.badge-success, .badge-warning, .btn-social {
    color: #fff
}

    .btn-social:focus, .btn-social:hover {
        color: #fff
    }

.btn-big {
    padding: 15px 40px !important;
    font-size: 22px;
    font-weight: 400 !important
}

@media (max-width: 1031px) {
    .btn-big {
        font-size: 14px
    }
}

.btn-img img:hover {
    transition: box-shadow .5s ease-out 50ms;
    background: 0 0
}

.btn-line {
    color: #fff;
    padding: 10px 22px;
    line-height: 1;
    border: 1px solid #fff;
    border-radius: 0;
    text-align: center;
    font-weight: 100;
    margin: 4px;
    -webkit-transition: all .4s;
    transition: all .4s;
    background: 0 0
}

    .btn-line:focus, .btn-line:hover {
        transition: box-shadow .5s ease-out 50ms;
        opacity: .8;
        color: #fff;
        border: 1px solid
    }

.btn-group-lg > .btn, .btn-lg {
    padding: 13px 25px;
    border-radius: 3px;
    font-size: 16px
}

.btn-fab {
    width: 40px;
    line-height: 40px;
    border-radius: 50%
}

    .btn-fab:hover {
        text-decoration: none;
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1);
        opacity: .8
    }

    .btn-fab i {
        font-size: 24px;
        vertical-align: middle
    }

    .btn-fab.btn-fab-md {
        width: 50px;
        height: 50px;
        line-height: 50px
    }

.paper-nav-toggle.active i::after, .paper-nav-toggle.active i::before, .paper-nav-toggle.dl-active i::after, .paper-nav-toggle.dl-active i::before {
    background: #557CB5
}

.paper-nav-toggle:active, .paper-nav-toggle:focus, .paper-nav-toggle:hover {
    outline: 0;
    border-bottom: none !important;
    opacity: .8
}

.paper-nav-toggle i {
    position: relative;
    width: 25px;
    height: 2px;
    color: #557CB5;
    font: 700 14px/.4 Helvetica;
    text-transform: uppercase;
    text-indent: -55px;
    background: #557CB5;
    transition: all .2s ease-out
}

.social li, .social li a, code, pre {
    color: #fff
}

.paper-nav-toggle i::after, .paper-nav-toggle i::before {
    content: '';
    width: 25px;
    height: 2px;
    background: #557CB5;
    position: absolute;
    left: 0;
    transition: all .2s ease-out
}

.offcanvas, .offcanvas-page {
    transition: transform .5s ease-in-out,margin .5s ease-in-out;
    overflow: hidden
}

.paper-nav-toggle.paper-nav-white > i {
    color: #fff;
    background: #fff
}

    .paper-nav-toggle.paper-nav-white > i::after, .paper-nav-toggle.paper-nav-white > i::before {
        background: #fff
    }

.paper-nav-toggle.left {
    left: 0;
    right: auto
}

.paper-nav-toggle i::before {
    top: -7px
}

.paper-nav-toggle i::after {
    bottom: -7px
}

.paper-nav-toggle:hover i::before {
    top: -10px
}

.paper-nav-toggle:hover i::after {
    bottom: -10px
}

.paper-nav-toggle.active i, .paper-nav-toggle.dl-active i {
    background: 0 0
}

    .paper-nav-toggle.active i::before, .paper-nav-toggle.dl-active i::before {
        top: 0;
        -webkit-transform: rotateZ(45deg);
        -moz-transform: rotateZ(45deg);
        -ms-transform: rotateZ(45deg);
        -o-transform: rotateZ(45deg);
        transform: rotateZ(45deg)
    }

    .paper-nav-toggle.active i::after, .paper-nav-toggle.dl-active i::after {
        bottom: 0;
        -webkit-transform: rotateZ(-45deg);
        -moz-transform: rotateZ(-45deg);
        -ms-transform: rotateZ(-45deg);
        -o-transform: rotateZ(-45deg);
        transform: rotateZ(-45deg)
    }

.paper-nav-toggle {
    cursor: pointer;
    text-decoration: none;
    position: absolute;
    right: 0;
    top: 0;
    padding: 6px 0 0;
    margin: 0 auto;
    display: block;
    height: 44px;
    width: 44px;
    z-index: 2001;
    border-bottom: none !important;
    text-align: center
}

    .paper-nav-toggle .left {
        left: 15px
    }

@-webkit-keyframes blinker {
    from {
        opacity: 1
    }

    to {
        opacity: .1
    }
}

.blink {
    text-decoration: blink;
    -webkit-animation-name: blinker;
    -webkit-animation-duration: .8s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-direction: alternate
}

.glow {
    color: #444;
    text-shadow: 1px 0 1px #ccc,0 1px 1px #eee,2px 1px 1px #ccc,1px 2px 1px #eee,3px 2px 1px #ccc,2px 3px 1px #eee,4px 3px 1px #ccc,3px 4px 1px #eee,5px 4px 1px #ccc,4px 5px 1px #eee,6px 5px 1px #ccc,5px 6px 1px #eee,7px 6px 1px #ccc
}

.offcanvas-page {
    margin-left: 270px
}

@media (max-width: 1031px) {
    .paper-nav-toggle {
        position: absolute;
        display: block
    }

    .offcanvas-page {
        margin-left: 0
    }
}

.user_avatar {
    width: 80px;
    height: 80px;
    border: 1px solid #eee;
    background: #fff;
    padding: 5px;
    border-radius: 50%
}

.sidebar-collapse .offcanvas-page {
    margin-left: 0
}

.offcanvas .dl-menuwrapper {
    top: 0;
    right: auto
}

    .offcanvas .dl-menuwrapper .dl-menu {
        box-shadow: none;
        border-radius: 0
    }

.paper-card, .shadow {
    box-shadow: 0 0 6px rgba(0,0,0,.1)
}

.offcanvas .sidebar-menu li a {
    padding-top: 12px;
    padding-bottom: 12px
}

.offcanvas .sidebar-menu > li {
    border-bottom: 1px solid #f8f8f8
}

    .offcanvas .sidebar-menu > li.active:after {
        content: "";
        display: block;
        width: 5px;
        height: 100%;
        background: #557CB5;
        position: absolute;
        right: 0;
        bottom: 0
    }

    .offcanvas .sidebar-menu > li > .treeview-menu {
        background-color: #fafafa
    }

        .offcanvas .sidebar-menu > li > .treeview-menu > li {
            border-bottom: 1px solid #f8f8f8;
            padding: 3px 0
        }

            .offcanvas .sidebar-menu > li > .treeview-menu > li .treeview-menu {
                background-color: #fff
            }

.sidebar-toggle {
    float: left;
    background-color: transparent;
    background-image: none;
    padding: 15px;
    font-family: phpkbIcons;
    position: absolute
}

    .sidebar-toggle:before {
        content: "";
        font-size: 22px;
        color: #55ACEE
    }

.logo-offcanvas {
    padding: 70px 0;
    text-align: center
}

.sidebar-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    white-space: nowrap
}

    .sidebar-menu > li {
        margin: 0;
        padding: 0;
        position: relative
    }

        .sidebar-menu > li > a {
            display: block;
            padding: 10px 5px 10px 15px;
            font-size: 14px;
            color: #5e686f
        }

            .sidebar-menu > li > a > .fa, .sidebar-menu > li > a > .glyphicon, .sidebar-menu > li > a > .icon, .sidebar-menu > li > a > .ion {
                width: 20px;
                margin-right: 10px
            }

        .sidebar-menu > li .label {
            margin-right: 5px
        }

        .sidebar-menu > li .badge {
            margin-right: 5px;
            margin-top: 3px
        }

    .sidebar-menu li.header {
        font-size: 12px;
        padding: 10px 25px 10px 15px
    }

    .sidebar-menu li > a > .icon-angle-left, .sidebar-menu li > a > .pull-right-container > .icon-angle-left {
        height: auto;
        margin-right: 10px;
        padding: 0;
        width: auto
    }

    .sidebar-menu li > a > .icon-angle-left {
        margin-top: -8px;
        position: absolute;
        right: 10px;
        top: 50%
    }

    .sidebar-menu li.active > a > .icon-angle-left, .sidebar-menu li.active > a > .pull-right-container > .icon-angle-left {
        transform: rotate(-90deg)
    }

    .sidebar-menu li.active > .treeview-menu {
        display: block
    }

    .sidebar-menu .treeview-menu {
        display: none;
        list-style: none;
        margin: 0;
        padding: 0 0 0 5px
    }

        .sidebar-menu .treeview-menu .treeview-menu {
            padding-left: 20px
        }

        .sidebar-menu .treeview-menu > li {
            margin: 0
        }

            .sidebar-menu .treeview-menu > li > a {
                display: block;
                font-size: 12px;
                font-weight: 300;
                padding: 5px 5px 5px 15px
            }

                .sidebar-menu .treeview-menu > li > a > .fa, .sidebar-menu .treeview-menu > li > a > .glyphicon, .sidebar-menu .treeview-menu > li > a > .icon, .sidebar-menu .treeview-menu > li > a > .ion {
                    width: 20px;
                    margin-right: 10px
                }

                .sidebar-menu .treeview-menu > li > a > .icon-angle-down, .sidebar-menu .treeview-menu > li > a > .icon-angle-left, .sidebar-menu .treeview-menu > li > a > .pull-right-container > .icon-angle-down, .sidebar-menu .treeview-menu > li > a > .pull-right-container > .icon-angle-left {
                    width: auto
                }

@media (min-width: 768px) {
    .sidebar-mini.sidebar-collapse .main-footer, .sidebar-mini.sidebar-collapse .offcanvas-page, .sidebar-mini.sidebar-collapse .right-side {
        margin-left: 70px !important;
        z-index: 840
    }

    .sidebar-mini.sidebar-collapse .main-sidebar {
        transform: translate(0,0);
        width: 70px !important;
        z-index: 850
    }

    .sidebar-mini.sidebar-collapse .sidebar-menu > li {
        position: relative
    }

        .sidebar-mini.sidebar-collapse .sidebar-menu > li > a {
            margin-right: 0
        }

            .sidebar-mini.sidebar-collapse .sidebar-menu > li > a > span {
                border-top-right-radius: 4px
            }

        .sidebar-mini.sidebar-collapse .sidebar-menu > li: not(.treeview) > a > span {
            border-bottom-right-radius: 4px
        }

        .sidebar-mini.sidebar-collapse .sidebar-menu > li > .treeview-menu {
            border-bottom-right-radius: 4px;
            padding-bottom: 5px;
            padding-top: 5px
        }

        .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu, .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span: not(.pull-right) {
            display: block !important;
            left: 50px;
            position: absolute;
            width: 180px
        }

        .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span {
            background-color: inherit;
            margin-left: -3px;
            padding: 12px 5px 12px 20px;
            top: 0
        }

        .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > .pull-right-container {
            float: right;
            left: 180px !important;
            position: relative !important;
            top: -22px !important;
            width: auto !important;
            z-index: 900
        }

            .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > .pull-right-container > .label: not(: first-of-type) {
                display: none
            }

        .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
            margin-left: 0;
            top: 44px
        }

        .sidebar-mini.sidebar-collapse .main-sidebar .user-panel > .info, .sidebar-mini.sidebar-collapse .sidebar-form, .sidebar-mini.sidebar-collapse .sidebar-menu li.header, .sidebar-mini.sidebar-collapse .sidebar-menu > li > .treeview-menu, .sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .pull-right, .sidebar-mini.sidebar-collapse .sidebar-menu > li > a > span {
            display: none !important;
            transform: translateZ(0)
        }

    .sidebar-mini.sidebar-collapse .main-header .logo {
        width: 50px
    }

        .sidebar-mini.sidebar-collapse .main-header .logo > .logo-mini {
            display: block;
            font-size: 18px;
            margin-left: -15px;
            margin-right: -15px
        }

        .sidebar-mini.sidebar-collapse .main-header .logo > .logo-lg {
            display: none
        }

    .sidebar-mini.sidebar-collapse .main-header .navbar {
        margin-left: 50px
    }
}

.main-sidebar .user-panel, .sidebar-menu > li.header {
    overflow: hidden;
    white-space: nowrap
}

.sidebar-menu:hover {
    overflow: visible
}

.sidebar-form, .sidebar-menu > li.header {
    overflow: hidden;
    text-overflow: clip
}

.sidebar-menu li > a {
    position: relative
}

    .sidebar-menu li > a > .pull-right {
        margin-top: -7px;
        position: absolute;
        right: 10px;
        top: 50%
    }

.left-side, .main-sidebar {
    top: 0;
    left: 0;
    min-height: 100%;
    position: absolute;
    width: 270px;
    -webkit-transition: -webkit-transform .3s ease-in-out,width .3s ease-in-out;
    -moz-transition: -moz-transform .3s ease-in-out,width .3s ease-in-out;
    -o-transition: -o-transform .3s ease-in-out,width .3s ease-in-out;
    transition: transform .3s ease-in-out,width .3s ease-in-out
}

@media (min-width: 1031px) {
    .relative-lg {
        position: relative
    }
}

@media (max-width: 1047px) {
    .left-side, .main-sidebar {
        -webkit-transform: translate(-330px,0);
        -ms-transform: translate(-330px,0);
        -o-transform: translate(-330px,0);
        transform: translate(-330px,0)
    }
}

@media (min-width: 1048px) {
    .sidebar-collapse .left-side, .sidebar-collapse .main-sidebar {
        -webkit-transform: translate(-330px,0);
        -ms-transform: translate(-330px,0);
        -o-transform: translate(-330px,0);
        transform: translate(-330px,0)
    }
}

@media (max-width: 1047px) {
    .sidebar-open .left-side, .sidebar-open .main-sidebar {
        -webkit-transform: translate(0,0);
        -ms-transform: translate(0,0);
        -o-transform: translate(0,0);
        transform: translate(0,0)
    }
}

.social {
    list-style: none;
    padding: 35px 0
}

    .social li {
        display: inline-block;
        border-radius: 50%;
        line-height: 40px;
        width: 40px;
        font-size: 18px;
        margin-right: 15px
    }

        .social li i {
            padding: 0
        }

    .social.square li {
        border-radius: 0
    }

    .social.rounded li {
        border-radius: 10px
    }

.facebook {
    background: #507cbe
}

.twitter {
    background: #63cdf1
}

.gplus {
    background: #f16261
}

.instagram {
    background: #444
}

.youtube {
    background: #CA3737
}

.linkedin {
    background: #90cadd
}

.dribbble {
    background: #d97aa6
}

.behance {
    background: #0785f3
}

.table > thead > tr > th {
    border: none;
    text-transform: uppercase;
    font-size: 12px;
    padding: 16px
}

.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
    vertical-align: middle;
    border-top: 1px solid #eee
}

.table-striped > tbody > tr: nth-of-type(2n+1) {
    background-color: #F5F8FA
}

.error-page .content-area {
    background: url(../images/icon-stone.png) center center no-repeat #f5f8fa
}

    .error-page .content-area header {
        padding: 30px 0 120px
    }

    .error-page .content-area .message p {
        font-size: 180px;
        font-weight: 700;
        text-align: center
    }

.alert, pre {
    font-size: 13px
}

pre {
    padding: 20px;
    background-color: #082c46;
    border-radius: 3px
}

code {
    background-color: #557CB5;
    font-weight: lighter
}

.modal-footer {
    background: #F5F8FA
}

.progress.progress-xs {
    height: .25rem
}

@media (max-width: 768px) {
    #lightSlider li img {
        width: 73%;
        margin-right: 20px
    }

    .mokupSlider li a {
        height: 360px
    }
}

@media (max-width: 420px) {
    #lightSlider li img {
        width: 75%;
        margin: 0
    }

    .mokupSlider li a {
        height: 130px
    }

    .tabs-left {
        padding-right: 10px
    }

        .tabs-left li.active::after {
            border: none
        }
}

.alert {
    border-radius: 2px;
    font-weight: 300
}

    .alert strong {
        font-weight: 500
    }

    .alert.alert-info {
        background-color: #f6fafd;
        border-color: #d9eff7
    }

    .alert.alert-warning {
        background-color: rgba(252,248,227,.3);
        border-color: #faebcc;
        color: #8a6d3b
    }

    .alert.alert-danger {
        background-color: rgba(242,222,222,.3);
        border-color: #ebccd1;
        color: #a94442
    }

    .alert.alert-success {
        background-color: rgba(223,240,216,.3);
        border-color: #d6e9c6;
        color: #3c763d
    }

.thumbnail {
    padding: 15px;
    border: 3px solid #f5f8fa;
    margin-bottom: 15px
}

    .thumbnail iframe {
        height: 180px;
        width: 100%
    }

.badge {
    border-radius: 0;
    padding: 6px 10px;
    font-weight: 300
}

    .badge.badge-mini {
        padding: 0;
        font-size: 10px;
        width: 15px;
        height: 15px;
        line-height: 15px;
        vertical-align: middle;
        position: absolute;
        left: 18px;
        top: 2px
    }

.panel {
    border-radius: 1px
}

.panel-heading {
    padding: 10px 15px;
    border-radius: 0
}

.well {
    padding: 40px;
    background-color: #F5F8FA;
    border: 1px solid #F5F8FA
}

.pagination li a {
    border-color: #e1e8ee
}

.list-group-item {
    border: 1px solid #e1e8ee
}

.thumbnail .caption {
    padding: 25px 4px 10px
}

.service-blocks .service-block {
    margin-bottom: 35px
}

    .service-blocks .service-block .service-icon {
        float: left;
        margin: 10px
    }

        .service-blocks .service-block .service-icon i {
            border-radius: 100%;
            color: #5e686f;
            display: block;
            height: 70px;
            line-height: 70px;
            text-align: center;
            width: 70px
        }

    .service-blocks .service-block:hover .service-icon i {
        opacity: .5
    }

    .service-blocks .service-block .service-icon i::before {
        font-size: 60px
    }

    .service-blocks .service-block .service-content {
        overflow: hidden
    }

        .service-blocks .service-block .service-content h3 {
            font-size: 18px;
            margin-bottom: 10px;
            font-weight: 400
        }

            .service-blocks .service-block .service-content h3 a {
                color: #606676
            }

                .service-blocks .service-block .service-content h3 a:hover {
                    color: #557CB5
                }

    .service-blocks .service-block .btn {
        margin: 20px 0 10px
    }

    .service-blocks .service-block.s1 .service-icon {
        float: none
    }

    .service-blocks .service-block.s2 {
        padding: 20px
    }

        .service-blocks .service-block.s2 .service-icon i::before {
            font-size: 40px
        }

.service-blocks .center {
    text-align: center
}

    .service-blocks .center .service-icon {
        float: none !important
    }

        .service-blocks .center .service-icon i {
            margin: 0 auto
        }

.single-service-contents {
    padding: 100px 0 65px
}

.home-cards-container {
    height: 100%;
    max-width: 1200px;
    margin: 0 auto;
    overflow: hidden;
    padding: 60px 0
}

    .home-cards-container h1 {
        font-size: 1.294rem;
        font-weight: 400;
        text-align: center
    }

    .home-cards-container p {
        font-size: .85rem;
        line-height: 20px
    }

    .home-cards-container ul {
        color: #005C92;
        list-style-type: none;
        font-size: .9rem;
        line-height: 36px;
        margin-left: 0
    }

        .home-cards-container ul li a {
            color: #0079c1 !important
        }

.home-card {
    position: relative;
    float: left;
    background: #fafafa;
    width: 23%;
    margin-left: 2%;
    border-bottom: 1px solid #0079c1;
    border-top: 3px solid #0079c1;
    text-align: center;
    padding-top: 40px
}

    .home-card h1 {
        margin-bottom: 16px;
        padding-top: 10px;
        padding-bottom: 10px;
        border-bottom: solid 1px #ddd
    }

.home-card-1 .card-head {
    background-color: #0079c1
}

.home-card-2 .card-head {
    background-color: #40d17d
}

.home-card-3 .card-head {
    background-color: #fb6620
}

.home-card-4 .card-head {
    background-color: #f1c40f;
    margin-right: 0
}

.home-card .card-head {
    position: absolute;
    top: -50px;
    left: 60px;
    left: calc(50% - 50px);
    width: 100px;
    height: 100px;
    line-height: 100px;
    border-radius: 50%
}

.home-card .card-image {
    background: center no-repeat;
    width: 100px;
    height: 100px
}

.home-card .card-icon {
    font-size: 48px !important;
    padding-top: 24px
}

@media (max-width: 1000px) {
    .home-cards-container {
        padding: 60px 0 0
    }

    .home-card {
        margin: 30px 40px 50px;
        width: 90%;
        width: calc(100% - 80px)
    }

        .home-card .card-head {
            top: -35px;
            left: calc(50% - 35px);
            width: 70px;
            height: 70px;
            line-height: 70px
        }

        .home-card .card-image {
            width: 70px;
            height: 70px;
            background-size: 40%
        }

        .home-card .card-icon {
            font-size: 36px !important;
            padding-top: 16px
        }

    .home-card-1 .card-head .card-image {
        background-size: 20%
    }

    .home-card .card-body {
        width: 70%;
        width: calc(100% - 300px);
        margin: 0 auto
    }
}

@media (min-width: 2060px) {
    .home-cards-container {
        max-width: 1440px
    }
}

@media only screen and (max-width: 768px) {
    .home-cards-container {
        width: 100%;
        height: 100%;
        max-width: 100%;
        padding: 40px 15px
    }

    .home-card {
        margin: 30px 0 50px;
        width: 100%
    }

        .home-card .card-icon {
            font-size: 36px !important;
            padding-top: 16px
        }

        .home-card .card-body {
            padding: 0;
            display: block;
            margin: 0 auto;
            width: calc(100% - 80px)
        }
}

.lightSlider {
    visibility: hidden;
    opacity: 0
}

    .lightSlider .lSAction > .lSNext, .lightSlider .lSAction > .lSPrev {
        background: 0 0 !important
    }

    .lightSlider .lslide {
        position: relative
    }

    .lightSlider .slide-caption {
        position: absolute;
        text-align: center;
        background: rgba(0,0,0,.8);
        padding: 40px;
        color: #fff;
        width: 600px;
        margin: 0 auto;
        vertical-align: middle;
        top: 30%;
        left: 0;
        right: 0
    }

        .lightSlider .slide-caption p {
            margin: 20px 0
        }

@media (max-width: 1031px) {
    .lightSlider .slide-caption {
        display: none
    }

    .call-to-action {
        text-align: center
    }
}

.lightSlider .carousel-caption {
    position: absolute;
    padding-top: 20px;
    padding-bottom: 20px;
    color: #5e686f;
    text-align: center;
    text-shadow: none;
    top: 25%
}

.lightSlider .overlay {
    z-index: 0
}

.pager-ab-top-left .lSPager.lSpg {
    position: absolute !important;
    top: 8px;
    left: 30px
}

.showSlider {
    visibility: visible;
    opacity: 1;
    transition: visibility 0s,opacity .5s linear
}

.lSSlideOuter .lSPager.lSpg > li a {
    background-color: #E1E8EE;
    height: 10px;
    width: 10px
}

.lSSlideOuter .lSPager.lSpg > li.active a, .lSSlideOuter .lSPager.lSpg > li:hover a {
    background-color: #557CB5
}

.lSPager.lSGallery img {
    opacity: .3
}

    .lSPager.lSGallery .active img, .lSPager.lSGallery img:hover {
        opacity: 1
    }

@media (min-width: 1031px) {
    .lslide.active .typewriter {
        overflow: hidden;
        border-right: .15em solid rgba(0,0,0,.5);
        white-space: nowrap;
        margin: 0 auto;
        animation: typing 3.5s steps(40,end),blink-caret .75s step-end infinite
    }
}

@keyframes typing {
    from {
        width: 0
    }

    to {
        width: 100%
    }
}

@keyframes blink-caret {
    from,to {
        border-color: transparent
    }

    50% {
        border-color: rgba(0,0,0,.4)
    }
}

.call-to-action .btn-action {
    float: right
}

.circular-progressbar {
    text-align: center
}

    .circular-progressbar h6 {
        margin: 20px 0 0;
        font-size: 16px;
        font-weight: 700
    }

    .circular-progressbar span.rate {
        font-size: 12px;
        text-transform: uppercase
    }

.circular-progressbar-inner {
    position: relative
}

    .circular-progressbar-inner span.knob-percent {
        position: absolute;
        top: 50%;
        margin-top: -17px;
        left: 0;
        right: 0;
        z-index: 10;
        font-size: 35px;
        line-height: 35px;
        margin-right: -5px
    }

.circular-progressbar.small .circular-progressbar-inner span.knob-percent {
    font-size: 25px;
    margin-top: -18px
}

.circular-progressbar-inner span.knob-percent span {
    font-size: 15px;
    vertical-align: top;
    line-height: 24px;
    font-weight: 700
}

.circular-progressbar.small .circular-progressbar-inner span.knob-percent span {
    font-size: 12px;
    line-height: 28px
}

.progressbar {
    margin: 30px 0
}

    .progressbar .progressbar-title {
        font-size: 16px;
        font-weight: 700;
        color: #333;
        display: block;
        margin: 0 0 10px
    }

.progressbar-container {
    position: relative;
    border: 1px solid #e9e9e9;
    background: #eee;
    height: 8px;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px
}

    .progressbar-container .progress-width {
        position: relative;
        height: 8px;
        width: 0;
        background: #eb5858;
        border-radius: 3px 0 0 3px;
        -webkit-border-radius: 3px 0 0 3px;
        -moz-border-radius: 3px 0 0 3px
    }

        .progressbar-container .progress-width:after {
            content: '';
            width: 18px;
            height: 18px;
            background: #fff;
            border: 1px solid #e6e6e6;
            position: absolute;
            right: -9px;
            top: -5px;
            border-radius: 50%;
            -webkit-border-radius: 50%;
            -moz-border-radius: 50%
        }

    .progressbar-container .progress-percent {
        position: absolute;
        left: 0;
        display: none;
        top: -45px;
        width: 45px;
        height: 25px;
        border: 1px solid #e5e5e5;
        text-align: center;
        padding: 3px 0;
        font-size: 13px;
        color: #333;
        margin-left: -22px
    }

        .progressbar-container .progress-percent:after {
            content: '';
            position: absolute;
            left: 50%;
            margin-left: -6px;
            bottom: -6px;
            border-left: 6px solid transparent;
            border-right: 6px solid transparent;
            border-top: 6px solid #fff
        }

        .progressbar-container .progress-percent:before {
            content: '';
            position: absolute;
            left: 50%;
            margin-left: -7px;
            bottom: -7px;
            border-left: 7px solid transparent;
            border-right: 7px solid transparent;
            border-top: 7px solid #e5e5e5
        }

.counter-box .icon {
    font-size: 48px;
    height: 60px;
    display: block
}

.counter-box .sc-counter {
    font-size: 24px
}

.counter-box .counter-title {
    font-size: 16px
}

.sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 9;
    align-self: flex-start
}

    .sticky:after, sticky:before {
        content: '';
        display: table
    }

.video-background {
    background: #000;
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto
}

    .video-background iframe, .video-background video, .video-foreground {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        pointer-events: none
    }

@media (min-aspect-ratio: 16 9) {
    .video-foreground {
        height: 300%;
        top: -100%
    }
}

@media (max-aspect-ratio: 16 9) {
    .video-foreground {
        width: 300%;
        left: -100%
    }
}

@media all and (max-width: 600px) {
    .vid-info {
        width: 50%;
        padding: .5rem
    }

        .vid-info h1 {
            margin-bottom: .2rem
        }
}

.call-to-action {
    border: 3px solid #e1e8ee;
    border-radius: 3px;
    padding: 20px;
    margin: 20px 0
}

.b-t, .b-t-b {
    border-top: 1px solid #e1e8ee
}

.call-to-action .action-btn {
    display: inline-block;
    float: right
}

.call-to-action h3 {
    font-size: 22px;
    font-weight: 400;
    color: #84919b;
    margin: 0 0 10px
}

.call-to-action p {
    font-size: 18px;
    font-weight: 300;
    color: #84919b
}

.call-to-action .btn-action {
    margin-top: 12px
}

.promotionsBar {
    position: relative;
    color: #fff;
    background: #557CB5;
    z-index: 98
}

.section-text-white h1, .section-text-white h2, .section-text-white h3, .section-text-white h4, .section-text-white h5, .section-text-white h6, .section-text-white p, .section-text-white span, .text-white, .text-white a, .text-white b, .text-white h1, .text-white h2, .text-white h3, .text-white h4, .text-white h5, .text-white h6, .text-white i, .text-white li, .text-white p, .text-white span, .text-white strong {
    color: #fff !important
}

.promotionsBar .promotionsMsg {
    padding: 15px;
    position: relative
}

    .promotionsBar .promotionsMsg p {
        font-size: 16px;
        font-weight: 100;
        margin: 0
    }

    .promotionsBar .promotionsMsg .btn {
        position: absolute;
        right: 0;
        top: 8px
    }

.p-t-0 {
    padding-top: 0 !important
}

.p-t-10 {
    padding-top: 10px !important
}

.p-b-10 {
    padding-bottom: 10px !important
}

.p-t-20 {
    padding-top: 20px !important
}

.p-b-20 {
    padding-bottom: 20px !important
}

.p-t-40 {
    padding-top: 40px !important
}

.p-b-40 {
    padding-bottom: 40px !important
}

.p-t-80 {
    padding-top: 80px !important
}

.p-b-80 {
    padding-bottom: 80px !important
}

.p-b-100 {
    padding-bottom: 100px !important
}

.p-t-100 {
    padding-top: 100px !important
}

.p-t-b-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important
}

.p-t-b-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important
}

.p-t-b-40 {
    padding-top: 40px !important;
    padding-bottom: 40px !important
}

.p-t-b-50 {
    padding-top: 50px !important;
    padding-bottom: 50px !important
}

.p-t-b-80 {
    padding: 80px 0 !important
}

.p-t-b-100 {
    padding: 100px 0 !important
}

.p-10 {
    padding: 10px !important
}

.p-20 {
    padding: 20px !important
}

.p-40 {
    padding: 40px !important
}

.p-t-50 {
    padding-top: 50px !important
}

.m-t-50 {
    margin-top: 50px !important
}

.m-t-150 {
    margin-top: 150px
}

@media (max-width: 1031px) {
    .promotionsBar .promotionsMsg .btn {
        position: relative
    }

    .m-t-150 {
        margin-top: 50px
    }
}

.m-b-50 {
    margin-bottom: 50px !important
}

.m-t-b-50 {
    margin: 50px 0 !important
}

.p-b-0 {
    padding-bottom: 0 !important
}

.b-b {
    border-bottom: 1px solid #e1e8ee !important
}

@media (min-width: 1031px) {
    .b-r {
        border-right: 1px solid #e1e8ee
    }

    .b-l {
        border-left: 1px solid #e1e8ee
    }

    .b-r-o {
        border-right: 1px solid rgba(0,0,0,.09)
    }

    .b-l-o {
        border-left: 1px solid rgba(0,0,0,.09)
    }
}

.b-t-b {
    border-bottom: 1px solid #e1e8ee
}

.border {
    border: 1px solid #e1e8ee
}

.no-p {
    padding: 0 !important
}

.no-m {
    margin: 0 !important
}

.b-0, .no-b, .no-b .mainnav, .no-b li {
    border: none !important
}

.no-r, .r-0 {
    border-radius: 0 !important
}

.separator {
    border-bottom: 1px solid #edf0f2
}

.grid img {
    border-radius: 0
}

.r-3 {
    border-radius: 3px !important
}

.r-5 {
    border-radius: 5px !important
}

.r-10 {
    border-radius: 10px !important
}

.r-15 {
    border-radius: 15px !important
}

.r-20 {
    border-radius: 20px !important
}

.r-30 {
    border-radius: 30px !important
}

.paper-card {
    background: #fff;
    padding: 40px
}

.shadow1 {
    box-shadow: 0 3px 9px 0 rgba(0,0,0,.26)
}

.no-shadow {
    box-shadow: none !important
}

.text-big-bold {
    font-size: 62px;
    font-weight: 800;
    line-height: 62px
}

.font-weight-lighter, .thin {
    font-weight: 100 !important
}

.bolder, .font-weight-bolder {
    font-weight: 900 !important
}

.l-s-1 {
    letter-spacing: .2rem
}

.l-s-2 {
    letter-spacing: .4rem
}

.l-s-3 {
    letter-spacing: .6rem
}

.l-s-4 {
    letter-spacing: .8rem
}

.l-s-5 {
    letter-spacing: 1rem
}

.s-12 {
    font-size: 12px !important
}

.s-14 {
    font-size: 14px !important
}

.s-18 {
    font-size: 18px !important
}

.s-24 {
    font-size: 24px !important
}

.s-36 {
    font-size: 36px !important
}

@media (min-width: 1031px) {
    .s-48 {
        font-size: 48px !important
    }

    .s-64 {
        font-size: 64px !important
    }

    .s-128 {
        font-size: 128px !important
    }
}

.s-256 {
    font-size: 256px !important
}

@media (max-width: 420px) {
    .s-256 {
        font-size: 128px !important
    }
}

.img-40 {
    width: 40px;
    height: 40px
}

.w-10 {
    width: 10%
}

.w-15 {
    width: 15%
}

.img-80 {
    width: 80px
}

.img-100 {
    width: 100px
}

.img-150 {
    width: 150px
}

.height-50 {
    height: 50px
}

.height-90 {
    height: 90px
}

.height-100 {
    height: 100px
}

.height-full {
    background: #F3F5F8;
    min-height: 100vh
}

.width-400 {
    max-width: 400px
}

.width-250 {
    width: 250px !important
}

.width-900 {
    max-width: 900px
}

.img-border {
    padding: 5px;
    border: 1px solid #e1e8ee
}

.text-blue {
    color: #4ea9e0 !important
}

.text-red {
    color: #e84c3d !important
}

.text-green {
    color: #40d17d !important
}

.text-purple {
    color: #9b58b5 !important
}

.text-black {
    color: #000 !important
}

.text-yellow {
    color: #f1c40f !important
}

.white {
    background: #fff !important
}

.light {
    background-color: #F5F8FA
}

.text-light-blue {
    color: #557CB5 !important
}

.dark-blue {
    background-color: #26374A !important
}

.blue4 {
    background-color: #274da8 !important
}

.blue3 {
    background-color: #375EBC !important
}

.blue2 {
    background-color: #4CA5E8 !important
}

.blue1 {
    background-color: #78BCEE !important
}

.success {
    background-color: #68ba3c !important
}

.danger, .strawberry {
    background-color: #ED5564 !important
}

.sunfollower, warning {
    background-color: #FCCE54 !important
}

.grey-black {
    background-color: #454545 !important
}

.dark-grey {
    background-color: #2B2D34 !important
}

.paper-white {
    background: #f5f8fa
}

.mint {
    background-color: #45CFC0 !important
}

.gradient {
    border: none;
    background: #4c88ef;
    background: -webkit-gradient(linear,left top,right bottom,color-stop(0,#4c88ef),color-stop(100%,#17e4d9));
    background: -webkit-linear-gradient(315deg,#4c88ef 0,#17e4d9 100%);
    background: linear-gradient(135deg,#4c88ef 0,#17e4d9 100%)
}

.gradient-green {
    background-image: linear-gradient(45deg,#00E3AE 0,#9BE15D 100%)
}

.center {
    margin: 0 auto
}

.border-list li {
    border-bottom: 1px solid #eee
}

    .border-list li: last-child {
        border: none
    }

.parallel {
    overflow-x: hidden;
    width: 100%
}

@media (min-width: 1031px) {
    .big-heading {
        font-size: 72px
    }

    .parallel {
        overflow: hidden;
        position: fixed
    }

    .grid.grid-border [class*=col-] {
        border-right: 1px solid #eee
    }

        .grid.grid-border [class*=col-]: last-child {
            border-right: 0
        }

    .grid.grid-border.row {
        border-top: 1px solid #eee
    }

        .grid.grid-border.row: nth-of-type(1) {
            border-top: none !important
        }
}

.section {
    position: relative
}

.relative {
    position: relative !important
}

.fixed {
    position: fixed !important
}

[data-bg-repeat=false] {
    background-repeat: no-repeat !important
}

[data-bg-possition=bottom] {
    background-position: bottom !important
}

[data-bg-possition=top] {
    background-position: top !important
}

[data-bg-possition=center] {
    background-position: center !important
}

[data-bg-possition=centerleft] {
    background-position: center left !important
}

.grid [class*=col-], .grid figure {
    padding: 0;
    margin: 0
}

ul.list-group.list-group-striped li: nth-of-type(even) {
    background: #F5F8FA
}

ul.list-group.list-group-hover li:hover {
    background: red
}

.mdb-color.lighten-5 {
    background-color: #D0D6E2 !important
}

.mdb-color.lighten-4 {
    background-color: #B1BACE !important
}

.mdb-color.lighten-3 {
    background-color: #929FBA !important
}

.mdb-color.lighten-2 {
    background-color: #7283A7 !important
}

.mdb-color.lighten-1 {
    background-color: #59698D !important
}

.mdb-color-text {
    color: #45526E !important
}

.mdb-color.darken-1 {
    background-color: #3B465E !important
}

.mdb-color.darken-2 {
    background-color: #2E3951 !important
}

.mdb-color.darken-3 {
    background-color: #1C2A48 !important
}

.mdb-color.darken-4 {
    background-color: #1C2331 !important
}

.red.lighten-5 {
    background-color: #FFEBEE !important
}

.red.lighten-4 {
    background-color: #FFCDD2 !important
}

.red.lighten-3 {
    background-color: #EF9A9A !important
}

.red.lighten-2 {
    background-color: #E57373 !important
}

.red.lighten-1 {
    background-color: #EF5350 !important
}

.red {
    background-color: #F44336 !important
}

.red-text {
    color: #F44336 !important
}

.red.darken-1 {
    background-color: #E53935 !important
}

.red.darken-2 {
    background-color: #D32F2F !important
}

.red.darken-3 {
    background-color: #C62828 !important
}

.red.darken-4 {
    background-color: #B71C1C !important
}

.red.accent-1 {
    background-color: #FF8A80 !important
}

.red.accent-2 {
    background-color: #FF5252 !important
}

.red.accent-3 {
    background-color: #FF1744 !important
}

.red.accent-4 {
    background-color: #D50000 !important
}

.pink.lighten-5 {
    background-color: #fce4ec !important
}

.pink.lighten-4 {
    background-color: #f8bbd0 !important
}

.pink.lighten-3 {
    background-color: #f48fb1 !important
}

.pink.lighten-2 {
    background-color: #f06292 !important
}

.pink.lighten-1 {
    background-color: #ec407a !important
}

.pink {
    background-color: #e91e63 !important
}

.pink-text {
    color: #e91e63 !important
}

.pink.darken-1 {
    background-color: #d81b60 !important
}

.pink.darken-2 {
    background-color: #c2185b !important
}

.pink.darken-3 {
    background-color: #ad1457 !important
}

.pink.darken-4 {
    background-color: #880e4f !important
}

.pink.accent-1 {
    background-color: #ff80ab !important
}

.pink.accent-2 {
    background-color: #ff4081 !important
}

.pink.accent-3 {
    background-color: #f50057 !important
}

.pink.accent-4 {
    background-color: #c51162 !important
}

.purple.lighten-5 {
    background-color: #f3e5f5 !important
}

.purple.lighten-4 {
    background-color: #e1bee7 !important
}

.purple.lighten-3 {
    background-color: #ce93d8 !important
}

.purple.lighten-2 {
    background-color: #ba68c8 !important
}

.purple.lighten-1 {
    background-color: #ab47bc !important
}

.purple {
    background-color: #9c27b0 !important
}

.purple-text {
    color: #9c27b0 !important
}

.purple.darken-1 {
    background-color: #8e24aa !important
}

.purple.darken-2 {
    background-color: #7b1fa2 !important
}

.purple.darken-3 {
    background-color: #6a1b9a !important
}

.purple.darken-4 {
    background-color: #4a148c !important
}

.purple.accent-1 {
    background-color: #ea80fc !important
}

.purple.accent-2 {
    background-color: #e040fb !important
}

.purple.accent-3 {
    background-color: #d500f9 !important
}

.purple.accent-4 {
    background-color: #a0f !important
}

.deep-purple.lighten-5 {
    background-color: #ede7f6 !important
}

.deep-purple.lighten-4 {
    background-color: #d1c4e9 !important
}

.deep-purple.lighten-3 {
    background-color: #b39ddb !important
}

.deep-purple.lighten-2 {
    background-color: #9575cd !important
}

.deep-purple.lighten-1 {
    background-color: #7e57c2 !important
}

.deep-purple {
    background-color: #673ab7 !important
}

.deep-purple-text {
    color: #673ab7 !important
}

.deep-purple.darken-1 {
    background-color: #5e35b1 !important
}

.deep-purple.darken-2 {
    background-color: #512da8 !important
}

.deep-purple.darken-3 {
    background-color: #4527a0 !important
}

.deep-purple.darken-4 {
    background-color: #311b92 !important
}

.deep-purple.accent-1 {
    background-color: #b388ff !important
}

.deep-purple.accent-2 {
    background-color: #7c4dff !important
}

.deep-purple.accent-3 {
    background-color: #651fff !important
}

.deep-purple.accent-4 {
    background-color: #6200ea !important
}

.indigo.lighten-5 {
    background-color: #e8eaf6 !important
}

.indigo.lighten-4 {
    background-color: #c5cae9 !important
}

.indigo.lighten-3 {
    background-color: #9fa8da !important
}

.indigo.lighten-2 {
    background-color: #7986cb !important
}

.indigo.lighten-1 {
    background-color: #5c6bc0 !important
}

.indigo {
    background-color: #3f51b5 !important
}

.indigo-text {
    color: #3f51b5 !important
}

.indigo.darken-1 {
    background-color: #3949ab !important
}

.indigo.darken-2 {
    background-color: #303f9f !important
}

.indigo.darken-3 {
    background-color: #283593 !important
}

.indigo.darken-4 {
    background-color: #1a237e !important
}

.indigo.accent-1 {
    background-color: #8c9eff !important
}

.indigo.accent-2 {
    background-color: #536dfe !important
}

.indigo.accent-3 {
    background-color: #3d5afe !important
}

.indigo.accent-4 {
    background-color: #304ffe !important
}

.blue.lighten-5 {
    background-color: #E3F2FD !important
}

.blue.lighten-4 {
    background-color: #BBDEFB !important
}

.blue.lighten-3 {
    background-color: #90CAF9 !important
}

.blue.lighten-2 {
    background-color: #64B5F6 !important
}

.blue.lighten-1 {
    background-color: #42A5F5 !important
}

.blue {
    background-color: #2196F3 !important
}

.blue-text {
    color: #2196F3 !important
}

.blue.darken-1 {
    background-color: #1E88E5 !important
}

.blue.darken-2 {
    background-color: #1976D2 !important
}

.blue.darken-3 {
    background-color: #1565C0 !important
}

.blue.darken-4 {
    background-color: #0D47A1 !important
}

.blue.accent-1 {
    background-color: #82B1FF !important
}

.blue.accent-2 {
    background-color: #448AFF !important
}

.blue.accent-3 {
    background-color: #2979FF !important
}

.blue.accent-4 {
    background-color: #2962FF !important
}

.light-blue.lighten-5 {
    background-color: #e1f5fe !important
}

.light-blue.lighten-4 {
    background-color: #b3e5fc !important
}

.light-blue.lighten-3 {
    background-color: #81d4fa !important
}

.light-blue.lighten-2 {
    background-color: #4fc3f7 !important
}

.light-blue.lighten-1 {
    background-color: #29b6f6 !important
}

.light-blue {
    background-color: #557CB5 !important
}

    .light-blue.darken-1 {
        background-color: #039be5 !important
    }

    .light-blue.darken-2 {
        background-color: #0288d1 !important
    }

    .light-blue.darken-3 {
        background-color: #0277bd !important
    }

    .light-blue.darken-4 {
        background-color: #01579b !important
    }

    .light-blue.accent-1 {
        background-color: #80d8ff !important
    }

    .light-blue.accent-2 {
        background-color: #40c4ff !important
    }

    .light-blue.accent-3 {
        background-color: #00b0ff !important
    }

    .light-blue.accent-4 {
        background-color: #0091ea !important
    }

.cyan.lighten-5 {
    background-color: #e0f7fa !important
}

.cyan.lighten-4 {
    background-color: #b2ebf2 !important
}

.cyan.lighten-3 {
    background-color: #80deea !important
}

.cyan.lighten-2 {
    background-color: #4dd0e1 !important
}

.cyan.lighten-1 {
    background-color: #26c6da !important
}

.cyan {
    background-color: #00bcd4 !important
}

.cyan-text {
    color: #00bcd4 !important
}

.cyan.darken-1 {
    background-color: #00acc1 !important
}

.cyan.darken-2 {
    background-color: #0097a7 !important
}

.cyan.darken-3 {
    background-color: #00838f !important
}

.cyan.darken-4 {
    background-color: #006064 !important
}

.cyan.accent-1 {
    background-color: #84ffff !important
}

.cyan.accent-2 {
    background-color: #18ffff !important
}

.cyan.accent-3 {
    background-color: #00e5ff !important
}

.cyan.accent-4 {
    background-color: #00b8d4 !important
}

.teal.lighten-5 {
    background-color: #e0f2f1 !important
}

.teal.lighten-4 {
    background-color: #b2dfdb !important
}

.teal.lighten-3 {
    background-color: #80cbc4 !important
}

.teal.lighten-2 {
    background-color: #4db6ac !important
}

.teal.lighten-1 {
    background-color: #26a69a !important
}

.teal {
    background-color: #009688 !important
}

.teal-text {
    color: #009688 !important
}

.teal.darken-1 {
    background-color: #00897b !important
}

.teal.darken-2 {
    background-color: #00796b !important
}

.teal.darken-3 {
    background-color: #00695c !important
}

.teal.darken-4 {
    background-color: #004d40 !important
}

.teal.accent-1 {
    background-color: #a7ffeb !important
}

.teal.accent-2 {
    background-color: #64ffda !important
}

.teal.accent-3 {
    background-color: #1de9b6 !important
}

.teal.accent-4 {
    background-color: #00bfa5 !important
}

.green.lighten-5 {
    background-color: #E8F5E9 !important
}

.green.lighten-4 {
    background-color: #C8E6C9 !important
}

.green.lighten-3 {
    background-color: #A5D6A7 !important
}

.green.lighten-2 {
    background-color: #81C784 !important
}

.green.lighten-1 {
    background-color: #66BB6A !important
}

.green {
    background-color: #4CAF50 !important
}

.green-text {
    color: #4CAF50 !important
}

.green.darken-1 {
    background-color: #43A047 !important
}

.green.darken-2 {
    background-color: #388E3C !important
}

.green.darken-3 {
    background-color: #2E7D32 !important
}

.green.darken-4 {
    background-color: #1B5E20 !important
}

.green.accent-1 {
    background-color: #B9F6CA !important
}

.green.accent-2 {
    background-color: #69F0AE !important
}

.green.accent-3 {
    background-color: #00E676 !important
}

.green.accent-4 {
    background-color: #00C853 !important
}

.light-green.lighten-5 {
    background-color: #f1f8e9 !important
}

.light-green.lighten-4 {
    background-color: #dcedc8 !important
}

.light-green.lighten-3 {
    background-color: #c5e1a5 !important
}

.light-green.lighten-2 {
    background-color: #aed581 !important
}

.light-green.lighten-1 {
    background-color: #9ccc65 !important
}

.light-green {
    background-color: #8bc34a !important
}

.light-green-text {
    color: #8bc34a !important
}

.light-green.darken-1 {
    background-color: #7cb342 !important
}

.light-green.darken-2 {
    background-color: #689f38 !important
}

.light-green.darken-3 {
    background-color: #558b2f !important
}

.light-green.darken-4 {
    background-color: #33691e !important
}

.light-green.accent-1 {
    background-color: #ccff90 !important
}

.light-green.accent-2 {
    background-color: #b2ff59 !important
}

.light-green.accent-3 {
    background-color: #76ff03 !important
}

.light-green.accent-4 {
    background-color: #64dd17 !important
}

.lime.lighten-5 {
    background-color: #f9fbe7 !important
}

.lime.lighten-4 {
    background-color: #f0f4c3 !important
}

.lime.lighten-3 {
    background-color: #e6ee9c !important
}

.lime.lighten-2 {
    background-color: #dce775 !important
}

.lime.lighten-1 {
    background-color: #d4e157 !important
}

.lime {
    background-color: #cddc39 !important
}

.lime-text {
    color: #cddc39 !important
}

.lime.darken-1 {
    background-color: #c0ca33 !important
}

.lime.darken-2 {
    background-color: #afb42b !important
}

.lime.darken-3 {
    background-color: #9e9d24 !important
}

.lime.darken-4 {
    background-color: #827717 !important
}

.lime.accent-1 {
    background-color: #f4ff81 !important
}

.lime.accent-2 {
    background-color: #eeff41 !important
}

.lime.accent-3 {
    background-color: #c6ff00 !important
}

.lime.accent-4 {
    background-color: #aeea00 !important
}

.yellow.lighten-5 {
    background-color: #fffde7 !important
}

.yellow.lighten-4 {
    background-color: #fff9c4 !important
}

.yellow.lighten-3 {
    background-color: #fff59d !important
}

.yellow.lighten-2 {
    background-color: #fff176 !important
}

.yellow.lighten-1 {
    background-color: #ffee58 !important
}

.yellow {
    background-color: #ffeb3b !important
}

.yellow-text {
    color: #ffeb3b !important
}

.yellow.darken-1 {
    background-color: #fdd835 !important
}

.yellow.darken-2 {
    background-color: #fbc02d !important
}

.yellow.darken-3 {
    background-color: #f9a825 !important
}

.yellow.darken-4 {
    background-color: #f57f17 !important
}

.yellow.accent-1 {
    background-color: #ffff8d !important
}

.yellow.accent-2 {
    background-color: #ff0 !important
}

.yellow.accent-3 {
    background-color: #ffea00 !important
}

.yellow.accent-4 {
    background-color: #ffd600 !important
}

.amber.lighten-5 {
    background-color: #fff8e1 !important
}

.amber.lighten-4 {
    background-color: #ffecb3 !important
}

.amber.lighten-3 {
    background-color: #ffe082 !important
}

.amber.lighten-2 {
    background-color: #ffd54f !important
}

.amber.lighten-1 {
    background-color: #ffca28 !important
}

.amber {
    background-color: #ffc107 !important
}

.amber-text {
    color: #ffc107 !important
}

.amber.darken-1 {
    background-color: #ffb300 !important
}

.amber.darken-2 {
    background-color: #ffa000 !important
}

.amber.darken-3 {
    background-color: #ff8f00 !important
}

.amber.darken-4 {
    background-color: #ff6f00 !important
}

.amber.accent-1 {
    background-color: #ffe57f !important
}

.amber.accent-2 {
    background-color: #ffd740 !important
}

.amber.accent-3 {
    background-color: #ffc400 !important
}

.amber.accent-4 {
    background-color: #ffab00 !important
}

.orange.lighten-5 {
    background-color: #fff3e0 !important
}

.orange.lighten-4 {
    background-color: #ffe0b2 !important
}

.orange.lighten-3 {
    background-color: #ffcc80 !important
}

.orange.lighten-2 {
    background-color: #ffb74d !important
}

.orange.lighten-1 {
    background-color: #ffa726 !important
}

.orange {
    background-color: #ff9800 !important
}

.orange-text {
    color: #ff9800 !important
}

.orange.darken-1 {
    background-color: #fb8c00 !important
}

.orange.darken-2 {
    background-color: #f57c00 !important
}

.orange.darken-3 {
    background-color: #ef6c00 !important
}

.orange.darken-4 {
    background-color: #e65100 !important
}

.orange.accent-1 {
    background-color: #ffd180 !important
}

.orange.accent-2 {
    background-color: #ffab40 !important
}

.orange.accent-3 {
    background-color: #ff9100 !important
}

.orange.accent-4 {
    background-color: #ff6d00 !important
}

.deep-orange.lighten-5 {
    background-color: #fbe9e7 !important
}

.deep-orange.lighten-4 {
    background-color: #ffccbc !important
}

.deep-orange.lighten-3 {
    background-color: #ffab91 !important
}

.deep-orange.lighten-2 {
    background-color: #ff8a65 !important
}

.deep-orange.lighten-1 {
    background-color: #ff7043 !important
}

.deep-orange {
    background-color: #ff5722 !important
}

.deep-orange-text {
    color: #ff5722 !important
}

.deep-orange.darken-1 {
    background-color: #f4511e !important
}

.deep-orange.darken-2 {
    background-color: #e64a19 !important
}

.deep-orange.darken-3 {
    background-color: #d84315 !important
}

.deep-orange.darken-4 {
    background-color: #bf360c !important
}

.deep-orange.accent-1 {
    background-color: #ff9e80 !important
}

.deep-orange.accent-2 {
    background-color: #ff6e40 !important
}

.deep-orange.accent-3 {
    background-color: #ff3d00 !important
}

.deep-orange.accent-4 {
    background-color: #dd2c00 !important
}

.brown.lighten-5 {
    background-color: #efebe9 !important
}

.brown.lighten-4 {
    background-color: #d7ccc8 !important
}

.brown.lighten-3 {
    background-color: #bcaaa4 !important
}

.brown.lighten-2 {
    background-color: #a1887f !important
}

.brown.lighten-1 {
    background-color: #8d6e63 !important
}

.brown {
    background-color: #795548 !important
}

.brown-text {
    color: #795548 !important
}

.brown.darken-1 {
    background-color: #6d4c41 !important
}

.brown.darken-2 {
    background-color: #5d4037 !important
}

.brown.darken-3 {
    background-color: #4e342e !important
}

.brown.darken-4 {
    background-color: #3e2723 !important
}

.blue-grey.lighten-5 {
    background-color: #eceff1 !important
}

.blue-grey.lighten-4 {
    background-color: #cfd8dc !important
}

.blue-grey.lighten-3 {
    background-color: #b0bec5 !important
}

.blue-grey.lighten-2 {
    background-color: #90a4ae !important
}

.blue-grey.lighten-1 {
    background-color: #78909c !important
}

.blue-grey {
    background-color: #607d8b !important
}

.blue-grey-text {
    color: #607d8b !important
}

.blue-grey.darken-1 {
    background-color: #546e7a !important
}

.blue-grey.darken-2 {
    background-color: #455a64 !important
}

.blue-grey.darken-3 {
    background-color: #37474f !important
}

.blue-grey.darken-4 {
    background-color: #263238 !important
}

.grey.lighten-5 {
    background-color: #fafafa !important
}

.grey.lighten-4 {
    background-color: #f5f5f5 !important
}

.grey.lighten-3 {
    background-color: #eee !important
}

.grey.lighten-2 {
    background-color: #e0e0e0 !important
}

.grey.lighten-1 {
    background-color: #bdbdbd !important
}

.grey {
    background-color: #9e9e9e !important
}

.grey-text {
    color: #9e9e9e !important
}

.grey.darken-1 {
    background-color: #757575 !important
}

.grey.darken-2 {
    background-color: #616161 !important
}

.grey.darken-3 {
    background-color: #424242 !important
}

.grey.darken-4 {
    background-color: #212121 !important
}

.shades.black {
    background-color: #000 !important
}

.shades.white {
    background-color: #FFF !important
}

.shades.transparent {
    background-color: transparent !important
}

.black {
    background-color: #000 !important
}

.black-text {
    color: #000 !important
}

.white {
    background-color: #FFF !important
}

.white-text {
    color: #FFF !important
}

.transparent {
    background-color: transparent !important
}

.transparent-text {
    color: transparent !important
}

.light-blue-text {
    color: #82B1FF !important
}

.dark-grey-text {
    color: #4f4f4f !important
}

.danger-color {
    background-color: #ED5564 !important
}

.danger-color-dark {
    background-color: #C00 !important
}

.warning-color {
    background-color: #FCCE54 !important
}

.warning-color-dark {
    background-color: #F80 !important
}

.success-color {
    background-color: #7dc855 !important
}

.success-color-dark {
    background-color: #007E33 !important
}

.info-color {
    background-color: #78BCEE !important
}

.info-color-dark {
    background-color: #09C !important
}

.default-color {
    background-color: #2BBBAD !important
}

.default-color-dark {
    background-color: #00695c !important
}

.primary-color {
    background-color: #4285F4 !important
}

.primary-color-dark {
    background-color: #0d47a1 !important
}

.secondary-color {
    background-color: #a6c !important
}

.secondary-color-dark {
    background-color: #93C !important
}

.elegant-color {
    background-color: #2E2E2E !important
}

.elegant-color-dark {
    background-color: #212121 !important
}

.stylish-color {
    background-color: #4B515D !important
}

.stylish-color-dark {
    background-color: #3E4551 !important
}

.special-color {
    background-color: #37474F !important
}

.special-color-dark {
    background-color: #263238 !important
}

.unique-color {
    background-color: #3F729B !important
}

.unique-color-dark {
    background-color: #1C2331 !important
}

.mdb-color {
    background-color: #45526E !important
}

.rgba-blue-light {
    background-color: rgba(3,169,244,.3) !important
}

.rgba-red-light {
    background-color: rgba(244,67,54,.3) !important
}

.rgba-pink-light {
    background-color: rgba(233,30,99,.3) !important
}

.rgba-purple-light {
    background-color: rgba(156,39,176,.3) !important
}

.rgba-indigo-light {
    background-color: rgba(63,81,181,.3) !important
}

.rgba-cyan-light {
    background-color: rgba(0,188,212,.3) !important
}

.rgba-teal-light {
    background-color: rgba(0,150,136,.3) !important
}

.rgba-green-light {
    background-color: rgba(76,175,80,.3) !important
}

.rgba-lime-light {
    background-color: rgba(205,220,57,.3) !important
}

.rgba-yellow-light {
    background-color: rgba(255,235,59,.3) !important
}

.rgba-orange-light {
    background-color: rgba(255,152,0,.3) !important
}

.rgba-brown-light {
    background-color: rgba(121,85,72,.3) !important
}

.rgba-grey-light {
    background-color: rgba(158,158,158,.3) !important
}

.rgba-bluegrey-light {
    background-color: rgba(96,125,139,.3) !important
}

.rgba-black-light {
    background-color: rgba(0,0,0,.3) !important
}

.rgba-stylish-light {
    background-color: rgba(62,69,81,.3) !important
}

.rgba-white-light {
    background-color: rgba(255,255,255,.3) !important
}

.rgba-blue-strong {
    background-color: rgba(3,169,244,.7) !important
}

.rgba-red-strong {
    background-color: rgba(244,67,54,.7) !important
}

.rgba-pink-strong {
    background-color: rgba(233,30,99,.7) !important
}

.rgba-purple-strong {
    background-color: rgba(156,39,176,.7) !important
}

.rgba-indigo-strong {
    background-color: rgba(63,81,181,.7) !important
}

.rgba-cyan-strong {
    background-color: rgba(0,188,212,.7) !important
}

.rgba-teal-strong {
    background-color: rgba(0,150,136,.7) !important
}

.rgba-green-strong {
    background-color: rgba(76,175,80,.7) !important
}

.rgba-lime-strong {
    background-color: rgba(205,220,57,.7) !important
}

.rgba-yellow-strong {
    background-color: rgba(255,235,59,.7) !important
}

.rgba-orange-strong {
    background-color: rgba(255,152,0,.7) !important
}

.rgba-brown-strong {
    background-color: rgba(121,85,72,.7) !important
}

.rgba-grey-strong {
    background-color: rgba(158,158,158,.7) !important
}

.rgba-bluegrey-strong {
    background-color: rgba(96,125,139,.7) !important
}

.rgba-black-strong {
    background-color: rgba(0,0,0,.7) !important
}

.rgba-stylish-strong {
    background-color: rgba(62,69,81,.7) !important
}

.rgba-white-strong {
    background-color: rgba(255,255,255,.7) !important
}

.rgba-blue-slight {
    background-color: rgba(3,169,244,.1) !important
}

.rgba-red-slight {
    background-color: rgba(244,67,54,.1) !important
}

.rgba-pink-slight {
    background-color: rgba(233,30,99,.1) !important
}

.rgba-purple-slight {
    background-color: rgba(156,39,176,.1) !important
}

.rgba-indigo-slight {
    background-color: rgba(63,81,181,.1) !important
}

.rgba-cyan-slight {
    background-color: rgba(0,188,212,.1) !important
}

.rgba-teal-slight {
    background-color: rgba(0,150,136,.1) !important
}

.rgba-green-slight {
    background-color: rgba(76,175,80,.1) !important
}

.rgba-lime-slight {
    background-color: rgba(205,220,57,.1) !important
}

.rgba-yellow-slight {
    background-color: rgba(255,235,59,.1) !important
}

.rgba-orange-slight {
    background-color: rgba(255,152,0,.1) !important
}

.rgba-brown-slight {
    background-color: rgba(121,85,72,.1) !important
}

.rgba-grey-slight {
    background-color: rgba(158,158,158,.1) !important
}

.rgba-bluegrey-slight {
    background-color: rgba(96,125,139,.1) !important
}

.rgba-black-slight {
    background-color: rgba(0,0,0,.1) !important
}

.rgba-stylish-slight {
    background-color: rgba(62,69,81,.1) !important
}

.rgba-white-slight {
    background-color: rgba(255,255,255,.1) !important
}

.bg-primary {
    background-color: #4285F4 !important
}

.bg-danger {
    background-color: #ED5564 !important
}

.bg-warning {
    background-color: #F80 !important
}

.bg-success {
    background-color: #7dc855 !important
}

.bg-info {
    background-color: #78BCEE !important
}

.bg-default {
    background-color: #2BBBAD !important
}

.bg-secondary {
    background-color: #a6c !important
}

.bg-elegant {
    background-color: #2E2E2E !important
}

.bg-unique {
    background-color: #880e4f !important
}

.bg-dark-green {
    background-color: #388E3C !important
}

.bg-mdb-color {
    background-color: #59698D !important
}

.bg-red {
    background-color: #D32F2F !important
}

.bg-pink {
    background-color: #ec407a !important
}

.bg-purple {
    background-color: #8e24aa !important
}

.bg-deep-purple {
    background-color: #512da8 !important
}

.bg-indigo {
    background-color: #3f51b5 !important
}

.bg-blue {
    background-color: #1976D2 !important
}

.bg-light-blue {
    background-color: #82B1FF !important
}

.bg-cyan {
    background-color: #00bcd4 !important
}

.bg-teal {
    background-color: #00796b !important
}

.bg-green {
    background-color: #388E3C !important
}

.bg-light-green {
    background-color: #8bc34a !important
}

.bg-lime {
    background-color: #afb42b !important
}

.bg-yellow {
    background-color: #fbc02d !important
}

.bg-amber {
    background-color: #ffa000 !important
}

.bg-orange {
    background-color: #f57c00 !important
}

.bg-deep-orange {
    background-color: #ff7043 !important
}

.bg-brown {
    background-color: #795548 !important
}

.bg-grey {
    background-color: #616161 !important
}

.bg-blue-grey {
    background-color: #78909c !important
}

.bg-white {
    background-color: #fff !important
}

.bg-black {
    background-color: #000 !important
}

.zolkusowy-gradient {
    background: #00ff90;
    background: -moz-linear-gradient(top,#00ff90 0,#59ffdd 47%,#ff0 100%);
    background: -webkit-linear-gradient(top,#00ff90 0,#59ffdd 47%,#ff0 100%);
    background: linear-gradient(to bottom,#00ff90 0,#59ffdd 47%,#ff0 100%)
}

.blog .blog-default article {
    text-align: center;
    margin-bottom: 100px
}

.blog .blog-default .post-type {
    border: 3px solid #f5f8fa;
    border-radius: 50%;
    color: #a2acb4;
    display: inline-block;
    font-size: 18px;
    height: 50px;
    line-height: 45px;
    width: 50px
}

.latest-posts {
    margin: 50px 0
}

.blog-box .post {
    border: 3px solid #f5f8fa;
    border-radius: 3px;
    margin-bottom: 30px;
    padding: 25px
}

    .blog-box .post h2 {
        font-size: 14px;
        font-weight: 400;
        line-height: 1.5;
        padding-bottom: 10px;
        padding-top: 100px
    }

        .blog-box .post h2 a {
            color: #43484d
        }

            .blog-box .post h2 a:hover {
                text-decoration: none;
                outline: 0;
                color: #557CB5
            }

.blog-box .icon-article {
    position: absolute;
    top: 50px
}

.content-wrapper {
    padding: 40px 0
}

.post .featured img {
    box-shadow: 0 0 6px rgba(0,0,0,.1);
    padding: 10px
}

.post .meta {
    margin: 20px 0 0;
    padding-bottom: 10px
}

    .post .meta p {
        padding: 15px 0
    }

    .post .meta li {
        display: inline-block;
        font-weight: 300;
        color: #5e686f
    }

        .post .meta li i {
            padding-right: 5px
        }

        .post .meta li span {
            color: #43484d
        }

        .post .meta li::after {
            content: "|";
            padding: 0 20px
        }

        .post .meta li: last-child::after {
            content: none
        }

.post img {
    /*max-width: 100%;*/
    height: auto;
    width: 100%;
}

.post blockquote {
    background: #082c46;
    border: none;
    border-radius: 5px;
    color: #fff;
    font-family: monospace;
    font-size: 12px;
    margin: 30px 0;
    padding: 30px 50px;
    line-height: 30px
}

.feedback {
    border-top: 1px solid #eee
}

    .feedback input[type=text] {
        font-size: 18px;
        border-radius: 5px;
        border: 2px solid #e1e8ee;
        color: #43484d;
        height: 60px;
        width: 100%;
        margin: 20px 0;
        padding: 20px
    }

    .feedback .count {
        display: inline-block;
        padding-right: 15px;
        padding-top: 15px
    }

    .feedback .feedback-btn {
        display: inline-block;
        padding-left: 5px;
        padding-top: 15px;
        vertical-align: middle
    }

.feedback-icon {
    display: inline-block;
    width: 32px;
    height: 32px;
    border: 2px solid #B5BFC7;
    border-radius: 50%;
    font-size: 24px;
    padding-left: 0;
    line-height: 30px;
    vertical-align: center;
    color: #B5BFC7
}

.feedback-icon-yes:hover {
    color: #42D79E;
    border-color: #42D79E
}

.feedback-icon-not:hover {
    color: #F16261;
    border-color: #F16261
}

.single-masthead {
    padding: 30px
}

.single .post h1 {
    font-size: 31px;
    font-weight: 700;
    color: #0e3266;
}
}

.single .post .meta {
    text-align: center;
    margin: 20px;
    border-top: 1px solid #e1e8ee;
    border-bottom: 1px solid #e1e8ee
}

.single .post .excerpt {
    font-size: 20px;
    font-weight: 100;
    padding: 40px 0
}

.single .post-comments {
    padding: 20px 0;
    text-align: center
}

.mini li:after {
    padding: 0 13px !important
}

.article-title h2 {
    font-size: 19px;
    font-weight: 400;
    line-height: 28px
}

    .article-title h2 a {
        color: #0E3266;
    }

        .article-title h2 a:hover {
            color: #557CB5
        }

.article-title .badge {
    font-size: 11px;
    border-radius: 2px;
    float: right
}

.article-meta {
    padding: 5px;
    border-top: 1px dotted #e1e8ee;
    border-bottom: 1px dotted #e1e8ee;
    margin-bottom: 6px
}

    .article-meta > span {
        display: inline-block;
        margin-right: 10px;
        font-size: 13px
    }

    .article-meta .like-count {
        float: right
    }

.article-meta-new {
    background-color: #f6fafd;
    border: 1px solid #d9eff7;
    border-radius: 2px;
    font-size: 13px;
    font-weight: 300;
    padding: 10px;
    margin-top: 15px;
    margin-bottom: 10px
}

    .article-meta-new > span {
        display: inline-block;
        margin-right: 13px
    }

85, 124, 181