/*

Theme Name:

Author: yaminncco





Colors:

	Body 		: #868F9B

	Headers 	: #10161A

	Primary 	: #0096D6

	Dark        : #FCFCFF

	Grey 		: #F4F4F4 #FAFAFA #EEE



Fonts: Montserrat Varela Round



Table OF Contents

------------------------------------

1 > General

2 > Logo

3 > Navigation

4 > Header

5 > About           DELETED

6 > Portfolio       DELETED

7 > Services

8 >  Why choose us  DELETED

9 >  Numbers

10 > Pricing        DELETED

11 > Testimonial    DELETED

12 > Team           DELETED

13 > Blog           DELETED

14 > Blog post      DELETED

15 > Blog sidebar   DELETED

16 > Contact

17 > Footer

18 > Responsive

19 > Owl theme      DISABLED

20 > Back to top

21 > Preloader



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



/*------------------------------------*\

	General

\*------------------------------------*/



/* -- typography -- */

/*#region TYPOGRAPHY*/

body {

    font-family: 'Varela Round', sans-serif;

    font-size: 16px;

    line-height: 1.6;

    overflow-x: hidden;

    color: #868F9B;

}



h1, h2, h3, h4, h5, h6 {

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

    font-weight: 700;

    margin-top: 0px;

    margin-bottom: 20px;

    color: #10161A;

}



h1 {

    font-size: 42px;

}



h2 {

    font-size: 36px;

}



h3 {

    font-size: 21px;

}



h4 {

    font-size: 18px;

}



h5 {

    font-size: 16px;

}



a {

    color: #0096D6;

    text-decoration: none;

    -webkit-transition: 0.2s opacity;

    transition: 0.2s opacity;

}



a:hover, a:focus {

        text-decoration: none;

        outline: none;

        opacity: 0.8;

        color: #0096D6;

    }



.main-color {

    color: #0096D6;

}



.white-text {

    color: #FFF;

}



::-moz-selection {

    background-color: #0096D6;

    color: #FFF;

}



::selection {

    background-color: #0096D6;

    color: #FFF;

}



ul, ol {

    margin: 0;

    padding: 0;

    list-style: none

}



/*#endregion*/



/* -- section  -- */

/*#region SECTION*/

.section {

    position: relative;

    margin-top:-1px;

    padding-top:10px;

    padding-bottom:10px;

}



.md-padding {

    padding-top: 120px;

    padding-bottom: 120px;

}



.sm-padding {

    padding-top: 60px;

    padding-bottom: 60px;

}

/*#endregion*/



/* --  background section  -- */

/*#region BG-SECTION*/

.bg-grey {

    background-color: #FAFAFA;

    border-top: 1px solid #EEE;

    border-bottom: 1px solid #EEE;

}

.bg-greydar {

    background-color: #E8E8E8;

    border-top: 1px solid #EEE;

    border-bottom: 1px solid #EEE;

}



.bg-dark {

    background-color: #1C1D21;

}

/*#endregion*/



/* --  background image section  -- */

/*#region BG-IMAGE-SECTION*/

.bg-img {

    position: absolute;

    left: 0;

    top: 0;

    right: 0;

    bottom: 0;

    z-index: -1;

    background-position: center;

    background-size: cover;

    background-attachment: fixed;

}



.bg-img .overlay {

    position: absolute;

    left: 0;

    top: 0;

    right: 0;

    bottom: 0;

    opacity: .5;

    background: #1C1D21;

}

/*#endregion*/



/* --  header  -- */

/*#region HEADER*/

.header {

     position:relative;

}

#home{

    height: 100vh;

}

.section-header {

    position: relative;

    /*margin-bottom: 40;*/

}

    .col-md-6 > p {

        text-align: justify;

    }



.section-header .title {

    /* text-transform: capitalize;*/

}



.title:after {

    content:"";

  	display:block;

  	height:4px;

  	width:40px;

  	background-color: #0096D6;

    margin-top: 20px;

}



.text-center .title:after {

    margin: 20px auto 0px;

}

/*#endregion*/



/* --  Input  -- */

/*#region INPUT*/

input[type="text"], input[type="email"], input[type="password"], input[type="number"], input[type="date"], input[type="url"], input[type="tel"], textarea {

    height: 40px;

    width: 100%;

    border: none;

	  background: #F4F4F4;

    border-bottom: 2px solid #EEE;

    color: #354052;

    padding: 0px 10px;

    opacity: 0.5;

    -webkit-transition: 0.2s border-color, 0.2s opacity;

    transition: 0.2s border-color, 0.2s opacity;

}



textarea {

    padding: 10px 10px;

    min-height: 80px;

    resize: vertical;

}



input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, input[type="number"]:focus, input[type="date"]:focus, input[type="url"]:focus, input[type="tel"]:focus, textarea:focus {

    border-color: #0096D6;

    opacity: 1;

}

/*#endregion*/



/* --  Buttons  -- */

/*#region BUTTONS*/

.main-btn, .white-btn, .outline-btn {

    display: inline-block;

    padding: 10px 35px;

    margin: 3px;

    border: 2px solid transparent;

    border-radius: 3px;

    -webkit-transition: 0.2s opacity;

    transition: 0.2s opacity;

}



.main-btn {

    background: #0096D6;

    color: #FFF;

}



.white-btn {

    background: #FFF;

    color: #10161A !important;

}



.outline-btn {

    background: transparent;

    color: #0096D6 !important;

    border-color: #0096D6;

}



.main-btn:hover, .white-btn:hover, .outline-btn:hover {

    opacity: 0.8;

}

/*#endregion*/



/*------------------------------------*\

	Logo 

\*------------------------------------*/

/*#region LOGO*/

.navbar-brand {

    padding: 0;

}



.navbar-brand .navbar-brand  {

    max-height: 50px;

    display: block;

}

.navbar-brand .logo-alt {

        max-height: 80px;

        display: block;

    }

    .navbar-brand .logo {

        max-height: 55px;

        display: block;

    }

#nav:not(.nav-transparent):not(.fixed-nav) .navbar-brand .logo-alt {

    display: none;

}



#nav.nav-transparent:not(.fixed-nav) .navbar-brand .logo {

    display: none;

}

#nav.fixed-nav .navbar-brand .logo-alt {

    display: none;

}



.navbar-desc {

    display: none;

}



.navbar-header {

    display:inline-block;

    width: 280px;

}

.navbar-desc {

    padding: 0;

    margin-left: 20px;

    max-height: 50px;

    display: block;

    margin-top: 10px;

    width: 300px;

}



.navbar-desc-text {

    font-family: Calibri;

    max-height: 50px;

    line-height: 18px;

    display: block;

    margin: 0;

    padding: 0;

    list-style: none;

    font-size:20px;

}

.navbar-desc > p {

    background: transparent;

    color: #10161A;

}

/*#endregion*/

 

/*------------------------------------*\

	Navigation

\*------------------------------------*/

/*#region NAVIGATION*/

        #nav {

            text-align: center;

            padding: 10px 0px;

            background: #FFF;

            -webkit-transition: 0.2s padding;

            transition: 0.2s padding;

            z-index: 999;

        }



        #nav.navbar {

            border: none;

            border-radius: 0;

            margin-bottom: 0px;

        }



        #nav.fixed-nav {

            position: fixed;

            left: 0;

            right: 0;

            top: 0;

            padding: 10px 0px;

            background-color: #FFF !important;

            border-bottom: 1px solid #EEE;

        }



        #nav.nav-transparent {

            background: transparent;

        }

/*#nav.nav-transparent:not(.fixed-nav)*/

         .navbar {

                box-shadow: 0 10px 10px -2px rgba(0,0,0,.2);

            }

    /* -- nav btn collapse -- */



    .nav-collapse {

        position: relative;

        float: right;

        width: 40px;

        height: 40px;

        margin-top: 5px;

        margin-right: 5px;

        cursor: pointer;

        z-index: 99999;

    }



        .nav-collapse span {

            display: block;

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

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

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

            position: absolute;

            top: 50%;

            left: 50%;

            width: 25px;

        }



            .nav-collapse span:before, .nav-collapse span:after {

                content: "";

                display: block;

            }



            .nav-collapse span, .nav-collapse span:before, .nav-collapse span:after {

                height: 4px;

                background: #10161A;

                -webkit-transition: 0.2s all;

                transition: 0.2s all;

            }



                .nav-collapse span:before {

                    -webkit-transform: translate(0%, 10px);

                    -ms-transform: translate(0%, 10px);

                    transform: translate(0%, 10px);

                }



                .nav-collapse span:after {

                    -webkit-transform: translate(0%, -14px);

                    -ms-transform: translate(0%, -14px);

                    transform: translate(0%, -14px);

                }



    #nav.open .nav-collapse span {

        background: transparent;

    }



        #nav.open .nav-collapse span:before {

            -webkit-transform: translateY(0px) rotate(-135deg);

            -ms-transform: translateY(0px) rotate(-135deg);

            transform: translateY(0px) rotate(-135deg);

        }



        #nav.open .nav-collapse span:after {

            -webkit-transform: translateY(-4px) rotate(135deg);

            -ms-transform: translateY(-4px) rotate(135deg);

            transform: translateY(-4px) rotate(135deg);

        }

/*#endregion */



/*------------------------------------*\

	Header

\*------------------------------------*/

/*#region HEADER*/



    header {

        position: relative;

    }



#home {

    /*height: 100vh;*/

}



        #home .home-wrapper {

            position: absolute;

            left: 0px;

            right: 0px;

            top: 50%;

            -webkit-transform: translateY(-50%);

            -ms-transform: translateY(-50%);

            transform: translateY(-50%);

            text-align: center;

        }





    .home-content h1 {

        text-transform: uppercase;

    }



    .home-content button {

        margin-top: 20px;

    }



    .header-wrapper h2 {

        display: inline-block;

        margin-bottom: 0px;

    }



    .header-wrapper .breadcrumb {

        float: right;

        background: transparent;

        margin-bottom: 0px;

    }



        .header-wrapper .breadcrumb .breadcrumb-item.active {

            color: #868F9B;

        }



    .breadcrumb > li + li:before {

        color: #868F9B;

    }

.home-content {

    margin-top: 50px;

    padding-top: 60px;

    width: 100%;

    text-align: center;

}

.home-header {

    margin-bottom: 100px;

}

/*#endregion*/



/*------------------------------------*\

	CONTENT

\*------------------------------------*/

/*#region CONTENT*/

.solution-content {

    margin-top: -1px;

    padding-top: 110px;

    padding-bottom: 80px;

    width: 100%;

    height: 100%;

    text-align: center;

}



.flex-box {

    display: inline-block;

    vertical-align: top;

    margin-top: 5px;

    margin-right: 5px;

    margin-left: 5px;

    margin-bottom: 5px;

    height: 300px;

    width: 250px;

}



.flex-box-wide {

    display: inline-block;

    vertical-align: top;

    margin-top: 10px;

    margin-right: 10px;

    margin-left: 10px;

    margin-bottom: 10px;

    height: 250px;

    width: 250px;

}



/*#endregion*/



/*------------------------------------*\

	About

\*-----------------------------------c-*/

/*#region ABOUT*/

    .about {

        /*position: relative;*/

        text-align: center;

        padding: 20px 20px;

        border: 1px solid #EEE;

        margin: 20px 0px;

        height: 100%;

        width: 100%;

    }





        .about:after {

            content: "";

            background-color: #1C1D21;

            position: absolute;

            left: 0;

            top: 0;

            bottom: 0;

            width: 0%;

            z-index: -1;

            -webkit-transition: 0.2s width;

            transition: 0.2s width;

        }





        .about h3 {

            -webkit-transition: 0.2s color;

            transition: 0.2s color;

        }

/*#endregion*/



/*------------------------------------*\

	Services

\*------------------------------------*/

/*#region SERVICES*/

.service {

    /*

    position: relative;

    padding: 40px 20px 40px 70px;

    margin: 15px 0px;

    border: 1px solid #EEE;

    height: 100%;

    width: 100%;

    */

    background: white;

    text-align: center;

    padding: 20px 20px;

    border: 1px solid #EEE;

    margin: 20px 0px;

    height: 100%;

    width: 100%;

}

/*#endregion*/



/*------------------------------------*\

	FEATURE

\*------------------------------------*/

/*#region FEATURE*/

    .img-rad{

        border-radius:80%;

    }

    .feature {

        margin: 15px 0px;

        text-align:left;

    }



        .feature i {

            float: left;

            padding: 5px;

            border-radius: 50%;

            color: #0096D6;

            border: 1px solid #0096D6;

            margin-right: 5px;

        }

/*#endregion*/



/*------------------------------------*\

	Numbers

\*------------------------------------*/

/*#region NUMBERS*/

    .number {

        text-align: center;

        margin: 15px 0px;

    }



        .number i {

            color: #0096D6;

            font-size: 36px;

            margin-bottom: 20px;

        }



        .number h3 {

            font-size: 36px;

            margin-bottom: 10px;

        }

/*#endregion*/



/*------------------------------------*\

	Contact

\*------------------------------------*/

/*#region CONTACT*/

    .contact {

        margin: 15px 0px;

        text-align: center;

    }



        .contact i {

            font-size: 36px;

            color: #0096D6;

            margin-bottom: 20px;

        }



    .contact-form {

        text-align: center;

        margin-top: 40px;

    }



        .contact-form .input {

            margin-bottom: 20px;

        }





            .contact-form .input:nth-child(1), .contact-form .input:nth-child(2) {

                width: calc(50% - 10px);

            }



            .contact-form .input:nth-child(2) {

                margin-left: 15px;

            }

/*#endregion*/



/*------------------------------------*\

	Footer

\*------------------------------------*/

/*#region FOOTER*/

    #footer {

        position: relative;

    }



    .footer-logo {

        text-align: center;

        margin-bottom: 40px;

    }



        .footer-logo > a > img {

            max-height: 80px;

        }



    .footer-follow {

        text-align: center;

        margin-bottom: 20px;

    }



        .footer-follow li {

            display: inline-block;

            margin-right: 10px;

            margin-bottom: 13px;

        }



            .footer-follow li a {

                display: inline-block;

                width: 50px;

                height: 50px;

                line-height: 50px;

                text-align: center;

                border-radius: 3px;

                background-color: #0096D6;

                color: #FFF;

            }



    .footer-copyright p {

        text-align: center;

        font-size: 14px;

        text-transform: uppercase;

        margin: 0;

    }

/*#endregion*/



/*------------------------------------*\

	Responsive

\*------------------------------------*/

/*#region RESPONSIVE*/

/*********************************************************/

/*      M E D I A   BEGIN                                */

/*********************************************************/



    /* -- default nav -- */



    @media only screen and (min-width: 1024px) {



        #nav.nav-transparent:not(.fixed-nav) .navbar-desc > p {

            color: #fff;

        }

        

        .main-nav li {

            padding: 0px 15px;

        }



            .main-nav li a {

                font-size: 18px;

                -webkit-transition: 0.2s color;

                transition: 0.2s color;

            }

       

        .main-nav > li > a {

            color: #10161A;

            padding: 15px 0px;

        }



        #nav.nav-transparent:not(.fixed-nav) .main-nav > li > a {

            color: #fff;

        }

        

        .main-nav > li > a:hover, .main-nav > li > a:focus, .main-nav > li.active > a {

            background: transparent;

            color: #0096D6;

        }

       

        .main-nav > li > a:after {

            content: "";

            display: block;

            background-color: #0096D6;

            height: 2px;

            width: 0%;

            -webkit-transition: 0.2s width;

            transition: 0.2s width;

        }

       

        .main-nav > li > a:hover:after, .main-nav > li.active > a:after {

            width: 100%;

        }

        

        .has-dropdown {

            position: relative;

            display: none;

        }



            .has-dropdown > a:before {

                display:none;

            }



        .dropdown {

            display:none;

        }



        .main-nav > .has-dropdown > .dropdown {

            top: 100%;

            right: 50%;

        }



            .main-nav > .has-dropdown > .dropdown .dropdown.dropdown-left {

                right: 150%;

            }

     

        .dropdown li a {

            display: block;

            color: #FFF;

            border-top: 1px solid rgba(250, 250, 250, 0.1);

            padding: 10px 0px;

        }



        .dropdown li:nth-child(1) a {

            border-top: none;

        }



        .has-dropdown:hover > .dropdown {

            opacity: 1;

            visibility: visible;

            -webkit-transform: translateY(0px) translateX(50%);

            -ms-transform: translateY(0px) translateX(50%);

            transform: translateY(0px) translateX(50%);

        }



        .has-dropdown:hover > a:before {

            -webkit-transform: rotate(0deg);

            -ms-transform: rotate(0deg);

            transform: rotate(0deg);

        }

  

        .nav-collapse {

            display: none;

        }

        .section-header h2.title {

            font-size: 28px;

        }

         

    }



    /* -- mobile nav -- */



@media only screen and (max-width: 1024px) {

    #home {

            height: 1000px;

        }

        #nav.nav-transparent .navbar-brand .logo-alt {

            display: none !important;

        }



        #nav.nav-transparent .navbar-brand .logo {

            display: block !important;

        }



        .flex-box {

            margin-left: 25px;

            margin-right: 25px;

            height: 280px;

            width: 400px;

        }



        /*

    .flex-box-wide {

        margin-left: 25px;

        margin-right: 25px;

        height: 150px;

        width: 400px;

    }*/

        .navbar-header {

            text-align: left;

            /* width: 70%;*/

            /*width: 220px*/

        }



        .navbar-desc {

            text-align: left;

            display: inline-block;

            margin-top: 8px;

            margin-left: 12px;

            width: 180px;

        }



        .navbar-desc-text {

            font-family: Calibri;

            font-size: 16px;

            text-align: left;

            width: 220px;

        }



        .home-content {

            margin-top: 0px;

            padding-top: 0px;

        }



        .solution-content {

            margin-top: 0px;

            padding-top: 0px;

        }

        #service.solution-content {

            padding-top: 110px;

        }



        .logo {

            margin-left: 10px;

        }



        #nav {

            padding: 10px 0px;

        }



            #nav.nav-transparent {

                background: #FFF;

            }



        .main-nav {

            position: fixed;

            right: 0;

            top:70px;

            height: calc(100vh - 80px);

            -webkit-box-shadow: 0px 80px 0px 0px #1C1D21;

            box-shadow: 0px 80px 0px 0px #1C1D21;

            max-width: 250px;

            width: 0%;

            -webkit-transform: translateX(100%);

            -ms-transform: translateX(100%);

            transform: translateX(100%);

            margin: 0;

            overflow-y: auto;

            background: #1C1D21;

            -webkit-transition: 0.2s all;

            transition: 0.2s all;

        }



        #nav.open .main-nav {

            -webkit-transform: translateX(0%);

            -ms-transform: translateX(0%);

            transform: translateX(0%);

            width: 100%;

        }



        .main-nav li {

            border-top: 1px solid rgba(250, 250, 250, 0.1);

        }



            .main-nav li a {

                display: block;

                color: #FFF;

                -webkit-transition: 0.2s all;

                transition: 0.2s all;

            }



        .main-nav > li.active {

            border-left: 6px solid #0096D6;

        }



        .main-nav li a:hover, .main-nav li a:focus {

            background-color: #0096D6;

            color: #FFF;

            opacity: 1;

        }



        .has-dropdown > a:after {

            content: "\f054";

            font-family: 'FontAwesome';

            float: right;

            -webkit-transition: 0.2s -webkit-transform;

            transition: 0.2s -webkit-transform;

            transition: 0.2s transform;

            transition: 0.2s transform, 0.2s -webkit-transform;

        }



        .dropdown {

            opacity: 0;

            visibility: hidden;

            height: 0;

            background: rgba(250, 250, 250, 0.1);

        }



            .dropdown li a {

                padding: 6px 10px;

            }



        .has-dropdown.open-drop > a:after {

            -webkit-transform: rotate(90deg);

            -ms-transform: rotate(90deg);

            transform: rotate(90deg);

        }



        .has-dropdown.open-drop > .dropdown {

            opacity: 1;

            visibility: visible;

            height: auto;

            -webkit-transition: 0.2s all;

            transition: 0.2s all;

        }



        .section-header h2.title {

            font-size: 20px;

        }



        .row {

            text-align: center;

            display: inline-block;

            margin: 0 auto;



        }



        .main-btn, .default-btn, .outline-btn, .white-btn {

            padding: 8px 22px;

            font-size: 14px;

        }



        .home-content h1 {

            font-size: 36px;

        }



        .solution-content h1 {

            font-size: 36px;

        }



        .header-wrapper h2 {

            margin-bottom: 20px;

            text-align: center;

            display: block;

        }



        .header-wrapper .breadcrumb {

            float: none;

            text-align: center;

        }

    }



@media only screen and (max-width: 480px) {

    #portfolio [class*='col-xs'] {

                width: 100%;

            }



            #numbers [class*='col-xs'] {

                width: 100%;

            }



            }

   

    @media only screen and (max-width: 455px) {

        #home {

            height: 1080px;

        }

    .navbar-header {

        text-align: left;

        width: 300px;

    }



    .navbar-desc {

        text-align: left;

        margin-left: 20px;

        width: 160px;

    }



        .navbar-desc-text {

            font-family: Calibri;

            font-size: 12px;

            width: 165px;

            text-align: left;

            /*

                font-weight: bold;

            

            width:0%;

            text-align:left;

            display:none;

                */

        }



    .flex-box {

        text-align: center;

        width: 280px;

        height: 260px;

    }

}



/*********************************************************/

/*      M E D I A   END                                  */

/*********************************************************/

/*#endregion*/



/*------------------------------------*\

	Owl theme

\*------------------------------------*/

/*#region DISABLED OWL*/

/* -- dots -- */

/*

        .owl-theme .owl-dots .owl-dot span {

            border: none;

            background: #EEE;

            -webkit-transition: 0.2s all;

            transition: 0.2s all;

        }



        .owl-theme .owl-dots .owl-dot:hover span {

            background: #0096D6;

        }



        .owl-theme .owl-dots .owl-dot.active span {

            background: #0096D6;

            width: 20px;

        }

*/

        /* -- nav -- */

/*

        .owl-theme .owl-nav {

            opacity: 0;

            -webkit-transition: 0.2s opacity;

            transition: 0.2s opacity;

        }



        .owl-theme:hover .owl-nav {

            opacity: 1;

        }



        .owl-theme .owl-nav [class*='owl-'] {

            position: absolute;

            top: 50%;

            -webkit-transform: translateY(-50%);

            -ms-transform: translateY(-50%);

            transform: translateY(-50%);

            background: #0096D6;

            color: #FFF;

            padding: 0px;

            width: 50px;

            height: 50px;

            border-radius: 3px;

            line-height: 50px;

            margin: 0;

        }



        .owl-theme .owl-prev {

            left: 0px;

        }



        .owl-theme .owl-next {

            right: 0px;

        }



        .owl-theme .owl-nav [class*='owl-']:hover {

            opacity: 0.8;

            background: #0096D6;

        }

*/

/*#endregion*/



/*------------------------------------*\

	Back to X

\*------------------------------------*/

/*#region BACK-TO*/

.quick-navi-icon{

    width:27px;

    height:27px;

}

/*.service > .quick-navi-icon {

    margin-top: 10px;

    margin-bottom: 5px;

    width: 40px;

    height: 40px;

}*/

.quick-navi {

    position: fixed;

    width: 50px;

    height: 50px;

    line-height: 50px;

    text-align: center;

    background: #0096D6;

    border-radius: 3px;

    color: #FFF;

    z-index: 9999;

    -webkit-transition: 0.2s opacity;

    transition: 0.2s opacity;

    cursor: pointer;

}



#back-to-top {

    display: none;

    bottom: 150px;

    right: 20px;

}

#back-to-service {

    /*display: none;*/

    bottom: 90px;

    right: 20px;

}

#back-to-contact {

    /*display: none;*/

    bottom: 30px;

    right: 20px;

}



#back-to-top:after {

    /*content: "\f106";*/

    font-family: 'FontAwesome';

}



            #back-to-top:hover {

                opacity: 0.8;

            }

/*#endregion*/



/*------------------------------------*\

	Preloader

\*------------------------------------*/

/*#region PRELOADER*/



        #preloader {

            position: fixed;

            left: 0;

            top: 0;

            bottom: 0;

            right: 0;

            background-color: #FFF;

            z-index: 99999;

        }



        .preloader {

            position: absolute;

            left: 50%;

            top: 50%;

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

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

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

        }



            .preloader span {

                display: inline-block;

                background-color: #0096D6;

                width: 25px;

                height: 25px;

                -webkit-animation: 1s preload ease-in-out infinite;

                animation: preload 1s ease-in-out infinite;

                -webkit-transform: scale(0);

                -ms-transform: scale(0);

                transform: scale(0);

                border-radius: 50%;

            }



                .preloader span:nth-child(1) {

                    -webkit-animation-delay: 0s;

                    animation-delay: 0s;

                }



                .preloader span:nth-child(2) {

                    -webkit-animation-delay: 0.1s;

                    animation-delay: 0.1s;

                }



                .preloader span:nth-child(3) {

                    -webkit-animation-delay: 0.15s;

                    animation-delay: 0.15s;

                }



                .preloader span:nth-child(4) {

                    -webkit-animation-delay: 0.2s;

                    animation-delay: 0.2s;

                }



        @-webkit-keyframes preload {

            0% {

                -webkit-transform: scale(0);

                transform: scale(0);

            }



            50% {

                -webkit-transform: scale(1);

                transform: scale(1);

            }



            100% {

                -webkit-transform: scale(0);

                transform: scale(0);

            }

        }



        @keyframes preload {

            0% {

                -webkit-transform: scale(0);

                transform: scale(0);

            }



            50% {

                -webkit-transform: scale(1);

                transform: scale(1);

            }



            100% {

                -webkit-transform: scale(0);

                transform: scale(0);

            }

        }

/*#endregion*/