@extends('authlayout.layout')
@section('content')
    <section class="sign-in-page h-100 w-100">
        <div class="container">
            <div class="row justify-content-center align-items-center height-self-center">
                <div class="col-lg-7 col-md-12 align-self-center">
                    <div class="sign-user_card ">
                        <h6 class="text-dark">Step 2 of 3</h6>
                        <h4 class="text-left p-4 text-dark">Choose the plan that’s good for you</h4>
                        <div class="text-left">
                            <ul class="arrow-list list-group text-left border-0">
                                <li class="list-group-item border-0">No Ads</li>
                                <li class="list-group-item border-0">Cancel any time</li>

                            </ul>
                        </div>
                        <div class="text-right">
                            <div class="row">
                                <div class="col-md-3 col-lg-3"></div>
                                <div class="col-md-9 col-lg-9">
                                    <div class="">
                                        <a href="{{route('signup.payment')}}" class="btn btn-hover ml-n5" style="margin-right:50px">Standard</a>

                                    </div>
                                    <table class="table  table-hover mt-3">

                                        <tbody class="text-left">
                                        <tr class="border-0">
                                            <td class="border-top-0">Monthly Price</td>
                                            <td  class="border-top-0">
                                                $60
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>Video Quality</td>
                                            <td>Better</td>
                                        </tr>
                                        <tr>
                                            <td>Resolution</td>
                                            <td>1080p</td>
                                        </tr>
                                        <tr>
                                            <td>Device you can use</td>
                                            <td class="text-center">
                                                <ul class="list-group border-0 text-left" style="line-height:0.7">
                                                    <li class="list-group-item border-0">
                                                        <i class="ri-computer-line"></i> <br>
                                                        <span style="font-size:10px">Computer</span>

                                                    </li>
                                                    <li class="list-group-item border-0">
                                                        <i class="fas fa-mobile-alt"></i> <br>
                                                        <span style="font-size:10px">Phone</span>

                                                    </li>
                                                    <li class="list-group-item border-0">
                                                        <i class="fas fa-tablet-alt"></i> <br>
                                                        <span style="font-size:10px">Tablet</span>

                                                    </li>
                                                </ul>
                                            </td>
                                        </tr>
                                        </tbody>
                                    </table>

                                </div>
                            </div>
                        </div>
                        <p class="text-center ">Full HD (1080p),availability subject to your internet service and device capabilities.
                            Not all content available in HD. See Terms of Use for more details</p>
                        <div class="text-center">
                            <a href="{{route('signup.payment')}}" class="btn btn-hover my-2">Continue</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection