{% extends "static-pages/base.html"%}

{% block title %}
Crypto Project
{% endblock %}

{% block content %}
<section id="heroSection" class="flex items-center justify-around pt-10 pb-10">
    <div>
        <h1 class="font-bold text-5xl text-blue-1">International Digital<br>Depository</h1>
        <div style="position:absolute;top:50%;">
            <img src="{{ URL_ROOT }}assets/img/cryptoCoins.png" style="width: 80%;height: auto;">
        </div>
        <div class="bg-blue-1 mt-10" style="height:112px;border-radius:24px;width:352px;padding:20px;font-size:24px;">
            <p class="text-white">Your Income 1% for the 
                entire deposit amount</p>
        </div>
        <img src="{{ URL_ROOT }}assets/img/tetherIcon.png" style="height:200px;width:auto;position:absolute;left:45%;top:55%;">
    </div>
    <div>
        <img src="{{ URL_ROOT }}assets/img/cryptoHero.png" style="height: 450px;width:auto;">
    </div>
</section>

<section class="bg-blue-100">
    @php 

    include("ticker.html");

    @endphp
</section>

<section class="mt-10 mb-10 md:flex items-center justify-around px-20" style="width:100%;">
    <div class="md:w-1/2">
        <img src="{{ URL_ROOT }}assets/img/cryptoChart.png" style="width:80%;height:auto;">
    </div>
    <div class="md:w-1/2">
        <h2 class="mb-5 text-blue-1 font-bold text-3xl">Investment You Can Trust</h2>
        <p>Truly global success of the international digital depository «Titans Solution Corp» has been achieved as «Titans Solution Corp» guarantees income to all its clients in the amount of 1% per each calendar day.This tariff is unique because a deposit in «Titans Solution Corp» can be placed in both dollars and cryptocurrency. Currently, no bank in the world provides such opportunities.</p>
        <div class="mt-5">
			<button type="button"
				class="button focus:outline-none text-white focus:ring-4 focus:ring-orange-300 font-medium rounded-lg text-sm px-5 py-2.5 mb-2">
				Sign In
			</button>

			<button type="button"
				class="button-blue focus:outline-none text-white focus:ring-4 focus:ring-orange-300 font-medium rounded-lg text-sm px-5 py-2.5 mb-2">
				Register
			</button>
		</div>
    </div>
</section>

<section class="bg-blue-100">
    @php 

    include("ticker.html");

    @endphp
</section>

<section class="mt-10 mb-10 px-20 md:flex items-center justify-around">
    
    <div class="md:w-1/2">
        <h2 class="mb-5 text-blue-1 font-bold text-3xl">Live Crypto Rates from<br>
            Trading View</h2>
        <p>Enjoy and perform your transactions using live rates from tradingview.com</p>
        <div class="mt-5">
			<button type="button"
				class="button focus:outline-none text-white focus:ring-4 focus:ring-orange-300 font-medium rounded-lg text-sm px-5 py-2.5 mb-2">
				Sign In
			</button>

			<button type="button"
				class="button-blue focus:outline-none text-white focus:ring-4 focus:ring-orange-300 font-medium rounded-lg text-sm px-5 py-2.5 mb-2">
				Register
			</button>
		</div>
        <img src="{{ URL_ROOT }}assets/img/tetherOnly.png" style="position:absolute;left:45%;width:200px;height:auto;">
    </div>

    <div class="md:w-1/2" align="center">
        @php 

            include("markets.html");

        @endphp
    </div>

</section>

<section class="mt-20 mb-10 px-20 text-center">

    <h2 class="mb-5 text-blue-1 font-bold text-3xl">How Does Cryptocurrency Exchange Happen?</h2>
    <p class="px-20">
        Exchange transactions in the international digital depository «Titans Solution Corp» (that is account top up with one cryptocurrency and withdrawing (transferring) funds with another one) are operations for which no commissions are charged.
        All exchange transactions are carried out in full accordance with the «Titans Solution Corp» rates for the purchase and sale of cryptocurrency, current at the time of the transaction.
        Rates for buying and selling cryptocurrency are set in the international digital depository «Titans Solution Corp» based on the current trading situation on exchanges and exchange platforms and are displayed on the balance replenishment page and the withdrawal page in the client's personal account.
    </p>
    <div class="mt-5">
        <button type="button"
            class="button focus:outline-none text-white focus:ring-4 focus:ring-orange-300 font-medium rounded-lg text-sm px-5 py-2.5 mb-2">
            Sign In
        </button>

        <button type="button"
            class="button-blue focus:outline-none text-white focus:ring-4 focus:ring-orange-300 font-medium rounded-lg text-sm px-5 py-2.5 mb-2">
            Register
        </button>
    </div>
</section>

<section class="bg-blue-100">
    @php 

    include("ticker.html");

    @endphp
</section>
{% endblock %}