/*------------------------------------------------------------------------------------



    [Table of contents]



    01.Base CSS

    02.Main Header CSS

    03.Main Banner CSS

    04.How it works CSS

    05.Advance Features CSS

    06.Why is the best & About Special Section

    07.Fact CSS

    08.Pricing Plane CSS

    09.Video Section CSS

    10.Our Blog CSS

    11.Clients Testimonial CSS

    12.App ScreenShorts

    13.Newsletter CSS

    14.Contact Us CSS

    16.Responsive CSS

    17.Preloader CSS

    18.Fact 2 CSS

    --------------------------------------------------------------------------------------*/



    /* -----------------------------------

    :: 1. Base CSS Start

    ------------------------------------ */



    *{

        padding: 0;

        margin: 0;

    }

    body{

        font-family: 'Tahoma', sans-serif;

        background-color: #fff;

        font-weight: 400;

    }



    h1,

    h2,

    h3,

    h4,

    h5,

    h6,

    {

        font-family: 'Tahoma', sans-serif;

        font-weight: 400;

        margin-top:0;

        line-height: 1;

    }



    p {

        font-size: 14px;

        font-weight: 300;

        margin-top: 0;

        color:#636d75;



    }

    a{

        color: #726a84;

        -webkit-transition: 0.2s ease-in-out;

        -moz-transition: 0.2s ease-in-out;

        transition: 0.2s ease-in-out;

    }

    a:hover, a:active, a:focus {

        outline: none;

        text-decoration: none;

    }



    img {

        max-width: 100%;

        max-height: 100%;

    }



    ul > li{

        color: #726a84;

        font-size: 14px;

        font-weight: 300;

    }





    /* ------ Helper Classes -------------- */



    .bold{

        font-weight: 600;

    }



    .mobile-device {

        background: #fff;

        border: 1px solid #edf4f8;

        margin: 0 auto;

        position: relative;

        max-width: 255px;

        border-radius: 36px;

        padding: 55px 0;

        -webkit-box-shadow: inset 0 4px 10px 1px #fff, inset 0 0 6px 0 rgba(66,77,86,.5), 0 2px 0 #aeb5bb, 0 20px 50px -25px rgba(0,0,0,.5);

        box-shadow: inset 0 4px 10px 1px #fff, inset 0 0 6px 0 rgba(66,77,86,.5), 0 2px 0 #aeb5bb, 0 20px 50px -25px rgba(0,0,0,.5);

    }



    .mt-15 {

        margin-top: 15px;

    }



    .mt-30 {

        margin-top: 30px;

    }



    .mt-50 {

        margin-top: 50px;

    }



    .mt-100 {

        margin-top: 100px;

    }



    .mt-150 {

        margin-top: 150px;

    }



    .mr-15 {

        margin-right: 15px;

    }



    .mr-30 {

        margin-right: 30px;

    }



    .mr-50 {

        margin-right: 50px;

    }



    .mr-100 {

        margin-right: 100px;

    }



    .mb-10 {

        margin-bottom: 10px;

    }



    .mb-15 {

        margin-bottom: 15px;

    }



    .mb-30 {

        margin-bottom: 30px;

    }



    .mb-50 {

        margin-bottom: 50px;

    }



    .mb-100 {

        margin-bottom: 100px;

    }



    .ml-15 {

        margin-left: 15px;

    }



    .ml-30 {

        margin-left: 30px;

    }



    .ml-50 {

        margin-left: 50px;

    }



    .ml-100 {

        margin-left: 100px;

    }









    .pt-15 {

        padding-top: 15px;

    }



    .pt-30 {

        padding-top: 30px;

    }



    .pt-50 {

        padding-top: 50px;

    }



    .pt-100 {

        padding-top: 100px;

    }



    .pt-150 {

        padding-top: 150px;

    }



    .pr-15 {

        padding-right: 15px;

    }



    .pr-30 {

        padding-right: 30px;

    }



    .pr-50 {

        padding-right: 50px;

    }



    .pr-100 {

        padding-right: 100px;

    }



    .pb-10 {

        padding-bottom: 10px;

    }



    .pb-15 {

        padding-bottom: 15px;

    }



    .pb-20 {

        padding-bottom: 20px;

    }



    .pb-30 {

        padding-bottom: 30px;

    }



    .pb-50 {

        padding-bottom: 50px;

    }



    .pb-100 {

        padding-bottom: 100px;

    }



    .pl-15 {

        padding-left: 15px;

    }



    .pl-30 {

        padding-left: 30px;

    }



    .pl-50 {

        padding-left: 50px;

    }



    .pl-100 {

        padding-left: 100px;

    }





    section{

        padding: 10px 0;

    }



    .section-heading{

        margin-top: 30px;

        margin-bottom: 60px;

    }



    .section-heading > h2 {

        font-weight: 300;

        color: white;

        font-size: 40px;

        margin: 0;

        text-transform: uppercase;

    }



    .section-heading > p {

        font-weight: 300;

        color: #636d75;

        margin: 0;

    }



    .sub-heading{

        color: #2c90e4;

    }



    .line-title-white,

    .line-title-center,

    .line-title-left {

        width: 80px;

        height: 2px;

        background-color: #2c90e4;

        margin-top: 15px;

        margin-bottom: 10px;

    }



    .line-title-center {

        margin-left: calc(50% - 40px);

    }

    .line-title-left {

        margin-left: 5px;

    }





    .btn{

        height: 50px;

        min-width: 167px;

        text-align: center;

        border-radius: 25px 25px 25px 25px;

    }



    .img-padding-tb{

        padding: 30px 0 30px;

    }



    /* --------------------------

    :: 2. Header Area CSS

    -------------------------- */



    .main-header {

        left: 0;

		height: 176px;

        position: absolute;

        width: 100%;

        z-index: 99;

        top: 0;

        padding: 0 4%;
		
		background-color: #000

    }

    .navbar{

        padding: 1.5rem 1rem;

    }



    .navbar .collapse.show ul{

        

    }



    .top_menu .navbar-brand {

        font-size: 35px;

        font-weight: 700;

        color: #fff;

        margin: 0;

        line-height: 1;

        padding: 0;

    }



    .top_menu .navbar-brand:hover,

    .top_menu .navbar-brand:focus {

        color: #fff;

    }



    .top_menu .navbar-brand .logo{

        height: 100px;

        margin-top: -12px;

    }



    .top_menu .navbar-brand .logo-sticky{

        height: 100px;

        margin-top: -12px;

    }



    .top_menu{

        position: relative;

        z-index: 2;

    }



    .top_menu #nav .nav-link {

        color: #fff;

        display: block;

        font-size: 14px;

        font-weight: 500;

        border-radius: 30px;

        -webkit-transition-duration: 500ms;

        -o-transition-duration: 500ms;

        transition-duration: 500ms;

        padding: 10px 15px;

    }





    .top_menu nav ul li > a:hover {

        color: #2c90e4;

    }



    /* stcicky css */

    .main-header.sticky {

        background-color: #fff;

        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);

        -webkit-box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);

        height: 176px;

        position: fixed;

        top: 0;

        z-index: 99;

        -webkit-transition: 0.3s ease-in-out;

        -moz-transition: 0.3s ease-in-out;

        transition: 0.3s ease-in-out;

    }



    .main-header.sticky .top_menu .navbar-brand {

        color: #2c90e4;

    }



    .main-header.sticky .top_menu #nav .nav-link {

        color: #636d75;

    }







    /* --------------------------

    :: 3. Main Banner Area CSS

    -------------------------- */

    .main_banner_area{

        padding: 150px 0 100px;

        background-image: url(../images/background.png);

        min-height: 680px;

        position: relative;

        background-position: bottom center;

        background-size: cover;

    }

    .main_banner_area:after {

        content: '';

        position: absolute;

        display: block;

        left: 0;

        top: 0;

        right: 0;

        bottom: 0;

        z-index: -1;

        background-image: -moz-linear-gradient(90deg, #000 0%, #100f0f 100%);

        background-image: -webkit-linear-gradient(90deg, #000 0%, #100f0f 100%);

        background-image: -ms-linear-gradient(90deg, #000 0%, #100f0f 100%);

        background-image: linear-gradient(90deg, #000 0%, #100f0f 100%);

        opacity: 1;

    }



    .main_banner_area .info{

        padding: 50px 0;

    }



    .info > p{

        color: #f1f2f3;

    }







    /* --------------------------

    :: 4. How it works Area CSS

    -------------------------- */



    #how-it-works{

        background-color: #daccba;

    }



    .how-it-single {

        padding: 40px;

        -webkit-transition-duration: 800ms;

        -o-transition-duration: 800ms;

        transition-duration: 800ms;

    }



    .how-it-single:hover {

        -webkit-box-shadow: 0 10px 90px rgba(0, 0, 0, 0.08);

                box-shadow: 0 10px 90px rgba(0, 0, 0, 0.08);

    }



    .how-it-single p {

        margin-bottom: 0;

    }



    .single-icon > i {

        font-size: 65px;

        color: #2c90e4;

    }



    .how-it-single > h4 {

        font-size: 22px;

        margin-bottom: 15px;

    }



    .single-icon {

        margin-bottom: 25px;

    }







    /* --------------------------

    :: 5. special about our app CSS

    -------------------------- */



    #about{

        background: #000000;

    }



    /* --------------------------

    :: 5. Feature Area CSS

    -------------------------- */



    #features{

        background: #000000;

    }



    .feature-single{

        margin-top: 3rem;

        margin-bottom: 3rem;

    }



    .feature-single h4{

        padding-top: 1rem;

    }



    .feature-left, .feature-right{

        

    }



    .feature-left .feature-icon {

        float: right;

        margin-left: 2rem;

    }



    .feature-right .feature-icon {

        float: left;

        margin-right: 2rem;

    }



    .feature-icon {

        width: 6rem;

        height: 6rem;

        border-radius: 6rem;

        border: 1px solid #2c90e4;

        color: #2c90e4;

        text-align: center;

        margin-bottom: 1rem;

        -moz-transition: all 1s;

        -o-transition: all 1s;

        -webkit-transition: all 1s;

        transition: all 1s;

    }



    .feature-icon i {

        font-size: 3rem;

        line-height: 6rem;

    }



    .feature-icon:hover {

        background-image: linear-gradient(90deg, #2c90e4 0%, #2baffd 100%);

        color: #fff;

    }



    .feature-img {

        text-align: center;

    }



    /* --------------------------

    :: 6. Why is the best & Special Area CSS

    -------------------------- */



    #whyisbest{

        background-color: #100f0f;

    }



    .whyisbest{

        background: #000000;

    }



    .app-download-area {

        display: -moz-flex;

        display: -ms-flex;

        display: -o-flex;

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex;

        -ms-flex-preferred-size: 1;

        flex-basis: 1;

        margin-top: 45px;

        margin-bottom: 30px;

        margin-top: 50px;

    }



    .app-download-btn a {

        border: 1px solid #2baffd;

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex;

        -webkit-box-align: center;

        -ms-flex-align: center;

        align-items: center;

        padding: 15px 30px;

        border-radius: 30px 30px 30px 0;

        -webkit-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);

        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);

        -webkit-box-pack: center;

        -ms-flex-pack: center;

        justify-content: center;

    }



    .app-download-btn.active a,

    .app-download-btn a:hover {

        border-color: transparent;

        background-color: #2c90e4;

    }



    .app-download-btn a i {

        color: #2baffd;

        font-size: 24px;

        margin-right: 15px;

        -webkit-transition-duration: 500ms;

        -o-transition-duration: 500ms;

        transition-duration: 500ms;

    }



    .app-download-btn a p {

        color: #2baffd;

        font-size: 14px;

        line-height: 1;

        -webkit-transition-duration: 500ms;

        -o-transition-duration: 500ms;

        transition-duration: 500ms;

    }



    .app-download-btn a p span {

        font-size: 12px;

        display: block;

    }



    .app-download-btn:first-child {

        margin-right: 20px;

    }



    .app-download-btn a:hover i,

    .app-download-btn.active a i,

    .app-download-btn.active a p,

    .app-download-btn a:hover p {

        color: #fff;

    }





    /* --------------------------

    :: 7. Facts Area CSS

    -------------------------- */



    .facts_area {

        z-index: auto;

        background-image:linear-gradient(90deg, #e0a800 0%, #ffc107 100%);

    }

    .single-fact{

        padding-top: 30px;

        padding-bottom: 30px;

    }



    .facts-content > i {

        color: #ffffff;

        font-size: 36px;

    }



    .counter-area {

        min-width: 100px;

        -ms-flex-item-align: end;

        align-self: flex-end;

    }



    .counter-area > h3 {

        color: #ffffff;

        font-size: 60px;

        margin-bottom: 0;

        line-height: 1;

    }



    .facts-content > p {

        font-size: 18px;

        color: #ffffff;

        margin-bottom: 0;

    }



    /* --------------------------

    :: 8. Pricing Plan Area CSS

    -------------------------- */



    #pricing{

        background-color: #100f0f;

    }



    .pricing-plane-area {

        background: #f5f9fc;

    }



    .plan-item {

        background: #ffffff;

        border: 1px solid #ebebeb;

        margin-bottom: 30px;

    }



    .plan-item .package-price h4 {

        font-size: 30px;
        
        color: #636d75;

        font-weight: bold;

        position: relative;

        z-index: 1;

        margin-bottom: 0;

        line-height: 1;

        padding-top: 20px;

        padding-bottom: 20px;

    }



    .plan-item .plan-button > a {

        background: #636d75;

        padding: 10px 0;

        color: #ffffff;

        font-size: 14px;

        font-weight: 500;

        display: block;

        -webkit-transition-duration: 500ms;

        -o-transition-duration: 500ms;

        transition-duration: 500ms;

    }



    .plan-item .package-description > p {

        margin-bottom: 0;

        line-height: 1;

        padding: 20px 20px;

        border-bottom: 1px solid #ebebeb;

    }



    .plan-item .package-description > p:first-child {

        border-top: 1px solid #ebebeb;

        padding: 20px 20px;

        font-weight: 700;

    }



    .plan-item:hover .plan-button > a {

        background-color: white;

        color: #636d75;

    }



    .pricing-detail{

        background-image:linear-gradient(90deg, #2c90e4 0%, #2baffd 100%);

        color: white;

        padding : 30px 30px;

    }



    .pricing-detail > h5{

        font-size: 35px;

    }







    /* --------------------------

    :: 9 FAQ Area CSS

    -------------------------- */



    #faq{

        background: #000000;

    }



    #faq .card-header{

        background-color: white;

    }



    #faq .card{

        margin-bottom: 30px;

        border-width: 0 0 0 3px;

        border-style: solid;

        border-image: linear-gradient(to bottom, #0e74cc, rgba(110, 191, 210, 0.8)) 1 100%;

    }





    /* --------------------------

    :: 10 Video Area CSS

    -------------------------- */



    .video-area {

        position: relative;

        z-index: 1;

        background-position: center center;

        background-size: cover;

        height: 450px;

        -webkit-box-shadow: 0 10px 50px rgba(0, 0, 0, 0.08);

        box-shadow: 0 10px 50px rgba(0, 0, 0, 0.08);

    }



    .video-area:after {

        content: '';

        position: absolute;

        display: block;

        left: 0;

        top: 0;

        right: 0;

        bottom: 0;

        z-index: 2;

        background-image: -moz-linear-gradient(90deg, #3673a5 0%, #030005 100%);

        background-image: -webkit-linear-gradient(90deg, #3673a5 0%, #030005 100%);

        background-image: -ms-linear-gradient(90deg, #3673a5 0%, #030005 100%);

        background-image: linear-gradient(90deg, #3673a5 0%, #030005 100%);

        opacity: .6;

    }



    .video-area .video-play-btn a {

        width: 80px;

        height: 80px;

        background-color: #fff;

        color: #2c90e4;

        text-align: center;

        display: block;

        font-size: 36px;

        line-height: 80px;

        padding-left: 5px;

        border-radius: 50%;

        top: 50%;

        position: absolute;

        left: 50%;

        -webkit-transform: translate(-50%, -50%);

        -ms-transform: translate(-50%, -50%);

        transform: translate(-50%, -50%);

        z-index: 3;

    }



    .video-area .video-play-btn a:hover {

        background-color: #2c90e4;

        color: #fff;

    }







    /* --------------------------

    :: 11. Blog Area CSS

    -------------------------- */



    #blog{

        background-color: #100f0f;

    }



    .our_blog_area{

        background: #f5f5f5;

    }



    .blog-item{

        background: #fff;

        margin-bottom: 30px;

    }



    .blog-item .figure-caption{

        padding: 15px 22px;

    }

    .blog-item  h5{

        font-size: 22px;

        color: #636d75;

    }





    /* --------------------------

    :: 12 App Screenshots Area CSS

    -------------------------- */

    #screenshot{

        background: #000000;

    }

    .app_screenshots_slides {

        

        margin-bottom: 30px;

    }



    .app_screenshots_slides .single-shot {

        opacity: 0.7;

        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";

        -webkit-transform: scale(0.85);

        -ms-transform: scale(0.85);

        transform: scale(0.85)

    }



    .app_screenshots_slides .center .single-shot {

        opacity: 1;

        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";

        -webkit-transform: scale(1);

        -ms-transform: scale(1);

        transform: scale(1)

    }



    .app-screenshots-area .owl-dot {

        height: 11px;

        width: 11px;

        border: 3px solid #2baffd;

        border-radius: 50%;

        display: inline-block;

        margin: 0 6px;

        margin-top: 50px;

    }



    .app-screenshots-area .owl-dot.active {

        background-color: #2baffd;

        border: transparent;

    }



    .app-screenshots-area .owl-dots {

        height: 100%;

        width: 100%;

        text-align: center;

    }







    /* --------------------------

    :: 12 Testimonials Area CSS

    -------------------------- */



    #testimonial{

        background-color: #100f0f;

    }



    .clients_testimonial_area .client-name > h5 {

        color: #2c90e4;

        font-size: 22px;

        margin-top: 5px;

    }



    .clients_testimonial_area .star-icon > i {

        font-size: 18px;

        color: #f1b922;

    }



    .clients_testimonial_area .client-description > p {

        max-width: 1010px;

        margin: auto;

        margin-bottom: 15px;

        font-size: 22px;

    }



    .clients_testimonial_area .client > i {

        font-size: 48px;

        color: #2c90e4;

        margin-bottom: 30px;

    }



    .clients_testimonial_area .client-name > p {

        color: #b5aec4;

    }



    .clients_testimonial_area ul>li{

        color: #f8f9fa;

        list-style: none;

    }



    .clients_testimonial_area .slick-dots {

        display: -moz-flex;

        display: -ms-flex;

        display: -o-flex;

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex;

        -webkit-box-pack: center;

        -ms-flex-pack: center;

        justify-content: center

    }



    .clients_testimonial_area .slick-dots li button {

        width: 12px;

        height: 12px;

        text-indent: -999999999999999999999999px;

        border: 3px solid #a49fba;

        background-color: #fff;

        border-radius: 50%;

        margin: 5.5px;

        outline: none;

    }



    .clients_testimonial_area .slick-dots li.slick-active button {

        background-color: #2c90e4;

        border-color: #2c90e8;

    }



    .clients_testimonial_area .slick-slide.client-thumbnail {

        display: -moz-flex;

        display: -ms-flex;

        display: -o-flex;

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex;

        -webkit-box-pack: center;

        -ms-flex-pack: center;

        justify-content: center;

        -webkit-box-align: center;

        -ms-flex-align: center;

        align-items: center;

        height: 129px;

    }





    .clients_testimonial_area .slick-slide img {

        display: block;

        width: 80px !important;

        height: 80px !important;

        border-radius: 50%;

        border: 5px solid #fff;

        -webkit-box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);

        box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);

    }



    .clients_testimonial_area .slick-slide.slick-current img {

        width: 100px !important;

        height: 100px !important;

    }



    .clients_testimonial_area .slick-arrow {

        position: absolute;

        width: 30px;

        background-color: #100f0f;

        height: 100%;

        text-align: center;

        font-size: 24px;

        color: #b5aec4;

        display: block;

        line-height: 550%;

        left: 0;

        z-index: 90;

        cursor: pointer;

    }



    .clients_testimonial_area .slick-arrow.fa-angle-right {

        left: auto;

        right: 0;

        top: 0;

    }





    /* --------------------------

    :: 13. contact-us Area CSS

    -------------------------- */



    #contact-us{

        background-color: #000000;

        padding: 100px 0 100px;

    }



    .contact-form .form-control{

        border-radius: 0px;

    }



    .contact-form{

        padding: 50px;

        background-color: #4C5462;

        color: white;

    }



    .contact-detail{

        background-image: linear-gradient(90deg, #2c90e4 0%, #2baffd 100%);

        color: white;

        padding: 50px;

        height: 100%;

    }



    .contact-detail > p{

        color: white;

    }



    .contact-icons li{

        margin-top: 20px;

    }



    .contact-icons li >a{

        color: white;

    }



    /* --------------------------

    :: 14. Newsletter Area CSS

    -------------------------- */



    #newsletter{

        background: #000000;

    }



  
    .newsletter{

        margin: 0 auto;

        margin-bottom: 30px;

    }



    .newsletter .form-control{

        font-size: 18px;

        padding: 15px 15px;

        border-radius: 25px !important;

    }

    .newsletter span{

        position: absolute;

        right: 1%;

        top: 9%;

        z-index: 98;

    }





    /* --------------------------

    :: 15. Footer Area CSS

    -------------------------- */



    footer{

        background: #1f2a39;

        padding: 70px 0 50px;

    }



    .social-icons{

        margin-top: 15px;

        margin-bottom: 25px;

    }



    .social-icons li a{

        background: #fff none repeat scroll 0 0;

        border: 0 none;

        border-radius: 100px;

        color: #70798f;

        display: inline-block;

        font-size: 14px;

        height: 40px;

        width: 40px;

        line-height: 40px;

        position: relative;

        -webkit-transition: all 0.3s ease 0s;

        transition: all 0.3s ease 0s;

        z-index: 1;

    }



    .social-icons li a:hover{

        background-image: linear-gradient(90deg, #2c90e4 0%, #2baffd 100%);

        color: white;

    }



    .copy-right{

        color: #ffffff;

    }



    .copy-right a{

        color: white;

    }





    /* --------------------------

    :: 15. Responsive CSS

    -------------------------- */



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

        .top_menu .navbar-brand {

            font-size: 42px;

        }

        .top_menu #nav .nav-link {

            padding-right: 7.5px;

        }

    }



    @media (min-width: 320px) and (max-width: 991px) {

         .top_menu #nav .nav-link{

            background: #2ba5f5;

        }

        .main-header.sticky .top_menu #nav .nav-link {

        color: #fff;

        }

    }



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

        .top_menu .navbar-brand {

            font-size: 42px;

        }

        .top_menu #nav .nav-link {

            padding-right: 7.5px;

        }

    }





    @media (min-width: 320px) and (max-width: 760px) {

        .home-content .submit{

            margin-left: 30px;

        }

        .feature-single{

            margin-bottom: 0;

        }

        .feature-img {

                margin-top: 30px;

         }





    }

    @media (min-width: 300px) and (max-width: 520px) {
        .display-4 {
            font-size: 2.5rem;
        }
        .section-heading > h2{
            font-size: 30px;
        }
        .app-download-area{
            display: inline-block;
        }
        .app-download-btn a{
            margin-bottom: 10px;
        }
        .pricing-detail > h5 {
            font-size: 28px;
        }
    }



    /* --------------------------

    :: 17. Preloader CSS

    -------------------------- */

    #preloader {

        position: fixed;

        top: 0;

        left: 0;

        width: 100%;

        height: 100%;

        z-index: 9999999;
		
		background-image: -moz-linear-gradient(90deg, #000 0%, #100f0f 100%);

        background-image: -webkit-linear-gradient(90deg, #000 0%, #100f0f 100%);

        background-image: -ms-linear-gradient(90deg, #000 0%, #100f0f 100%);

        background-image: linear-gradient(90deg, #000 0%, #100f0f 100%);
		

    }

    .ozient-folding-cube {

      top: 41%;  

      margin: 20px auto;

      width: 40px;

      height: 40px;

      position: relative;

      -webkit-transform: rotateZ(45deg);

              transform: rotateZ(45deg);

    }



    .ozient-folding-cube .ozient-cube {

      float: left;

      width: 50%;

      height: 50%;

      position: relative;

      -webkit-transform: scale(1.1);

          -ms-transform: scale(1.1);

              transform: scale(1.1); 

    }

    .ozient-folding-cube .ozient-cube:before {

      content: '';

      position: absolute;

      top: 0;

      left: 0;

      width: 100%;

      height: 100%;

      background-color: #fff;

      -webkit-animation: ozient-foldCubeAngle 2.4s infinite linear both;

              animation: ozient-foldCubeAngle 2.4s infinite linear both;

      -webkit-transform-origin: 100% 100%;

          -ms-transform-origin: 100% 100%;

              transform-origin: 100% 100%;

    }

    .ozient-folding-cube .ozient-cube2 {

      -webkit-transform: scale(1.1) rotateZ(90deg);

              transform: scale(1.1) rotateZ(90deg);

    }

    .ozient-folding-cube .ozient-cube3 {

      -webkit-transform: scale(1.1) rotateZ(180deg);

              transform: scale(1.1) rotateZ(180deg);

    }

    .ozient-folding-cube .ozient-cube4 {

      -webkit-transform: scale(1.1) rotateZ(270deg);

              transform: scale(1.1) rotateZ(270deg);

    }

    .ozient-folding-cube .ozient-cube2:before {

      -webkit-animation-delay: 0.3s;

              animation-delay: 0.3s;

    }

    .ozient-folding-cube .ozient-cube3:before {

      -webkit-animation-delay: 0.6s;

              animation-delay: 0.6s; 

    }

    .ozient-folding-cube .ozient-cube4:before {

      -webkit-animation-delay: 0.9s;

              animation-delay: 0.9s;

    }

    @-webkit-keyframes ozient-foldCubeAngle {

      0%, 10% {

        -webkit-transform: perspective(140px) rotateX(-180deg);

                transform: perspective(140px) rotateX(-180deg);

        opacity: 0; 

      } 25%, 75% {

        -webkit-transform: perspective(140px) rotateX(0deg);

                transform: perspective(140px) rotateX(0deg);

        opacity: 1; 

      } 90%, 100% {

        -webkit-transform: perspective(140px) rotateY(180deg);

                transform: perspective(140px) rotateY(180deg);

        opacity: 0; 

      } 

    }



    @keyframes ozient-foldCubeAngle {

      0%, 10% {

        -webkit-transform: perspective(140px) rotateX(-180deg);

                transform: perspective(140px) rotateX(-180deg);

        opacity: 0; 

      } 25%, 75% {

        -webkit-transform: perspective(140px) rotateX(0deg);

                transform: perspective(140px) rotateX(0deg);

        opacity: 1; 

      } 90%, 100% {

        -webkit-transform: perspective(140px) rotateY(180deg);

                transform: perspective(140px) rotateY(180deg);

        opacity: 0; 

      }

    }


    /* --------------------------
	
    :: 18. Facts 2 Area CSS

    -------------------------- */



    .facts_area2 {

        z-index: auto;

        background-image:linear-gradient(90deg, #981a62 0%, #a81d5e 100%);

    }

    .single-fact{

        padding-top: 30px;

        padding-bottom: 30px;

    }



    .facts-content > i {

        color: #ffffff;

        font-size: 36px;

    }



    .counter-area {

        min-width: 100px;

        -ms-flex-item-align: end;

        align-self: flex-end;

    }



    .counter-area > h3 {

        color: #ffffff;

        font-size: 60px;

        margin-bottom: 0;

        line-height: 1;

    }



    .facts-content > p {

        font-size: 18px;

        color: #ffffff;

        margin-bottom: 0;

    }



    /* --------------------------
	
    :: 19. Contact Form

    -------------------------- */
	
	
form#contactform .validation {
    font-size: 12px;
    color: red;
    /*font-style: italic;*/
}

#sendmessage {
    border: 1px solid #e6e6e6;
    background: #f6f6f6;
    display: none;
    text-align: center;
    padding: 15px 12px 15px 65px;
    margin: 10px 0;
    font-weight: 600;
    margin-bottom: 30px;
}

#sendmessage {
    color: #42c161;
}

#sendmessage.show, .show {
    display: block;
}








#sound{
     background: #ffffff;
}
	
#lighting{
     background: #100f0f;
}

#effects{
     background: #343a40;
}

#dj{
     background: #100f0f;
}

#laser{
     background: #343a40;
}

#photos{
     background: #343a40;
}

#videos{
     background: #100f0f;
}