{% extends 'base.html.twig' %}
{% block stylesheets %}
    <style>
        .btn {
            border-radius: 50px !important;
        }

        /* Hide the browser's default radio button */
        .container input {
            position: absolute;
            opacity: 0;
            cursor: pointer;
        }

        /* Show the indicator (dot/circle) when checked */
        .container input:checked ~ .checkmark:after {
        }

        /* Style the indicator (dot/circle) */
        .container .checkmark:after {
            top: 9px;
            left: 9px;
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background: white;
        }
        .waiverButton{
            height:75px !important;
            font-size:36px !important;
            color:#000 !important;
            border: 4px solid black !important;
            background-color: yellow !important;
            border-radius: 20px !important;
            font-weight: bold !important;
        }
        .modal-content{
            background-color:#0d47a1 !important;
            color:#ffffff !important;
        }

        input {
            padding: .5em;
            margin: .5em;
        }
        select {
            padding: .5em;
            margin: .5em;
        }

        #signatureparent {
            color:darkblue;
            background-color:darkgrey;
            /*max-width:600px;*/
            padding:20px;
        }

        /*This is the div within which the signature canvas is fitted*/
        #signature {
            border: 2px dotted black;
            background-color:lightgrey;
        }

        /* Drawing the 'gripper' for touch-enabled devices */
        html.touch #content {
            float:left;
            width:92%;
        }
        html.touch #scrollgrabber {
            float:right;
            width:4%;
            margin-right:2%;
            background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAFCAAAAACh79lDAAAAAXNSR0IArs4c6QAAABJJREFUCB1jmMmQxjCT4T/DfwAPLgOXlrt3IwAAAABJRU5ErkJggg==)
        }
        html.borderradius #scrollgrabber {
            border-radius: 1em;
        }
        body{
            background-color: #0d47a1 !important;
            color:#ffffff !important;
        }
    </style>

{% endblock %}
{% block modal %}
{% endblock %}
{% block body %}
    <div class="container-fluid" style="">
        <div class="row" style="background-color:#0d47a1;height: 70px;">
            <div class="col-md-12 text-center" style="padding:10px;">
                <img src="http://member.iserviceauto.com/iServiceLogo.png" height="50px;">
            </div>
        </div>
        <div class="row">
            <div class="col-md-12 text-center">
               <h1><u>AUTHORIZATION</u></h1>
                <h1><u>ACCEPTED</u></h1>
                <p><img src="{{ asset('success.png') }}"> </p>
                <h2>Click Below</h2>
                <p><img width="50px" src="{{ asset('down-arrow.png') }}"> </p>
                <a href="{{ path('client', {('hash'):hash}) }}" class="btn waiverButton"> CONTINUE </a>
            </div>
        </div>
    </div>
{% endblock %}
{% block javascripts %}
{% endblock %}