{% extends 'frontend/layout.html.twig' %}

{% block title %}
#SportBiz
{% endblock %}

{% block description %}
{% if app.request.locale == 'en' %}
The meeting point for the sports business sector, with a distinctive stamp of qualified networking, in a casual and inspiring atmosphere.
{% elseif app.request.locale == 'pt' %}
El punto de encuentro del sector de sports business, con un sello de networking calificado, en un ambiente descontracturado e inspirador.
{% else %}
El punto de encuentro del sector de sports business, con un sello de networking calificado, en un ambiente descontracturado e inspirador.
{% endif %}
{% endblock description %}

{% block stylesheets %}
{{ parent() }}
<style>
    html,body,.container {
        height:100%;
        margin: 0;
        padding: 0;
    }

    * {
        box-sizing: border-box;
    }

    .container {
        display:table;
        max-width: 100%;
        width: 100%;
        box-sizing: border-box;
        padding-right: 0;
        padding-left: 0; 
    }
    
    .row {
        height: 100%;
        display: table-row;
        margin:0;
    }

    .row .no-float {
        display: table-cell;
        float: none;
    }

    .cover {
        width: 50%;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }

    .footer {
        position:absolute; 
        left:0; 
        bottom: 30px;
        width:100%; 
        height: 30px; 
        background: #33a8d7; 
        z-index: 1;
    }

    .gms {
        width:60px;
        height:60px;
        z-index:1;
        display:inline-block;
        position:absolute;
        bottom: 50px;
        right:40px;
        background-image: url('/assets/images/gms.png');
    }

    @media (max-width: 768px) {
        .container {
            display: block;
        }

        .sbl {
            /*margin-top: 30px;*/
        }

        .row {
            display: block;
        }

        .row .no-float {
            width: 100%;
            height: 50vh;
            display: block;
            line-height: 60vh;
        }

        .row .no-float div {
            line-height: normal;
        }

        .footer {
            bottom: initial;
            top: 0;
        }

        .gms {
            bottom: initial;
            top: calc(100vh - 90px);
            width: 40px;
            height: 40px;
            background-size: 40px;
        }
    }
</style>
{% endblock %}

{% block base_content %}

<!--<div class="footer"></div>-->

<a href="http://www.gmorningsports.com/" target="_blank" class="gms"></a>

<div class="container">
    <div class="row">
        <div class="sbl col-md-6 no-float cover text-center" 
            style="background-image: url('/assets/images/sportbizlatam-bg.jpg'); vertical-align:middle;">
            
            <div style="
            display:inline-block;
            ">
            <div style="
            width:316px;
            height:53px;
            margin-bottom:40px;
            display:inline-block;
            background-image: url('/assets/images/sportbiz-latam.png')"></div>
            <p>
                <a href="http://sportbizlatam.la/" class="sbl-button blue">Enter</a>
            </p>
            </div>  

        </div>
        <div class="col-md-6 no-float cover text-center" 
            style="background-image: url('/assets/images/sportbizeurope-bg.jpg');
            vertical-align:middle;">
            
            <div style="
            display:inline-block;
            ">
            <div style="
            width:240px;
            height:73px;
            margin-bottom:30px;
            display:inline-block;
            background-image: url('/assets/images/sportbiz-europe-white.png')"></div>
            <p>
                <a href="http://sport-biz.com/es/evento/SPORTBIZEUROPE" class="sbl-button blue">Enter</a>
            </p>
            </div>
                
        </div>
    </div>
</div>
{% endblock base_content %}