@extends('cabMeWebsite.master')

@section('content')
    <style>
        .fs18
        {
            text-align: justify;
        }
        @media (max-width: 425px) and (min-width: 320px) {
            .inner-padding {
                padding: 0px 60px !important;

            }
        }
        @media (max-width: 375px) and (min-width: 320px) {
            .inner-padding {
                padding: 0px 60px !important;
            }
        }
        @media only screen and (max-width: 320px) {
            .inner-padding {
                padding: 0px 50px !important;
            }
        }
        .terms
        {
            max-height: 600px;
        }
        .bg-image-style 
        {
            height: 600px;
            background-image: url({{asset('laravel-website')}}/img/banner.png); 
            background-repeat:no-repeat; 
            background-size: cover;
        }
    </style>
    <section class="subheader">
        <div class="container">
            <div class="col-12">
                <div class="row">
                    <div class="inner-padding" style="text-align: center">
                        <h2>Invitation</h2>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="terms" style="">
        <div class="bg-image-style">
            <div class="container py-1 py-sm-2 row" style="padding-top: 5% !important;">
                <div class="col-lg-8 col-md-8 col-sm-12 col-xs-12 inner-padding">
                    <div class="row">
                        <div class="row py-2 py-md-3">
                            <h1 style="color: white">Invite your friend and earn</h1><br><br>
                             <h5 style="color: white"> When your friend take {{ $inviteOffer->ride }} rides with us you get ${{ $inviteOffer->invite_by_amount }} Off  on your ride and your friend gets ${{ $inviteOffer->invite_to_amount }} off on his first ride</h5>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-4 col-sm-12 col-xs-12">
                    <div class="col-12 col-md-12 text-center" style="background-color: white; padding: 20px;border-radius: 5px">

                        <div class="centerDiv mt-2 mt-md-3">

                            <h2 style="padding-bottom: 0px !important;margin-bottom: 0px !important;">
                                Download CabMe
                            </h2>

                            <p class="mt-2 mt-md-4">

                                <a href="https://apps.apple.com/au/app/cabme/id1479155223" target="_blank"><img src="{{asset('laravel-website')}}/img/appstore.png" alt="Logo Image" width="" height="" /></a>

                                <a href="https://play.google.com/store/apps/details?id=com.cabmeuser.cabme" target="_blank"><img src="{{asset('laravel-website')}}/img/playstore.png" alt="Logo Image" width="" height="" /></a>

                            </p>

                        </div>

                    </div>
                    <!--//Row-->
                </div>
            </div>
        </div>
    </section>

@endsection