html, body {
    height: 100%;
    font-size: 14px;
    line-height: 1.5;
    font-family: Roboto;
    color: #748181;
    background: #fff;
    position: relative
}

h1, h2, h3 {
    color: #3d3e3e;
    margin: 0 0 25px;
    line-height: 1.5
}

h1 {
    font-weight: 900;
    font-size: 57px
}

h2 {
    font-weight: 700;
    font-size: 35px
}

h3 {
    font-weight: 500;
    font-size: 22px
}

p {
    margin: 0;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.section-padding {
    padding: 100px 0
}

::selection {
    color: #fff;
    text-shadow: none;
    background: #B014ff
}

::-moz-selection {
    color: #fff;
    text-shadow: none;
    background: #B014ff
}

a {
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

    a:hover {
        color: #fff;
        text-decoration: none
    }

.button {
    margin-top: 40px
}

.btn-main, .form-submit {
    color: #fff;
    position: relative;
    background-image: -moz-linear-gradient(-180deg,#B014ff 0,##D47FFF 100%);
    background-image: -webkit-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%);
    background-image: -ms-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%);
    -webkit-box-shadow: 0 0 18px 0 rgba(0,0,0,.18);
    box-shadow: 0 0 18px 0 rgba(0,0,0,.18);
    width: 182px;
    height: 40px;
    border-radius: 25px;
    text-align: center;
    line-height: 40px;
    display: inline-block;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

    .btn-main:hover, .form-submit:hover {
        background-image: -moz-linear-gradient(-180deg,#D47FFF 0,#B014ff 100%);
        background-image: -webkit-linear-gradient(-180deg,#D47FFF 0,#B014ff 100%);
        background-image: -ms-linear-gradient(-180deg,#D47FFF 0,#B014ff 100%)
    }

ul {
    margin: 0;
    padding: 0
}

    ul li {
        list-style: none
    }

.social ul li {
    display: inline-block;
    margin-right: 25px;
    margin-bottom: 0
}

    .social ul li:last-child {
        margin-right: 0
    }

header {
    position: relative;
    min-height: 1080px
}

.title {
    text-align: center;
    margin-bottom: 60px
}

    .title p {
        width: 44%;
        margin: 0 auto
    }

.navbar {
    margin-bottom: 0;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.navbar-default {
    padding-top: 40px;
    background-color: transparent;
    border-color: transparent
}

.navbar-brand {
    padding: 0;
    height: 100%;
    margin: 0
}

.navbar > .container.navbar-brand, .navbar > .container-fluid.navbar-brand {
    margin-left: 0
}

.navbar-right {
    margin-right: 0
}

.navbar-nav > li {
    margin-right: 25px;
    padding: 9px 0 0
}

    .navbar-nav > li:last-child {
        padding: 0;
        margin-right: 0
    }

.navbar-default .navbar-nav > li > a {
    padding: 0;
    color: #fff;
    position: relative;
    line-height: 1.5;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover {
    color: #fff;
    background-color: transparent
}

.navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover {
    color: #fff;
    text-decoration: none;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.navbar-default .navbar-nav > li > a:before, .navbar-default .navbar-nav > .active > a:before {
    text-decoration: none;
    position: absolute;
    content: '';
    background: #fff;
    height: 2px;
    width: 0;
    bottom: -15px;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.top-nav {
    padding: 15px 0;
    background-color: #fff;
    -webkit-box-shadow: 0 0 20px 0 rgba(197,199,224,.2);
    box-shadow: 0 0 20px 0 rgba(197,199,224,.2)
}

    .top-nav .navbar-nav > li > a, .top-nav .navbar-nav > .open > a {
        color: #748181
    }

        .top-nav .navbar-nav > li > a:focus, .top-nav .navbar-nav > li > a:hover, .top-nav .navbar-nav > .active > a, .top-nav .navbar-nav > .active > a:hover .top-nav .navbar-nav > .active > a, .top-nav .navbar-nav > .active > a:focus, .top-nav .navbar-nav > .open > a:hover, .top-nav .navbar-nav > .open > a:focus {
            color: #B014ff;
            text-decoration: none;
            -webkit-transition: all .3s ease-in-out;
            -o-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out
        }

            .top-nav .navbar-nav > li > a:before, .top-nav .navbar-nav > .active > a:before {
                text-decoration: none;
                position: absolute;
                content: '';
                background: #B014ff;
                height: 2px;
                width: 0;
                bottom: -15px;
                -webkit-transition: all .3s ease-in-out;
                -o-transition: all .3s ease-in-out;
                transition: all .3s ease-in-out
            }

            .navbar-default .navbar-nav > li > a:hover:before, .navbar-default .navbar-nav > .active > a:before, .top-nav .navbar-nav > li > a:hover:before, .top-nav .navbar-nav > .active > a:before {
                width: 100%
            }

.navbar-default .navbar-nav > li > a.sign-up {
    width: 102px;
    height: 40px;
    color: #fff;
    line-height: 40px;
    text-align: center;
    border-radius: 25px;
    background-image: -moz-linear-gradient(-180deg,#fea4a4 0,#f7c5c6 100%);
    background-image: -webkit-linear-gradient(-180deg,#fea4a4 0,#f7c5c6 100%);
    background-image: -ms-linear-gradient(-180deg,#fea4a4 0,#f7c5c6 100%);
    -webkit-box-shadow: 0 0 30px 0 rgba(0,0,0,.18);
    box-shadow: 0 0 30px 0 rgba(0,0,0,.18)
}

    .navbar-default .navbar-nav > li > a.sign-up:hover {
        background-image: -moz-linear-gradient(-180deg,#f7c5c6 0,#fea4a4 100%);
        background-image: -webkit-linear-gradient(-180deg,#f7c5c6 0,#fea4a4 100%);
        background-image: -ms-linear-gradient(-180deg,#f7c5c6 0,#fea4a4 100%)
    }

    .navbar-default .navbar-nav > li > a.sign-up:before {
        width: 0
    }

.dropdown-menu {
    top: 57px;
    padding: 20px 30px;
    margin: 0;
    background-color: #fff;
    border: 0;
    border-radius: 0;
    min-width: 160px;
    -webkit-box-shadow: 0 3px 8px rgba(0,0,0,.08);
    box-shadow: 0 3px 8px rgba(0,0,0,.08)
}

.navbar-right .dropdown-menu {
    right: auto;
    left: -30px
}

.dropdown-menu > li > a {
    color: #748181;
    line-height: 1.5;
    padding: 0 0 15px;
    display: inline-block;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.dropdown-menu > li:last-child > a {
    padding: 0
}

.dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover {
    color: #B014ff;
    background-color: transparent
}

.navbar-toggle {
    padding: 0;
    margin-top: 0;
    margin-bottom: 0;
    border: 0 transparent;
    border-radius: 0
}

.navbar-default .navbar-toggle {
    border-color: transparent
}

    .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
        background-color: transparent
    }

.navbar-collapse {
    box-shadow: none;
    -webkit-box-shadow: none;
    border-top: 0 solid transparent
}

.menu-icon {
    height: 25px;
    width: 25px;
    cursor: pointer;
    margin-top: 6px
}

.toggle-bar {
    position: relative;
    top: 50%;
    background: #fff
}

    .toggle-bar, .toggle-bar:before, .toggle-bar:after {
        height: 2px;
        width: 25px;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out
    }

        .toggle-bar:before, .toggle-bar:after {
            content: "";
            position: absolute;
            top: 0;
            left: 0
        }

        .toggle-bar:before {
            -webkit-box-shadow: 0 -10px 0 0 #fff;
            box-shadow: 0 -10px 0 0 #fff
        }

        .toggle-bar:after {
            -webkit-box-shadow: 0 10px 0 0 #fff;
            box-shadow: 0 10px 0 0 #fff
        }

.change .toggle-bar {
    background-color: transparent;
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transition: all .6s ease-in-out;
    -o-transition: all .6s ease-in-out;
    transition: all .6s ease-in-out
}

    .change .toggle-bar:before {
        top: 0;
        left: 6px;
        -webkit-transform: translateY(6px) rotate(-45deg);
        -ms-transform: translateY(6px) rotate(-45deg);
        -o-transform: translateY(6px) rotate(-45deg);
        transform: translateY(6px) rotate(-45deg);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out
    }

    .change .toggle-bar:after {
        top: 0;
        left: 6px;
        -webkit-transform: translateY(-8px) rotate(45deg);
        -ms-transform: translateY(-8px) rotate(45deg);
        -o-transform: translateY(-8px) rotate(45deg);
        transform: translateY(-8px) rotate(45deg);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out
    }

.top-nav .toggle-bar {
    background: #748181
}

    .top-nav .toggle-bar:before {
        -webkit-box-shadow: 0 -10px 0 0 #748181;
        box-shadow: 0 -10px 0 0 #748181
    }

    .top-nav .toggle-bar:after {
        -webkit-box-shadow: 0 10px 0 0 #748181;
        box-shadow: 0 10px 0 0 #748181
    }

.top-nav .change .toggle-bar {
    background-color: transparent
}

.header-home, .header-home .container, .content-height {
    height: 100%;
    position: relative
}

    .header-home .container {
        z-index: 2
    }

.header-home {
    background-image: -moz-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%);
    background-image: -webkit-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%);
    background-image: -ms-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%)
}

.header-elment {
    position: absolute;
    bottom: -7px;
    width: 100%;
    z-index: 1
}

.content {
    position: absolute;
    top: 50%;
    z-index: 2;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%)
}

    .content h1, .content p {
        color: #fff
    }

    .content p {
        width: 85%
    }

    .content .btn-main {
        background-image: -moz-linear-gradient(-180deg,#8282e6 0,#a2a5f4 100%);
        background-image: -webkit-linear-gradient(-180deg,#8282e6 0,#a2a5f4 100%);
        background-image: -ms-linear-gradient(-180deg,#8282e6 0,#a2a5f4 100%)
    }

        .content .btn-main:hover {
            background-image: -moz-linear-gradient(-180deg,#a2a5f4 0,#8282e6 100%);
            background-image: -webkit-linear-gradient(-180deg,#a2a5f4 0,#8282e6 100%);
            background-image: -ms-linear-gradient(-180deg,#a2a5f4 0,#8282e6 100%)
        }

.mock {
    padding-top: 260px
}

    .mock img {
        width: 100%
    }

.mock-about img {
    width: 100%
}

.about-text {
    padding-left: 40px;
    padding-top: 13vh
}

.p-first {
    margin-bottom: 40px
}

.features {
    padding-bottom: 30px;
    background: #fcfcff
}

.mock-section img {
    width: 100%
}

.mock-float {
    float: right
}

.item {
    padding: 0 40px 70px 0
}

.item-icon {
    margin-bottom: 40px
}

    .item-icon span {
        width: 78px;
        height: 78px;
        display: block;
        text-align: center;
        border-radius: 50%
    }

        .item-icon span:before {
            font-size: 50px;
            line-height: 78px;
            margin-left: 0;
            display: block
        }

        .item-icon span.flaticon-diamond {
            color: #8687e8;
            border: 1px solid #8687e8;
            background-color: rgba(134,135,232,.09)
        }

        .item-icon span.flaticon-sending {
            color: #B014ff;
            border: 1px solid #B014ff;
            background-color: rgba(28,178,211,.09)
        }

        .item-icon span.flaticon-browser-1 {
            color: #fea4a4;
            border: 1px solid #fea4a4;
            background-color: rgba(254,164,164,.09)
        }

        .item-icon span.flaticon-notification {
            color: #a7dda9;
            border: 1px solid #a7dda9;
            background-color: rgba(167,221,169,.09)
        }

.accordion {
    padding: 10vh 0 0 40px
}

    .accordion .drop-title {
        position: relative;
        cursor: pointer;
        display: block;
        padding: 11px 15px;
        background: #fff;
        -webkit-box-shadow: 0 1px 6px 0 rgba(0,0,0,.14);
        box-shadow: 0 1px 6px 0 rgba(0,0,0,.14)
    }

        .accordion .drop-title p {
            display: inline-block
        }

    .accordion .open .drop-title p {
        color: #B014ff
    }

.icon-holder {
    position: absolute;
    width: 14px;
    height: 14px;
    display: block;
    right: 15px;
    top: 20px
}

.icon {
    position: relative;
    width: 14px;
    height: 2px;
    display: block;
    float: right;
    background: #748181;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

    .icon:before {
        position: absolute;
        content: '';
        width: 14px;
        height: 2px;
        display: block;
        float: right;
        background: #748181;
        transform: rotate(90deg);
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out
    }

.open .icon:before {
    transform: rotate(0)
}

.accordion li.default .menu-text {
    color: #fff;
    padding: 40px;
    background-image: -moz-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%);
    background-image: -webkit-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%);
    background-image: -ms-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%);
    display: none
}

.accordion li.default.open .menu-text {
    display: block
}

.item-pricing {
    text-align: center;
    padding: 40px;
    background: #fff;
    -webkit-box-shadow: 0 1px 6px 0 rgba(0,0,0,.14);
    box-shadow: 0 1px 6px 0 rgba(0,0,0,.14);
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

    .item-pricing:hover {
        -webkit-box-shadow: 0 1px 18px 0 rgba(0,0,0,.14);
        box-shadow: 0 1px 18px 0 rgba(0,0,0,.14)
    }

    .item-pricing .item-icon span {
        margin: 0 auto
    }

.item-icon span.flaticon-air-balloon {
    color: #8687e8;
    border: 1px solid #8687e8;
    background-color: rgba(134,135,232,.09)
}

.item-icon span.flaticon-plane {
    color: #B014ff;
    border: 1px solid #B014ff;
    background-color: rgba(28,178,211,.09)
}

.item-icon span.flaticon-rocket {
    color: #fea4a4;
    border: 1px solid #fea4a4;
    background-color: rgba(254,164,164,.09)
}

.price {
    padding-bottom: 25px;
    border-bottom: 1px solid #dff5f5;
    margin-bottom: 40px
}

    .price h3 {
        color: #748181
    }

    .price span.dollar {
        font-weight: 500;
        font-size: 35px
    }

    .price p {
        font-size: 57px;
        font-weight: 500;
        display: inline-block;
        margin: 0 10px
    }

.options li {
    margin-bottom: 15px
}

    .options li:last-child {
        margin-bottom: 0
    }

.item-pricing .btn-main {
    color: #fff;
    position: relative;
    background: #fff;
    box-shadow: none;
    line-height: 40px;
    border: 1px solid
}

.item-pricing.free .btn-main {
    color: #8687e8;
    border-color: #8687e8
}

.item-pricing .btn-main:hover {
    color: #fff;
    background-image: -moz-linear-gradient(-180deg,#8282e6 0,#a2a5f4 100%);
    background-image: -webkit-linear-gradient(-180deg,#8282e6 0,#a2a5f4 100%);
    background-image: -ms-linear-gradient(-180deg,#8282e6 0,#a2a5f4 100%)
}

.item-pricing.advanced .btn-main {
    color: #B014ff;
    border-color: #B014ff
}

    .item-pricing.advanced .btn-main:hover {
        color: #fff;
        background-image: -moz-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%);
        background-image: -webkit-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%);
        background-image: -ms-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%)
    }

.item-pricing.premium .btn-main {
    color: #fea4a4;
    border-color: #fea4a4
}

    .item-pricing.premium .btn-main:hover {
        color: #fff;
        background-image: -moz-linear-gradient(-180deg,#fea4a4 0,#f7c5c6 100%);
        background-image: -webkit-linear-gradient(-180deg,#fea4a4 0,#f7c5c6 100%);
        background-image: -ms-linear-gradient(-180deg,#fea4a4 0,#f7c5c6 100%)
    }

.download {
    background-image: -moz-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%);
    background-image: -webkit-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%);
    background-image: -ms-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%)
}

.download-left {
    padding-right: 40px
}

.download-text {
    padding-top: 17vh
}

    .download-text h2, .download-text p {
        color: #fff
    }

.download-badge {
    margin-top: 40px
}

    .download-badge a.store {
        margin-right: 30px
    }

.testimonials {
    background: #fcfcff;
    text-align: center
}

.testimonial-item {
    margin: 2px 4px;
    background: #fff;
    padding: 40px;
    -webkit-box-shadow: 0 1px 6px 0 rgba(0,0,0,.14);
    box-shadow: 0 1px 6px 0 rgba(0,0,0,.14)
}

.owl-carousel .owl-item img {
    width: auto
}

.testimonial-img img {
    margin: 0 auto 40px
}

.testimonial-title {
    margin-top: 25px
}

    .testimonial-title h3 {
        margin-bottom: 15px
    }

.testimonials .cloned, .testimonials .active {
    z-index: 1;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.center {
    z-index: 2;
    transform: scale(1);
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.testimonials .active .testimonial-item, .testimonials .cloned .testimonial-item {
    transform: scale(.8);
    opacity: .5;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.testimonials .center .testimonial-item {
    opacity: 1;
    transform: scale(1)
}

.owl-nav {
    color: #99a2b6;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.owl-carousel .owl-dots.disabled, .owl-carousel .owl-nav.disabled {
    display: block;
    position: absolute;
    top: 50%;
    width: 100%
}

.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev {
    color: #748181;
    width: 30px;
    height: 30px;
    line-height: 30px;
    border-radius: 50%;
    border: 1px solid #748181;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot {
    outline: 0;
    position: absolute
}

.owl-carousel .owl-nav button.owl-next {
    right: 0
}

.owl-carousel .owl-nav button.owl-prev {
    left: 0
}

    .owl-carousel .owl-nav button.owl-next:hover, .owl-carousel .owl-nav button.owl-prev:hover {
        color: #fff;
        background: #B014ff;
        border: 1px solid #B014ff
    }

.blog {
    padding-bottom: 70px
}

.blog-item {
    margin-bottom: 30px;
    background: #fff;
    -webkit-box-shadow: 0 1px 6px 0 rgba(0,0,0,.14);
    box-shadow: 0 1px 6px 0 rgba(0,0,0,.14)
}

.blog-img-1 {
    height: 240px;
    width: 100%;
    background: url(../img/blog/1.jpg) no-repeat center center;
    -webkit-background-size: cover;
    background-size: cover
}

.blog-img-2 {
    height: 240px;
    width: 100%;
    background: url(../img/blog/2.jpg) no-repeat center center;
    -webkit-background-size: cover;
    background-size: cover
}

.blog-img-3 {
    height: 240px;
    width: 100%;
    background: url(../img/blog/3.jpg) no-repeat center center;
    -webkit-background-size: cover;
    background-size: cover
}

.blog-text {
    padding: 40px;
    border-top: 2px solid
}

    .blog-text h3 {
        max-height: 66px;
        overflow: hidden
    }

    .blog-text.news {
        border-color: #8687e8
    }

    .blog-text.business {
        border-color: #B014ff
    }

    .blog-text.technology {
        border-color: #fea4a4
    }

.text-up {
    margin-bottom: 25px
}

    .text-up p {
        display: inline-block;
        margin-right: 25px
    }

    .text-up span.news, a.news:hover {
        color: #8687e8
    }

    .text-up span.business, a.business:hover {
        color: #B014ff
    }

    .text-up span.technology, a.technology:hover {
        color: #fea4a4
    }

.blog-link {
    margin-top: 40px
}

    .blog-link a {
        color: #748181
    }

.subscribe-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center
}

input[type=email], input[type=text], input[type=password], textarea {
    width: 100%;
    height: 40px;
    outline: 0;
    border: 0;
    padding-left: 15px;
    border-radius: 25px;
    background-color: #fff;
    -webkit-box-shadow: 0 0 9.9px .1px rgba(0,0,0,.1);
    box-shadow: 0 0 9.9px .1px rgba(0,0,0,.1)
}

.email {
    position: relative
}

.subscribe button {
    position: absolute;
    color: #fff;
    top: 5px;
    right: 5px;
    height: 30px;
    width: 30px;
    outline: 0;
    border: 0;
    line-height: 30px;
    border-radius: 25px;
    background-image: -moz-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%);
    background-image: -webkit-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%);
    background-image: -ms-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%);
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

    .subscribe button:hover {
        background-image: -moz-linear-gradient(-180deg,#D47FFF 0,#B014ff 100%);
        background-image: -webkit-linear-gradient(-180deg,#D47FFF 0,#B014ff 100%);
        background-image: -ms-linear-gradient(-180deg,#D47FFF 0,#B014ff 100%)
    }

    .subscribe button .fa-chevron-right:after, .search button .fa-chevron-right:after {
        background: #fff
    }

footer {
    padding-bottom: 0;
    text-align: center;
    background: #3d3e3e
}

    footer ul li {
        display: inline-block;
        margin-right: 25px
    }

        footer ul li:last-child {
            margin-right: 0
        }

        footer ul li a {
            color: #fff
        }

            footer ul li a:hover {
                color: #B014ff
            }

.footer-link {
    margin: 40px 0
}

.copy {
    padding-top: 100px;
    height: 100px
}

    .copy p {
        color: #fff;
        line-height: 100px;
        line-height: 100px
    }

    .copy a {
        color: #B014ff
    }

        .copy a:hover {
            color: #8687e8
        }

.scroll-top {
    right: 15px;
    opacity: .5;
    bottom: 40px;
    display: none;
    position: fixed;
    cursor: pointer;
    z-index: 999;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

    .scroll-top:hover {
        opacity: 1
    }

    .scroll-top span {
        color: #748181;
        width: 30px;
        height: 30px;
        line-height: 30px;
        border-radius: 50%;
        display: inline-block;
        cursor: pointer;
        text-align: center;
        border: 1px solid #748181;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out
    }

        .scroll-top span:hover {
            color: #fff;
            border-color: #B014ff;
            background: #B014ff
        }

            .scroll-top span:hover .fa-chevron-up:after {
                background: #fff
            }

.header-blog {
    text-align: center;
    min-height: 640px;
    height: 640px
}

.header-blog-title {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%)
}

    .header-blog-title h1, .header-blog-title p {
        color: #fff
    }

    .header-blog-title p {
        width: 43%;
        margin: 0 auto
    }

.blog-page-items {
    padding: 0 2%
}

    .blog-page-items .blog-item {
        margin-bottom: 60px
    }

.blog-page .button {
    text-align: center;
    margin: 0
}

.header-single-blog {
    width: 100%;
    background: url(../img/blog/1.jpg) no-repeat center center;
    -webkit-background-size: cover;
    background-size: cover;
    position: relative
}

    .header-single-blog:before {
        position: absolute;
        content: '';
        height: 100%;
        width: 100%;
        left: 0;
        background-image: -moz-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%);
        background-image: -webkit-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%);
        background-image: -ms-linear-gradient(-180deg,#B014ff 0,#D47FFF 100%);
        opacity: .8
    }

    .header-single-blog h1 {
        margin-bottom: 0
    }

.single-blog-items {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    justify-content: center
}

.text-first p:last-child {
    margin-top: 40px
}

.blockquote-title {
    margin: 40px 0 40px 40px;
    padding-left: 25px
}

    .blockquote-title h3 {
        margin: 0;
        position: relative
    }

        .blockquote-title h3:before {
            position: absolute;
            content: '';
            height: 2px;
            width: 40px;
            background: #B014ff;
            left: -65px;
            top: 16px
        }

.text-second {
    margin-bottom: 40px
}

.blog-img {
    width: 100%;
    height: 350px;
    margin-bottom: 40px;
    background: url(../img/blog/3.jpg) no-repeat center center;
    -webkit-background-size: cover;
    background-size: cover;
    position: relative
}

.bloog-footer {
    margin-top: 40px
}

    .bloog-footer ul li {
        display: inline-block
    }

        .bloog-footer ul li a {
            color: #748181
        }

            .bloog-footer ul li a:hover {
                color: #B014ff
            }

.tag {
    display: inline-block;
    float: left
}

    .tag ul li:first-child {
        margin-right: 15px
    }

.share {
    float: right
}

    .share ul li {
        margin-right: 25px
    }

        .share ul li:last-child {
            margin-right: 0
        }

.communiction {
    background: #fcfcff
}

.comment-img {
    float: left;
    margin-right: 25px
}

    .comment-img img {
        width: 80px;
        border-radius: 50%
    }

.comment-text {
    display: table
}

.comment-footer {
    margin-top: 25px
}

.comment-footer-left {
    display: inline-block
}

    .comment-footer-left p {
        display: inline-block
    }

        .comment-footer-left p:first-child {
            margin-right: 15px
        }

.comment-footer-right {
    float: right
}

    .comment-footer-right a {
        color: #748181;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out
    }

        .comment-footer-right a:hover {
            color: #B014ff
        }

.reply {
    margin: 40px 0 40px 40px
}

.blog-single-form {
    margin-top: 60px
}

.blog-single .blog-single-form .row {
    display: block
}

.blog-single-form input[type=email], .blog-single-form input[type=text], .sign-up input[type=text], .sign-up input[type=email], input[type=password], textarea {
    color: #748181;
    margin-bottom: 30px;
    -webkit-box-shadow: 0 1px 6px 0 rgba(0,0,0,.14);
    box-shadow: 0 1px 6px 0 rgba(0,0,0,.14)
}

textarea {
    padding: 15px;
    height: 220px;
    resize: none
}

.form-submit {
    border: 0
}

.bg {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    overflow: hidden
}

    .bg img {
        height: 100%
    }

.sign-up {
    background: #fcfcff;
    text-align: center;
    padding: 250px 0
}

    .sign-up .row {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        justify-content: center
    }

.sign-up-content {
    position: relative;
    z-index: 2
}

.sign-up .logo {
    margin-bottom: 60px
}

.sign-up .navbar-brand {
    float: none
}

.sign-up form {
    display: block
}

.password {
    position: relative
}

    .password span {
        position: absolute;
        right: 15px;
        line-height: 40px;
        top: 0
    }

.sign-up .form-submit {
    width: 100%
}

.sign-social {
    margin-top: 30px;
    text-align: center
}

    .sign-social span {
        width: 40px;
        height: 40px;
        display: block;
        background: #fff;
        line-height: 40px;
        border-radius: 50%;
        margin: 0 auto 30px;
        -webkit-box-shadow: 0 1px 6px 0 rgba(0,0,0,.14);
        box-shadow: 0 1px 6px 0 rgba(0,0,0,.14)
    }

    .sign-social button {
        width: 100%;
        height: 40px;
        color: #fff;
        border-radius: 25px;
        border-width: 0;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out
    }

        .sign-social button.social-facebook {
            background-color: #3b5998
        }

            .sign-social button.social-facebook:hover {
                background-color: #3071a9
            }

        .sign-social button.social-twitter {
            background-color: #1da1f2
        }

            .sign-social button.social-twitter:hover {
                background-color: #00aced
            }

        .sign-social button.social-google {
            background-color: #db4437
        }

            .sign-social button.social-google:hover {
                background-color: #c32f10
            }

.account {
    margin-top: 25px
}

    .account p a {
        color: #B014ff
    }

        .account p a:hover, .Forgot-password a:hover {
            color: #168094
        }

.log-in-option {
    margin-top: 30px
}

.log-in-checkbox {
    float: left;
    position: relative
}

input[type=checkbox] {
    margin: 0
}

.checkbox {
    position: absolute;
    opacity: 0;
    outline: 0
}

    .checkbox + label {
        position: relative;
        cursor: pointer;
        padding: 0;
        margin-bottom: 0;
        font-weight: 400
    }

        .checkbox + label:before {
            content: '';
            margin: 0 10px 0 0;
            display: inline-block;
            vertical-align: middle;
            width: 18px;
            height: 18px;
            background: #fff;
            border: 1px solid #748181;
            -webkit-transition: all .3s ease-in-out;
            -o-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out
        }

    .checkbox:hover + label:before {
        border: 1px solid #B014ff;
        background: #B014ff
    }

    .checkbox:checked + label:before {
        border: 1px solid #B014ff;
        background: #B014ff
    }

    .checkbox:checked + label:after {
        content: '';
        position: absolute;
        left: 4px;
        top: 10px;
        background: #fff;
        width: 2px;
        height: 2px;
        -webkit-box-shadow: 2px 0 0 #fff,4px 0 0 #fff,4px -2px 0 #fff,4px -4px 0 #fff,4px -6px 0 #fff,4px -8px 0 #fff;
        box-shadow: 2px 0 0 #fff,4px 0 0 #fff,4px -2px 0 #fff,4px -4px 0 #fff,4px -6px 0 #fff,4px -8px 0 #fff;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg)
    }

.forgot-password {
    float: right
}

    .forgot-password a {
        color: #748181
    }

        .forgot-password a:hover {
            color: #B014ff
        }

.sign-up-a p a {
    color: #fea4a4
}

    .sign-up-a p a:hover {
        color: #c5696a
    }

@media(min-width:1199px) and (max-width:1225px) {
    .blog-page-items {
        padding: 0 1%
    }
}

@media(max-width:991px) {
    .title p {
        width: 70%
    }

    .mock-header {
        display: none
    }

    .content {
        text-align: center;
        top: 50%;
        left: 50%;
        right: auto;
        width: 100%;
        -webkit-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
        -o-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%)
    }

        .content p {
            width: 100%
        }

    .about-text {
        padding-left: 0;
        padding-top: 60px
    }

    .mock-float {
        float: none
    }

        .mock-float img, .mock-section img {
            margin: 0 auto 60px;
            display: block
        }

    .mock-section img {
        width: auto
    }

    .accordion, .download-left, .download-text {
        padding: 0
    }

    .pricing {
        padding-bottom: 70px
    }

    .item-pricing {
        margin-bottom: 30px
    }

    .testimonials .active .testimonial-item, .testimonials .cloned .testimonial-item {
        transform: scale(1);
        opacity: 1
    }

    .owl-nav {
        margin-top: 40px
    }

    .owl-carousel .owl-dots.disabled, .owl-carousel .owl-nav.disabled {
        position: relative;
        top: 0
    }

    .owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot {
        position: relative
    }

    .owl-carousel .owl-nav button.owl-prev {
        left: auto;
        margin-right: 30px
    }

    .owl-carousel .owl-nav button.owl-next {
        right: auto
    }

    .header-blog-title p {
        width: 67%
    }

    .blog-page-items .blog-item {
        margin-bottom: 30px
    }

    .blog-page .button {
        margin-top: 30px
    }
}

@media(min-width:768px) {
    .navbar > .container .navbar-brand {
        margin-left: 0
    }
}

@media(max-width:767px) {
    .title p {
        width: 82%
    }

    .navbar > .container .navbar-brand {
        margin-left: 15px
    }

    .menu-icon {
        z-index: 99;
        position: relative
    }

    .toggle-bar {
        background: #fff
    }

        .toggle-bar:before {
            -webkit-box-shadow: 0 -10px 0 0 #fff;
            box-shadow: 0 -10px 0 0 #fff
        }

        .toggle-bar:after {
            -webkit-box-shadow: 0 10px 0 0 #fff;
            box-shadow: 0 10px 0 0 #fff
        }

    .top-nav .toggle-bar:before {
        -webkit-box-shadow: 0 -10px 0 0 #748181;
        box-shadow: 0 -10px 0 0 #748181
    }

    .top-nav .toggle-bar:after {
        -webkit-box-shadow: 0 10px 0 0 #748181;
        box-shadow: 0 10px 0 0 #748181
    }

    .change .toggle-bar:before {
        -webkit-box-shadow: 0 -10px 0 0 #B014ff;
        box-shadow: 0 -10px 0 0 #B014ff
    }

    .change .toggle-bar:after {
        -webkit-box-shadow: 0 10px 0 0 #B014ff;
        box-shadow: 0 10px 0 0 #B014ff
    }

    .navbar-nav {
        margin: 0
    }

    .navbar-fixed-top .navbar-collapse {
        border: 0;
        margin: 0;
        padding: 80px 0 10px 80px;
        width: 100%;
        top: 0;
        right: 0;
        position: fixed;
        max-height: none;
        height: 100% !important;
        background-color: #fff;
        -webkit-transition: all .5s;
        -o-transition: all .5s;
        transition: all .5s;
        -webkit-box-shadow: none;
        box-shadow: none;
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }

        .navbar-fixed-top .navbar-collapse.in {
            -webkit-transform: translateX(0);
            transform: translateX(0)
        }

    .navbar-nav > li {
        display: table;
        margin-right: 0;
        margin-bottom: 25px;
        padding: 0
    }

        .navbar-nav > li:last-child {
            margin-bottom: 0
        }

    .navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:active, .navbar-default .navbar-nav > li > a:hover {
        color: #B014ff
    }

    .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > li > a {
        color: #748181;
        font-size: 20px;
        font-weight: 900
    }

    .navbar-nav .open .dropdown-menu > li > a {
        line-height: 1.5
    }

    .navbar-default .navbar-nav > .active > a:before, .navbar-default .navbar-nav > .active > a:focus:before, .navbar-default .navbar-nav > .active > a:hover:before, .navbar-default .navbar-nav > .open > a:before, .navbar-default .navbar-nav > .open > a:focus:before, .navbar-default .navbar-nav > .open > a:hover:before, .navbar-default .navbar-nav > li > a:hover:before {
        width: 0
    }

    .dropdown-menu {
        padding: 10px 0 0
    }

    .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover {
        color: #B014ff
    }

    .navbar-default .navbar-nav > li > a.sign-up {
        font-size: 14px
    }

    .header-home {
        min-height: 850px
    }

    .content {
        padding: 0 15px
    }

    .item {
        padding-right: 0
    }

    .header-blog {
        min-height: 640px
    }

    .header-blog-title {
        width: 94%
    }
}

@media(max-width:480px) {
    .title p {
        width: 100%
    }

    .mock-section img {
        width: 100%
    }

    .header-blog-title p {
        width: 100%
    }

    .tag {
        display: block;
        float: none
    }

    .share {
        float: none;
        margin-top: 40px
    }

    .bg {
        display: none
    }
}

@media(max-width:442px) {
    h1 {
        font-size: 43px
    }

    .footer-link {
        margin-bottom: 25px
    }

    footer ul li {
        margin-bottom: 15px
    }
}