/* YuguOrange: #f17c1d  , YuguYellow:  #f1ac21 */

/*
************************************************************************************************************************
****************************************     GENERAL STYLING     *******************************************************
************************************************************************************************************************
 */

html, body {
        background-color: #fff;
        color: #636b6f;
        font-family: 'Nunito', sans-serif;
        font-weight: 200;
        height: 100vh;
        margin: 0;
    }

    .full-height {
        height: 100vh;
    }

    .flex-center {
        align-items: center;
        display: flex;
        justify-content: center;
    }

    .position-ref {
        position: relative;
    }

    .top-right {
        position: absolute;
        right: 10px;
        top: 18px;
    }

    .content {
        text-align: center;
    }

    .title {
        font-size: 84px;
    }

    .links > a {
        color: #636b6f;
        padding: 0 25px;
        font-size: 13px;
        font-weight: 600;
        letter-spacing: .1rem;
        text-decoration: none;
        text-transform: uppercase;
    }

    a{
        color: #a8510b
    }
    .m-b-md {
        margin-bottom: 30px;
    }

    .btn-primary{
        background-color: #ff9a00;
        border-color: #ff9a00;
    }

    .btn-primary:hover{
        background-color: #f1ac21;
        border-color: #f1ac21;
    }

    .text-primary{
        color:#ff9a00  !important;
    }

    .badge-info{
        background-color:#3E4960;
    }

    .stroke-primary{
        stroke:#F17C1D;
    }

    .text-info{
        color:#2E2E2E !important;
    }

    .speech-bubble{
        background:#3E4960;
    }

    .speech-bubble:before{
        border-top-color:#3E4960;
    }

    .speech-bubble:after{
        border-top-color:#3E4960;
        background-color:#3E4960;
        border:1px solid #3E4960;
    }

    .bg-orange{
        background-color: #f17c1d;
    }

    .swiper-pagination-bullet-active{
        background:#001a3e;
    }

    .bg-platinum{
        background-color: #E9E9E9;
    }

    .bg-carbon{
        background-color:#2b354f;
    }

    .navigation.navbar-sticky .nav-link.active, .navigation.navbar-sticky .nav-link:hover {
            color: #2b354f; }
/*
************************************************************************************************************************
****************************************     Index STYLING     *******************************************************
************************************************************************************************************************
 */
    [data-aos^=fade][data-aos^=fade]{
        opacity: 1;
    }

    .swiper-wrapper{
        width:217.5px;
    }

    .swiper-container{
        height: fit-content;
    }

    .index-hero{
        background: url('/img/index-hero.jpg');
    }

    .gradient-peach-yellow{
        background-image:-webkit-gradient(linear, left bottom, right top, from(#FF4E50), to(#F9D423));
    }

    .automate-social-header .shape-right{
        background-image: linear-gradient(-57deg, #f1ac21 0%, #f1ac21 100%);
    }

    .automate-social-header .shape-main.shadow{
        background-color: rgba(80, 102, 4, 0.05);
    }

/*    .advanced-automation-solution{
        background-image:url('/img/test3.png');
    }*/

    .why-us .shape-background.right{
        background-image:url('/img/index-app-features.png');
         background-repeat: no-repeat;
    }

    .automate-social-header .shape-main{
        background-color:transparent;
    }

    .why-icon-list:before{
        left:60px;
        border: 1px dashed #001a3e;
    }

    .cls-1{
        fill: #f17c1d;
        opacity: 0.9;
    }

    .automate-social-header .shape-main{
        height: 140%;
    }
    .navigation .dropdown-menu{
        margin-top:0;
        opacity: 0.9;
    }

    .bg-business-index{
        background-image: url('/img/restaurant-background.jpg');
    }
/*
************************************************************************************************************************
****************************************     Footer STYLING     *******************************************************
************************************************************************************************************************
 */

    .download{
        max-height: 180px;
        flex-grow:0;
    }
/*
************************************************************************************************************************
****************************************     Cookie STYLING     *******************************************************
************************************************************************************************************************
 */
.cookie-hero{
     background-image:url('/img/cookie-hero.jpg');
 }


 /*
************************************************************************************************************************
****************************************     Why choose Yugu STYLING     *******************************************************
************************************************************************************************************************
 */
 .why-yugu-hero{
     background-image:url('/img/why-yugu-hero.jpg');
 }

 /*
************************************************************************************************************************
****************************************     App STYLING     *******************************************************
************************************************************************************************************************
 */

  .app-hero{
     background-image:url('/img/app-hero.png');
 }

/*
************************************************************************************************************************
****************************************     Contact STYLING     *******************************************************
************************************************************************************************************************
 */
    .gradient.auckland-banner{
        background-image:url('/img/pos-nz-contact-banner.png');
    }

    .about-banner{
         background-image:url('/img/about-hero.png');
    }

    /*
************************************************************************************************************************
****************************************     Index STYLING     *******************************************************
************************************************************************************************************************
 */
    .pos-hero{
        background-image:url('/img/pos.png');
    }
/*
************************************************************************************************************************
****************************************     Nav STYLING     *******************************************************
************************************************************************************************************************
 */
    .st-nav a{
        color:#2b354f;
    }


    @media (max-width: 575.98px){
        .animations{
            display: none;
        }

        #app-features-background{
            display: none
        }
    }