﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport">
    <meta content="ie=edge" http-equiv="x-ua-compatible">
    <title>Marvelcrowd</title>
    <!-- Font Awesome -->
    <link href="https://use.fontawesome.com/releases/v5.11.2/css/all.css" rel="stylesheet">
    <!-- Bootstrap core CSS -->
    <link href="/assets/default/css/bootstrap.css" rel="stylesheet">
    <!-- Material Design Bootstrap -->
    <link href="/assets/default/css/mdb.css" rel="stylesheet">
    <!-- Your custom styles (optional) -->
    <link href="/assets/default/css/style.css" rel="stylesheet">
    <!-- Croppie -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/croppie/2.6.5/croppie.css"
          integrity="sha512-2eMmukTZtvwlfQoG8ztapwAH5fXaQBzaMqdljLopRSA0i6YKM8kBAOrSSykxu9NN9HrtD45lIqfONLII2AFL/Q=="
          crossorigin="anonymous" referrerpolicy="no-referrer"/>


    <!-- SCRIPTS -->
    <!-- JQuery -->
    <script src="/assets/default/js/jquery.js"></script>
    <!-- Bootstrap tooltips -->
    <script src="/assets/default/js/popper.min.js" type="text/javascript"></script>
    <!-- Bootstrap core JavaScript -->
    <script src="/assets/default/js/bootstrap.js" type="text/javascript"></script>
    <!-- MDB core JavaScript -->
    <script src="/assets/default/js/mdb.js" type="text/javascript"></script>
    <!-- MDB custom JavaScript -->
    <script src="/assets/default/js/custom.js" type="text/javascript"></script>

    <script src="//cdn.jsdelivr.net/npm/sweetalert2@10"></script>

    <script src="/assets/default/js/crypto-js/crypto-js" type="text/javascript"></script>
    <!-- Font Awesome -->
    <script src="https://kit.fontawesome.com/9292fdcabf.js" crossorigin="anonymous"></script>
    <!-- Croppie -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/croppie/2.6.5/croppie.js"
            integrity="sha512-vUJTqeDCu0MKkOhuI83/MEX5HSNPW+Lw46BA775bAWIp1Zwgz3qggia/t2EnSGB9GoS2Ln6npDmbJTdNhHy1Yw=="
            crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <!-- md5 -->
    <script src="/assets/default/js/md5.js"></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfobject/2.2.8/pdfobject.js"
            integrity="sha512-aqpxRD4NwJUXN742KSiIr4zARkh+WTeaWwx0DYuy+9eARX/glcCFtHSeETrIc6V+1BwYfMwvPz5KWlVtRyXikQ=="
            crossorigin="anonymous" referrerpolicy="no-referrer"></script>



    <script type="text/javascript">
        window.fbAsyncInit = function () {
            FB.init({
                appId: '1392638917681158', // replace your app id here
                channelUrl: 'https://cms1.marvelcrowd.com',
                status: true,
                cookie: true,
                xfbml: true,
                version          : 'v14.0'
            });
        };
    </script>
    <script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_ES/sdk.js"></script>

    <style>
            </style>
</head>

<body class="fixed-sn marvel-skin">
<!--Double navigation-->
<header>

    <!-- Sidebar navigation -->
    
    <!--/. Sidebar navigation -->
    <!-- Right Modal -->
    <!-- Full Height Modal Right -->
    
    <!-- Full Height Modal Right -->
    <!-- Right Modal -->
    <!-- Navbar -->
    <nav class="navbar fixed-top navbar-toggleable-md navbar-expand-lg double-nav">
    <!-- SideNav slide-out button -->
    <div class="float-left">
        <a href="#" data-activates="slide-out" class="button-collapse"><i class="fa fa-bars"></i></a>
    </div>
    <!-- Breadcrumb-->
    <div class="breadcrumb-dn mr-auto" style="margin-left: 40px;">
        <a href="/"><img src="/assets/default/img/logo.png" style="height: 36px;"></a>
    </div>
    <ul class="nav navbar-nav nav-flex-icons ml-auto">
        <li class="nav-item dropdown">
            <a class="nav-link dropdown-toggle" href="#" id="languagedropdown" role="button" data-toggle="dropdown"
               aria-haspopup="true" aria-expanded="false">
                                <i class="flag-icon flag-icon- font-18"></i>
            </a>
            <div class="dropdown-menu dropdown-menu-right  animated bounceInDown" aria-labelledby="navbarDropdown2">
                <span class="dropdown-item" onclick="changeLanguage('es')" style="cursor: pointer;"><i
                            class="flag-icon flag-icon-gb"></i> ES</span>
                <span class="dropdown-item" onclick="changeLanguage('en')" style="cursor: pointer;"><i
                            class="flag-icon flag-icon-es"></i> EN</span>
            </div>
        </li>
    </ul>
</nav>    <!-- /.Navbar -->
</header>
<!--/.Double navigation-->
<main id="cms-main-content">


<script async defer crossorigin="anonymous"
        src="https://connect.facebook.net/es_ES/sdk.js#xfbml=1&version=v12.0&appId=1392638917681158&autoLogAppEvents=1"
        nonce="yJc1oW8C"></script>
<script>
    window.addEventListener('beforeunload', function (event) {
        console.log('I am the 2nd one.');
        alert("unload");
    });
</script>
<section class="view intro-2 ">

    <div class="mask rgba-stylish-strong h-100 d-flex justify-content-center align-items-center hero">
        <canvas data-strokecolor="255, 255, 255" id="canvas"
                style="height:100%; position: absolute; width: 100%;"></canvas>
        <div class="container">
            <div class="row">
                <div class="col-xl-5 col-lg-6 col-md-10 col-sm-12 mx-auto mt-lg-5">

                    <!--Form Access-->
                    <div id="login" class="card wow fadeIn" data-wow-delay="0.3s">
                        <div class="card-body">

                            <!--Header-->
                            <div class="form-header marvel-gradient">
                                <h3></h3>
                            </div>

                            <!--Body-->
                            <div class="md-form">
                                <i class="fas fa-envelope prefix "></i>
                                <input id="l-email" name="l-email" type="text" class="form-control" required>
                                <label for="l-email">Email</label>
                            </div>

                            <div class="md-form">
                                <i class="fas fa-lock prefix "></i>
                                <input type="password" id="l-pass" class="form-control" required>
                                <label for="l-pass">Password</label>
                            </div>

                            <div class="text-center">
                                <button class="btn btn-default waves-effect waves-light" style="width: 150px;"
                                        onclick="dologin();"></button>
                                <button class="btn btn-default waves-effect waves-light" style="width: 150px;"
                                        onclick="openRegister();"></button>

                                <button class="btn btn-secondary btn-sm waves-effect waves-dark mt-1"
                                        style="width: 305px;"
                                        onclick="openRecover();"></button>

                                <hr>
                                <div style="color: #4f4f4f"> </div>
                                <div class="inline-ul text-center d-flex justify-content-center">
                                    <button type="button" class="btn btn-fb btn-sm mr-1" onclick="checkFbLogin()">
                                        <i class="fab fa-facebook-f pr-1"></i>
                                        <span>Facebook</span>
                                    </button>
                                    <button type="button" class="btn btn-ins btn-sm" onclick="checkFbLogin()"
                                            style="background-color: #ec4a89!important">
                                        <i class="fab fa-instagram pr-1"></i>
                                        <span>Instagram</span>
                                    </button>
                                    <!--<button type="button" class="btn btn-tw btn-sm">
                                        <i class="fab fa-twitter pr-1"></i>
                                        <span>Twitter</span>
                                    </button>-->
                                </div>
                                <hr>
                                <div style="font-size: small">
                                    <a href=""
                                       target="_blank"></a> y <a
                                            href=""
                                            target="_blank"></a>
                                </div>
                            </div>

                        </div>
                    </div>
                    <!--/Form Access-->

                    <!--Form Register-->
                    <div id="register" class="card wow fadeIn" data-wow-delay="0.3s">
                        <div class="card-body">

                            <!--Header-->
                            <div class="form-header marvel-gradient-orange">
                                <h3></h3>
                            </div>

                            <!--Body-->
                            <form id="registerForm" method="post" action="submitRegisterForm();">
                                <div class="md-form">
                                    <i class="fas fa-user prefix"></i>
                                    <input type="text" id="orangeForm-name" class="form-control required" name="name"
                                           required>
                                    <label for="orangeForm-name"></label>
                                </div>
                                <div class="md-form">
                                    <i class="fas fa-user prefix" style="color: transparent;"></i>
                                    <input type="text" id="orangeForm-lstname" class="form-control required"
                                           name="lastname" required>
                                    <label for="orangeForm-lstname"></label>
                                </div>

                                <div class="md-form">
                                    <i class="fas fa-calendar prefix"></i>
                                    <input type="date" id="orangeForm-birth_date" class="form-control required"
                                           name="birth_date" required>
                                    <label for="orangeForm-birth_date"></label>
                                </div>

                                <div class="md-form">
                                    <i class="fas fa-globe prefix "></i>
                                    <select name="country" id="orangeForm-country" class="form-control required"
                                            style="width: 90%;margin-left: 40px;border: 0;border-bottom: 1px solid #ced4da;"
                                            required>
                                        <option value='ES' selected>España</option>
<option value='AF'>Afghanistan</option>
<option value='AX'>Aland Islands</option>
<option value='AL'>Albania</option>
<option value='DZ'>Algeria</option>
<option value='AS'>American Samoa</option>
<option value='AD'>Andorra</option>
<option value='AO'>Angola</option>
<option value='AI'>Anguilla</option>
<option value='AQ'>Antarctica</option>
<option value='AG'>Antigua and Barbuda</option>
<option value='AR'>Argentina</option>
<option value='AM'>Armenia</option>
<option value='AW'>Aruba</option>
<option value='AU'>Australia</option>
<option value='AT'>Austria</option>
<option value='AZ'>Azerbaijan</option>
<option value='BS'>Bahamas</option>
<option value='BH'>Bahrain</option>
<option value='BD'>Bangladesh</option>
<option value='BB'>Barbados</option>
<option value='BY'>Belarus</option>
<option value='BE'>Belgium</option>
<option value='BZ'>Belize</option>
<option value='BJ'>Benin</option>
<option value='BM'>Bermuda</option>
<option value='BT'>Bhutan</option>
<option value='BO'>Bolivia</option>
<option value='BQ'>Bonaire, Saint Eustatius and Saba </option>
<option value='BA'>Bosnia and Herzegovina</option>
<option value='BW'>Botswana</option>
<option value='BV'>Bouvet Island</option>
<option value='BR'>Brazil</option>
<option value='IO'>British Indian Ocean Territory</option>
<option value='VG'>British Virgin Islands</option>
<option value='BN'>Brunei</option>
<option value='BG'>Bulgaria</option>
<option value='BF'>Burkina Faso</option>
<option value='BI'>Burundi</option>
<option value='KH'>Cambodia</option>
<option value='CM'>Cameroon</option>
<option value='CA'>Canada</option>
<option value='CV'>Cape Verde</option>
<option value='KY'>Cayman Islands</option>
<option value='CF'>Central African Republic</option>
<option value='TD'>Chad</option>
<option value='CL'>Chile</option>
<option value='CN'>China</option>
<option value='CX'>Christmas Island</option>
<option value='CC'>Cocos Islands</option>
<option value='CO'>Colombia</option>
<option value='KM'>Comoros</option>
<option value='CK'>Cook Islands</option>
<option value='CR'>Costa Rica</option>
<option value='HR'>Croatia</option>
<option value='CU'>Cuba</option>
<option value='CW'>Curacao</option>
<option value='CY'>Cyprus</option>
<option value='CZ'>Czech Republic</option>
<option value='CD'>Democratic Republic of the Congo</option>
<option value='DK'>Denmark</option>
<option value='DJ'>Djibouti</option>
<option value='DM'>Dominica</option>
<option value='DO'>Dominican Republic</option>
<option value='TL'>East Timor</option>
<option value='EC'>Ecuador</option>
<option value='EG'>Egypt</option>
<option value='SV'>El Salvador</option>
<option value='GQ'>Equatorial Guinea</option>
<option value='ER'>Eritrea</option>
<option value='EE'>Estonia</option>
<option value='ET'>Ethiopia</option>
<option value='FK'>Falkland Islands</option>
<option value='FO'>Faroe Islands</option>
<option value='FJ'>Fiji</option>
<option value='FI'>Finland</option>
<option value='FR'>France</option>
<option value='GF'>French Guiana</option>
<option value='PF'>French Polynesia</option>
<option value='TF'>French Southern Territories</option>
<option value='GA'>Gabon</option>
<option value='GM'>Gambia</option>
<option value='GE'>Georgia</option>
<option value='DE'>Germany</option>
<option value='GH'>Ghana</option>
<option value='GI'>Gibraltar</option>
<option value='GR'>Greece</option>
<option value='GL'>Greenland</option>
<option value='GD'>Grenada</option>
<option value='GP'>Guadeloupe</option>
<option value='GU'>Guam</option>
<option value='GT'>Guatemala</option>
<option value='GG'>Guernsey</option>
<option value='GN'>Guinea</option>
<option value='GW'>Guinea-Bissau</option>
<option value='GY'>Guyana</option>
<option value='HT'>Haiti</option>
<option value='HM'>Heard Island and McDonald Islands</option>
<option value='HN'>Honduras</option>
<option value='HK'>Hong Kong</option>
<option value='HU'>Hungary</option>
<option value='IS'>Iceland</option>
<option value='IN'>India</option>
<option value='ID'>Indonesia</option>
<option value='IR'>Iran</option>
<option value='IQ'>Iraq</option>
<option value='IE'>Ireland</option>
<option value='IM'>Isle of Man</option>
<option value='IL'>Israel</option>
<option value='IT'>Italy</option>
<option value='CI'>Ivory Coast</option>
<option value='JM'>Jamaica</option>
<option value='JP'>Japan</option>
<option value='JE'>Jersey</option>
<option value='JO'>Jordan</option>
<option value='KZ'>Kazakhstan</option>
<option value='KE'>Kenya</option>
<option value='KI'>Kiribati</option>
<option value='XK'>Kosovo</option>
<option value='KW'>Kuwait</option>
<option value='KG'>Kyrgyzstan</option>
<option value='LA'>Laos</option>
<option value='LV'>Latvia</option>
<option value='LB'>Lebanon</option>
<option value='LS'>Lesotho</option>
<option value='LR'>Liberia</option>
<option value='LY'>Libya</option>
<option value='LI'>Liechtenstein</option>
<option value='LT'>Lithuania</option>
<option value='LU'>Luxembourg</option>
<option value='MO'>Macao</option>
<option value='MK'>Macedonia</option>
<option value='MG'>Madagascar</option>
<option value='MW'>Malawi</option>
<option value='MY'>Malaysia</option>
<option value='MV'>Maldives</option>
<option value='ML'>Mali</option>
<option value='MT'>Malta</option>
<option value='MH'>Marshall Islands</option>
<option value='MQ'>Martinique</option>
<option value='MR'>Mauritania</option>
<option value='MU'>Mauritius</option>
<option value='YT'>Mayotte</option>
<option value='MX'>Mexico</option>
<option value='FM'>Micronesia</option>
<option value='MD'>Moldova</option>
<option value='MC'>Monaco</option>
<option value='MN'>Mongolia</option>
<option value='ME'>Montenegro</option>
<option value='MS'>Montserrat</option>
<option value='MA'>Morocco</option>
<option value='MZ'>Mozambique</option>
<option value='MM'>Myanmar</option>
<option value='NA'>Namibia</option>
<option value='NR'>Nauru</option>
<option value='NP'>Nepal</option>
<option value='NL'>Netherlands</option>
<option value='AN'>Netherlands Antilles</option>
<option value='NC'>New Caledonia</option>
<option value='NZ'>New Zealand</option>
<option value='NI'>Nicaragua</option>
<option value='NE'>Niger</option>
<option value='NG'>Nigeria</option>
<option value='NU'>Niue</option>
<option value='ND'>No data</option>
<option value='NF'>Norfolk Island</option>
<option value='KP'>North Korea</option>
<option value='MP'>Northern Mariana Islands</option>
<option value='NO'>Norway</option>
<option value='OM'>Oman</option>
<option value='PK'>Pakistan</option>
<option value='PW'>Palau</option>
<option value='PS'>Palestinian Territory</option>
<option value='PA'>Panama</option>
<option value='PG'>Papua New Guinea</option>
<option value='PY'>Paraguay</option>
<option value='PE'>Peru</option>
<option value='PH'>Philippines</option>
<option value='PN'>Pitcairn</option>
<option value='PL'>Poland</option>
<option value='PT'>Portugal</option>
<option value='PR'>Puerto Rico</option>
<option value='QA'>Qatar</option>
<option value='CG'>Republic of the Congo</option>
<option value='RE'>Reunion</option>
<option value='RO'>Romania</option>
<option value='RU'>Russia</option>
<option value='RW'>Rwanda</option>
<option value='BL'>Saint Barthelemy</option>
<option value='SH'>Saint Helena</option>
<option value='KN'>Saint Kitts and Nevis</option>
<option value='LC'>Saint Lucia</option>
<option value='MF'>Saint Martin</option>
<option value='PM'>Saint Pierre and Miquelon</option>
<option value='VC'>Saint Vincent and the Grenadines</option>
<option value='WS'>Samoa</option>
<option value='SM'>San Marino</option>
<option value='ST'>Sao Tome and Principe</option>
<option value='SA'>Saudi Arabia</option>
<option value='SN'>Senegal</option>
<option value='RS'>Serbia</option>
<option value='CS'>Serbia and Montenegro</option>
<option value='SC'>Seychelles</option>
<option value='SL'>Sierra Leone</option>
<option value='SG'>Singapore</option>
<option value='SX'>Sint Maarten</option>
<option value='SK'>Slovakia</option>
<option value='SI'>Slovenia</option>
<option value='SB'>Solomon Islands</option>
<option value='SO'>Somalia</option>
<option value='ZA'>South Africa</option>
<option value='GS'>South Georgia and the South Sandwich Islands</option>
<option value='KR'>South Korea</option>
<option value='SS'>South Sudan</option>
<option value='LK'>Sri Lanka</option>
<option value='SD'>Sudan</option>
<option value='SR'>Suriname</option>
<option value='SJ'>Svalbard and Jan Mayen</option>
<option value='SZ'>Swaziland</option>
<option value='SE'>Sweden</option>
<option value='CH'>Switzerland</option>
<option value='SY'>Syria</option>
<option value='TW'>Taiwan</option>
<option value='TJ'>Tajikistan</option>
<option value='TZ'>Tanzania</option>
<option value='TH'>Thailand</option>
<option value='TG'>Togo</option>
<option value='TK'>Tokelau</option>
<option value='TO'>Tonga</option>
<option value='TT'>Trinidad and Tobago</option>
<option value='TN'>Tunisia</option>
<option value='TR'>Turkey</option>
<option value='TM'>Turkmenistan</option>
<option value='TC'>Turks and Caicos Islands</option>
<option value='TV'>Tuvalu</option>
<option value='VI'>U.S. Virgin Islands</option>
<option value='UG'>Uganda</option>
<option value='UA'>Ukraine</option>
<option value='AE'>United Arab Emirates</option>
<option value='GB'>United Kingdom</option>
<option value='US'>United States</option>
<option value='UM'>United States Minor Outlying Islands</option>
<option value='UY'>Uruguay</option>
<option value='UZ'>Uzbekistan</option>
<option value='VU'>Vanuatu</option>
<option value='VA'>Vatican</option>
<option value='VE'>Venezuela</option>
<option value='VN'>Vietnam</option>
<option value='WF'>Wallis and Futuna</option>
<option value='EH'>Western Sahara</option>
<option value='YE'>Yemen</option>
<option value='ZM'>Zambia</option>
<option value='ZW'>Zimbabwe</option>

                                    </select>
                                </div>

                                <div class="md-form">
                                    <i class="fas fa-envelope prefix "></i>
                                    <input type="text" id="email" class="form-control required" name="email"
                                           required>
                                    <label for="email"></label>
                                </div>

                                <div class="md-form">
                                    <i class="fas fa-lock prefix "></i>
                                    <input type="password" id="orangeForm-pass" class="form-control required"
                                           name="password" required>
                                    <label for="orangeForm-pass"></label>
                                </div>

                                <div class="custom-control custom-checkbox">
                                    <input type="checkbox" class="custom-control-input required" id="defaultUnchecked"
                                           name="terms" required>
                                    <label class="custom-control-label " for="defaultUnchecked"
                                           style="font-size: small;"> <a
                                                href="" target="_blank">
                                            </a>,<a href=""
                                                                              target="_blank">
                                            </a> </label>
                                </div>
                                <div class="text-center">
                                    <input type="button" class="btn btn-primary waves-effect waves-light"
                                           style="width: 150px;" onclick="submitRegisterForm()"
                                           value="">
                                </div>
                            </form>


                        </div>
                    </div>
                    <!--/Form Register-->

                    <!--Form Password-->
                    <div id="forgot" class="card wow fadeIn" data-wow-delay="0.3s">
                        <div class="card-body">

                            <!--Header-->
                            <div class="form-header marvel-gradient">
                                <h3></h3>
                            </div>

                            <!--Body-->
                            <form id="resetForm" method="post">
                                <div class="md-form">
                                    <i class="fas fa-envelope prefix "></i>
                                    <input type="text" id="orangeForm-email" class="form-control" name="email">
                                    <label for="orangeForm-email"></label>
                                </div>
                                <div style="text-align: center;padding:10px 0px;opacity: 0.6; margin:0 auto; display:inline-block;margin-left: 50px;">
                                    <div class="g-recaptcha"
                                         data-sitekey="6Lf7pgwTAAAAAHWvcbQLwd9BGPDDiEmGU4ypE2Q9"></div>
                                </div>
                                <script type="text/javascript"
                                        src="https://www.google.com/recaptcha/api.js?hl="></script>
                            </form>
                            <div class="text-center">
                                <button class="btn btn-secondary btn-sm waves-effect waves-dark" style="width: 320px;"
                                        onclick="resetPassword()"></button>
                            </div>
                        </div>
                    </div>
                    <!--/Form Password-->
                </div>
            </div>
        </div>
    </div>

</section>

<script src='https://cdnjs.cloudflare.com/ajax/libs/gsap/1.16.1/TweenMax.min.js'></script>




<style>
.md-form label {
    color: #353535;
}

.md-form .form-control {
    color: #353535;
}

.fixed-sn main {
    padding: 0;
    margin: 0;

}

.view {
    height: 100vh;
}

@media (max-width: 740px) {
    .view {
        height: 815px;
    }
}

@media (min-width: 800px) and (max-width: 850px) {
    .view {
        height: 650px;
    }
}

.intro-2 {
    background: url("/assets/default/img/loginBackground.jpg") no-repeat center center;
    background-size: cover;
}

.top-nav-collapse {
    background-color: #3f51b5 !important;
}

.navbar:not(.top-nav-collapse) {
    background: transparent !important;
}

@media (max-width: 768px) {
    .navbar:not(.top-nav-collapse) {
        background: transparent !important;
    }
}

@media (min-width: 800px) and (max-width: 850px) {
    .navbar:not(.top-nav-collapse) {
        background: transparent !important;
    }
}

.card {
    background-color: rgba(255, 255, 255, 0.9);
}

.rgba-stylish-strong {
    background-color: rgba(27, 91, 101, 0.3);
}

h6 {
    line-height: 1.7;
}


.card {
    margin-top: 30px;
    /*margin-bottom: -45px;*/

}

.marvel-skin .md-form input:not([type]):focus:not([readonly]), .md-form input[type="text"]:not(.browser-default):focus:not([readonly]), .md-form input[type="password"]:not(.browser-default):focus:not([readonly]), .md-form input[type="email"]:not(.browser-default):focus:not([readonly]), .md-form input[type="url"]:not(.browser-default):focus:not([readonly]), .md-form input[type="time"]:not(.browser-default):focus:not([readonly]), .md-form input[type="date"]:not(.browser-default):focus:not([readonly]), .md-form input[type="datetime"]:not(.browser-default):focus:not([readonly]), .md-form input[type="datetime-local"]:not(.browser-default):focus:not([readonly]), .md-form input[type="tel"]:not(.browser-default):focus:not([readonly]), .md-form input[type="number"]:not(.browser-default):focus:not([readonly]), .md-form input[type="search"]:not(.browser-default):focus:not([readonly]), .md-form input[type="search-md"]:focus:not([readonly]), .md-form textarea.md-textarea:focus:not([readonly]) {
    border-bottom: 1px solid #1b5861;
    box-shadow: 0 1px 0 0 #1b5861;
    text-shadow: 0px 0px 10px rgb(255 255 255);
}

.marvel-skin .md-form input:not([type]):focus:not([readonly]) + label, .md-form input[type="text"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="password"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="email"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="url"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="time"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="date"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="datetime"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="datetime-local"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="tel"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="number"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="search"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="search-md"]:focus:not([readonly]) + label, .md-form textarea.md-textarea:focus:not([readonly]) + label {
    color: #1b5861;
    text-shadow: 0px 0px 10px rgb(255 255 255);
}

.marvel-skin .md-form input[type=text]:focus:not([readonly]),
.marvel-skin .md-form input[type=password]:focus:not([readonly]) {
    border-bottom: 1px solid #1b5861;
    box-shadow: 0 1px 0 0 #1b5861;
}

.marvel-skin .md-form input[type=text]:focus:not([readonly]) + label,
.marvel-skin .md-form input[type=password]:focus:not([readonly]) + label {
    color: #1b5861;
}

.marvel-skin .md-form .prefix.active {
    color: rgba(27, 88, 97, 0.55);
}

.marvel-skin #register .md-form input:not([type]):focus:not([readonly]), .md-form input[type="text"]:not(.browser-default):focus:not([readonly]), .md-form input[type="password"]:not(.browser-default):focus:not([readonly]), .md-form input[type="email"]:not(.browser-default):focus:not([readonly]), .md-form input[type="url"]:not(.browser-default):focus:not([readonly]), .md-form input[type="time"]:not(.browser-default):focus:not([readonly]), .md-form input[type="date"]:not(.browser-default):focus:not([readonly]), .md-form input[type="datetime"]:not(.browser-default):focus:not([readonly]), .md-form input[type="datetime-local"]:not(.browser-default):focus:not([readonly]), .md-form input[type="tel"]:not(.browser-default):focus:not([readonly]), .md-form input[type="number"]:not(.browser-default):focus:not([readonly]), .md-form input[type="search"]:not(.browser-default):focus:not([readonly]), .md-form input[type="search-md"]:focus:not([readonly]), .md-form textarea.md-textarea:focus:not([readonly]) {
    border-bottom: 1px solid #e04b28;
    box-shadow: 0 1px 0 0 #e04b28;
    text-shadow: 0px 0px 10px rgb(255 255 255);
}

.marvel-skin #register .md-form input:not([type]):focus:not([readonly]) + label, .md-form input[type="text"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="password"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="email"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="url"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="time"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="date"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="datetime"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="datetime-local"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="tel"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="number"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="search"]:not(.browser-default):focus:not([readonly]) + label, .md-form input[type="search-md"]:focus:not([readonly]) + label, .md-form textarea.md-textarea:focus:not([readonly]) + label {
    color: #e04b28;
    text-shadow: 0px 0px 10px rgb(255 255 255);
}

.marvel-skin #register .md-form input[type=text]:focus:not([readonly]),
.marvel-skin #register .md-form input[type=password]:focus:not([readonly]) {
    border-bottom: 1px solid #e04b28;
    box-shadow: 0 1px 0 0 #e04b28;
}

.marvel-skin #register .md-form input[type=text]:focus:not([readonly]) + label,
.marvel-skin #register .md-form input[type=password]:focus:not([readonly]) + label {
    color: #e04b28;
}

.marvel-skin #register .md-form .prefix.active {
    color: rgba(224, 75, 40, 0.55);
}

#forgot {
    display: none;
}

.marvel-skin #register {
    display: none;
}

.marvel-skin #register {
    display: none;
}

.marvel-skin .md-form > input[type]:-webkit-autofill:not(.browser-default):not([type="search"]) + label,
.marvel-skin .md-form > input[type="time"]:not(.browser-default) + label {
    margin-bottom: 0px;
    transform: translateY(-10px);
}
</style><script>let lang={
  "credenciales_check": "No se ha encontrado ningún usuario con estos datos registrado. Comprueba tus credenciales. En caso de iniciar sesión con una red social verifica que previamente te registraste y vinculaste tu cuenta de la red social con tu perfil",
  "btn_registerfb": "Registrate",
  "btn_entra": "Entra",
  "register_error": "Error al registrarse. Si el problema persiste ponte en contacto con tech@marvelcrowd.com",
  "register_error_email": "Este email nos consta como registrado. Si no te acuerdas de tus credenciales intenta <a href='javascript:void(0);' onclick='openRecoverOnly();'>recuperar tus credenciales </a>",
  "reset_password_error": "Error al reiniciar la contraseña. Si el problema persiste ponte en contacto con tech@marvelcrowd.com",
  "credenciales_rewelcome": "Bienvenido de nuevo."
};/*$(document).ready(() => {
    new WOW().init();
});*/
/*************************/
/**  FACEBOOK LOGIN    **/
/************************/

/*(function (d) {
    var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
    if (d.getElementById(id)) {
        return;
    }
    js = d.createElement('script');
    js.id = id;
    js.async = true;
    js.src = "//connect.facebook.net/en_US/all.js";
    ref.parentNode.insertBefore(js, ref);
}(document));*/

window.fbAsyncInit = function () {
    FB.init({
        appId: "1392638917681158", // replace your app id here
        channelUrl: "https://cms1.marvelcrowd.com",
        status: true,
        cookie: true,
        xfbml: true,
        version: '{api-version}'
    });
};

function checkFbLogin() {

    FB.getLoginStatus(function (response) {
        if (response.status === 'connected') {
            Swal.showLoading();
            var uid = FB.getUserID();
            var theURL = "https://cms1.marvelcrowd.com/Login/login/do/loginFb/uid/";
            window.location.href = theURL.concat(uid);

        } else {
            FB.login(function (response) {

                if (response.status === 'connected') {
                    // Logged into your webpage and Facebook.
                    if (response.authResponse) {

                        var uid = FB.getUserID();
                        var theURL = "https://cms1.marvelcrowd.com/Login/login/do/loginFb/uid/";
                        window.location.href = theURL.concat(uid);
                    }
                } else {
                    // The person is not logged into your webpage or we are unable to tell.
                    Swal.fire({
                        icon: 'warning',
                        text: lang['credenciales_check']
                    });
                }

            }, {scope: "email,public_profile, pages_show_list,pages_read_engagement,read_insights,pages_read_user_content, instagram_basic,instagram_manage_insights"});
        }

    });
}

/****************************/
/**  END FACEBOOK LOGIN    **/

/***************************/


function openRegister() {
    $('#login').hide();
    $('#register').show();

}

function openRecover() {
    $('#login').hide();
    $('#forgot').show();
}

function openRecoverOnly() {
    $('#login').hide();
    $('#register').hide();
    $('#forgot').show();
    Swal.close();
}


function dologin() {
    let uid = $("#l-email").val();
    let pid = $("#l-pass").val();

    pid = CryptoJS.MD5(pid).toString();

    var configData = {

        url: "/Login/login/do/ckeck",
        data: {uid: uid, pid: pid},
        before: function () {
            Swal.showLoading();
        },
        error: function (xhr, status, text) {
            Swal.fire({
                icon: 'error',
                text: lang['credenciales_check']
            });
        },
        success: function (result) {
            window.location.href = '/User/home';
        }
    };
    _ajaxCallQueue(configData);
}

/******************************************/
(function ($) {

    var width, height, strokecolor, canvas, ctx, points, target;

    initHeader();
    initAnimation();
    addListeners();

    function initHeader() {

        width = window.innerWidth;
        height = window.innerHeight;
        target = {x: width / 2, y: height / 2};

        canvas = document.getElementById('canvas');
        strokecolor = canvas.getAttribute("data-strokecolor");
        canvas.width = width;
        canvas.height = height;
        ctx = canvas.getContext('2d');

        // create points
        points = [];
        for (var x = 0; x < width; x = x + width / 20) {
            for (var y = 0; y < height; y = y + height / 20) {
                var px = x + Math.random() * width / 20;
                var py = y + Math.random() * height / 20;
                var p = {x: px, originX: px, y: py, originY: py};
                points.push(p);
            }
        }

        // for each point find the 5 closest points
        for (var i = 0; i < points.length; i++) {
            var closest = [];
            var p1 = points[i];
            for (var j = 0; j < points.length; j++) {
                var p2 = points[j]
                if (!(p1 == p2)) {
                    var placed = false;
                    for (var k = 0; k < 5; k++) {
                        if (!placed) {
                            if (closest[k] == undefined) {
                                closest[k] = p2;
                                placed = true;
                            }
                        }
                    }

                    for (var k = 0; k < 5; k++) {
                        if (!placed) {
                            if (getDistance(p1, p2) < getDistance(p1, closest[k])) {
                                closest[k] = p2;
                                placed = true;
                            }
                        }
                    }
                }
            }
            p1.closest = closest;
        }

        // assign a circle to each point
        for (var i in points) {
            var c = new Circle(points[i], 2 + Math.random() * 2, 'rgba(255,255,255,0.3)');
            points[i].circle = c;
        }
    }

    // Event handling
    function addListeners() {
        window.addEventListener('mousemove', mouseMove);
        window.addEventListener('resize', resize);
    }

    function mouseMove(e) {
        var posx = posy = 0;
        if (e.pageX || e.pageY) {
            posx = e.pageX;
            posy = e.pageY;
        } else if (e.clientX || e.clientY) {
            posx = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
            posy = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
        }
        target.x = posx;
        target.y = posy;
    }

    function resize() {
        width = window.innerWidth;
        height = window.innerHeight;
        canvas.width = width;
        canvas.height = height;
    }

    // animation
    function initAnimation() {
        animate();
        for (var i in points) {
            shiftPoint(points[i]);
        }
    }

    function animate() {
        ctx.clearRect(0, 0, width, height);
        for (var i in points) {
            // detect points in range
            if (Math.abs(getDistance(target, points[i])) < 4000) {
                points[i].active = 0.4;
                points[i].circle.active = 0.5;
            } else if (Math.abs(getDistance(target, points[i])) < 20000) {
                points[i].active = 0.3;
                points[i].circle.active = 0.4;
            } else if (Math.abs(getDistance(target, points[i])) < 40000) {
                points[i].active = 0.2;
                points[i].circle.active = 0.3;
            } else {
                points[i].active = 0.1;
                points[i].circle.active = 0.2;
            }

            drawLines(points[i]);
            points[i].circle.draw();
        }
        requestAnimationFrame(animate);
    }

    function shiftPoint(p) {
        TweenLite.to(p, 1 + 1 * Math.random(), {
            x: p.originX - 10 + Math.random() * 20,
            y: p.originY - 10 + Math.random() * 20,
            ease: Sine.easeInOut,
            onComplete: function () {
                shiftPoint(p);
            }
        });
    }

    // Canvas manipulation
    function drawLines(p) {
        if (!p.active) return;
        for (var i in p.closest) {
            ctx.beginPath();
            ctx.moveTo(p.x, p.y);
            ctx.lineTo(p.closest[i].x, p.closest[i].y);
            ctx.strokeStyle = 'rgba(' + strokecolor + ',' + p.active + ')';
            ctx.stroke();
        }
    }

    function Circle(pos, rad, color) {
        var _this = this;

        // constructor
        (function () {
            _this.pos = pos || null;
            _this.radius = rad || null;
            _this.color = color || null;
        })();

        this.draw = function () {
            if (!_this.active) return;
            ctx.beginPath();
            ctx.arc(_this.pos.x, _this.pos.y, _this.radius, 0, 2 * Math.PI, false);
            ctx.fillStyle = 'rgba(' + strokecolor + ',' + _this.active + ')';
            ctx.fill();
        };
    }

    // Util
    function getDistance(p1, p2) {
        return Math.pow(p1.x - p2.x, 2) + Math.pow(p1.y - p2.y, 2);
    }

})(jQuery);

function submitRegisterForm() {
    var $form = $("#registerForm");

    if ($form.find('.required').filter(function () {
        return this.value === ''
    }).length > 0) {
        Swal.fire({
            icon: 'warning',
            text: 'Fill up all required fields',
            timer: 2000,
        });
        return false;
    }

    var formData = $("#registerForm").serialize();

    var configData = {
        url: "/Login/login/do/register",
        data: formData,
        before: function () {
            Swal.showLoading();
        },
        error: function (xhr, status, text) {

            Swal.close();
            if (xhr.code == -5) {
                Swal.fire({
                    icon: 'error',
                    html: lang['register_error_email']
                });
            } else {
                Swal.fire({
                    icon: 'error',
                    html: lang['register_error']
                });
            }
        },
        success: function (result) {

            if (result.code > 0)
                window.location.href = '/Social/connect';
            else {
                if (result.code == -5) {
                    Swal.fire({
                        icon: 'error',
                        html: lang['register_error_email']
                    });
                } else {
                    Swal.fire({
                        icon: 'error',
                        text: lang['register_error']
                    });
                }
            }

        }
    };
    _ajaxCallQueue(configData);
}

function resetPassword() {
    var formData = $("#resetForm").serialize();

    var configData = {
        url: "/Login/login/do/resendPass",
        data: formData,
        before: function () {
            Swal.showLoading();
        },
        error: function (xhr, status, text) {
            Swal.fire({
                icon: 'error',
                text: lang['reset_password_error']
            });
        },
        success: function (result) {
            window.location.href = '/Login/login/sml/1';
        }
    };
    _ajaxCallQueue(configData);
}

function changeLanguage(lang) {
    var configData = {
        url: "/Language/" + lang,
        before: function () {
            Swal.showLoading();
        },
        error: function (xhr, status, text) {
            Swal.fire({
                icon: 'error',
                text: xhr.message
            });
        },
        success: function (result) {
            location.reload();
        }
    };
    _ajaxCallQueue(configData);
}</script></main>
<!-- Modal -->
<div class="modal top fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true"
     data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog   modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
                <button type="button" class="btn-close" data-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">...</div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">
                    Close
                </button>
                <button type="button" class="btn btn-primary">Save changes</button>
            </div>
        </div>
    </div>
</div>
<!-- Modal -->
</body>


<!-- Initializations -->
<script>
    var _ajaxArray = [];

function _changeContent(id, content, swalClose) {
    $(id)[0].innerHTML = "";
    $(id)[0].innerHTML = content;
    var arr = $(id)[0].getElementsByTagName('script')
    for (var n = 0; n < arr.length; n++)
        window.eval(arr[n].innerHTML)

    if (swalClose)
        Swal.close();
}

function _appendContent(id, content, swalClose) {

    $(id)[0].innerHTML += content;
    $(id).hide().show(0);
    var arr = $(id)[0].getElementsByTagName('script')
    for (var n = 0; n < arr.length; n++)
        window.eval(arr[n].innerHTML)

    if (swalClose)
        Swal.close();
}

function _prependContent(id, content, swalClose) {

    var contenttmp = content
    contenttmp += $(id)[0].innerHTML;
    $(id)[0].innerHTML = contenttmp;
    $(id).hide().show(0);
    var arr = $(id)[0].getElementsByTagName('script')
    for (var n = 0; n < arr.length; n++)
        window.eval(arr[n].innerHTML)

    if (swalClose)
        Swal.close();
}

function _cancelAjaxQueue() {
    while (_ajaxArray.length > 0) {
        var xhr = _ajaxArray.pop();
        xhr.abort();
    }
}

function _ajaxCallQueue(configData) {
    if (!(configData))
        return;

    if (!(configData.url))
        return;

    if (!(configData.method))
        configData.method = "POST";

    if (typeof configData.before !== "function") {
        configData.before = function () {
        };
    }

    if (typeof configData.error !== "function") {
        configData.error = function () {
        };
    }

    if (typeof configData.success !== "function") {
        configData.success = function () {
        };
    }

    if (typeof configData.ignoreDoctype !== false) {  // acepta el traer una página entera si ignora doctype
        configData.ignoreDoctype = true;
    }


    configData.debbug = true;


    if (typeof configData.async !== "boolean") {
        configData.async = true;
    }

    if (typeof configData.errorTextDefault !== "string") {
        configData.errorTextDefault = "Error";
    }

    if (typeof configData.sessionExpiredText !== "string") {
        configData.sessionExpiredText = "Session expired (doctype)";
    }


    var theXHRajaxcall = $.ajax({
        type: configData.method,
        url: configData.url,
        data: configData.data,
        async: configData.async,
        dataType: 'json',
        beforeSend: function () {
            var result = {code: 0, html: ""};
            _executefunction(configData.before, configData.debbug, configData.errorTextDefault, 'before', configData.errorReload, configData.errorReloadUrl, result, this);
        },
        success: function (result) {

            if (result.code <= 0) {
                _executefunction(configData.error, configData.debbug, configData.errorTextDefault, 'error', configData.errorReload, configData.errorReloadUrl, result, this);
            } else if (configData.ignoreDoctype !== true) {
                if (result.html.startsWith('<!DOCTYPE html>') == true) {
                    Swal.fire({
                        icon: 'warning',
                        text: configData.sessionExpiredText + ' (Code: -105)',
                    });
                } else {
                    _executefunction(configData.success, configData.debbug, configData.errorTextDefault, 'fsc', configData.errorReload, configData.errorReloadUrl, result, this);
                }
            } else {
                _executefunction(configData.success, configData.debbug, configData.errorTextDefault, 'fsc', configData.errorReload, configData.errorReloadUrl, result, this);
            }
        },
        error: function (e) {
            try {
                if (e.responseText.startsWith('<!DOCTYPE html>') == true) {
                    location.reload();
                } else {
                    if (configData.url.includes("https://graph.facebook.com/v19.0/")) {
                        let result;
                        let responseText = JSON.parse(e.responseText);
                        if(responseText.error.hasOwnProperty('error_user_title')){
                            let errorText = decodeURIComponent(responseText.error.error_user_title) + " -> " + decodeURIComponent(responseText.error.error_user_msg);
                            result = {code: errorText};
                        }else{
                            result = {code: responseText.error.message};
                        }
                        _executefunction(configData.error, configData.debbug, configData.errorTextDefault, 'error', configData.errorReload, configData.errorReloadUrl, result, this);
                    } else {
                        var result = {code: "-989898"};
                        _executefunction(configData.error, configData.debbug, configData.errorTextDefault, 'error', configData.errorReload, configData.errorReloadUrl, result, this);
                    }
                }
            } catch (ex) {

            }

        }
    });

    _ajaxArray.push(theXHRajaxcall);
}

function _executefunction(call, debug, errorTextDefault, functionName, reload, reloadURL, result, object) {
    try {
        call(result, result.code, object.error);
    } catch (error) {
        var errortextshow = errorTextDefault + ' (code ' + functionName + ')';
        Swal.fire({
            icon: 'error',
            text: errortextshow,
        });
    }
}

function _ajaxCallFileQueue(configData) {
    if (!(configData))
        return;

    if (!(configData.url))
        return;

    if (typeof configData.before !== "function") {
        configData.before = function () {
        };
    }

    if (typeof configData.error !== "function") {
        configData.error = function () {
        };
    }

    if (typeof configData.success !== "function") {
        configData.success = function () {
        };
    }

    if (typeof configData.ignoreDoctype !== false) {  // acepta el traer una página entera si ignora doctype
        configData.ignoreDoctype = true;
    }


    configData.debbug = true;


    if (typeof configData.async !== "boolean") {
        configData.async = true;
    }

    if (typeof configData.errorTextDefault !== "string") {
        configData.errorTextDefault = "Error";
    }

    if (typeof configData.sessionExpiredText !== "string") {
        configData.sessionExpiredText = "Session expired (doctype)";
    }



    var theXHRajaxcall = $.ajax({
        type: "POST",
        url: configData.url,
        data: configData.data,
        async: configData.async,
        processData: false,
        contentType: false,
        dataType: 'json',
        beforeSend: function () {
            var result = {code: 0, html: ""};
            _executefunction(configData.before, configData.debbug, configData.errorTextDefault, 'before', configData.errorReload, configData.errorReloadUrl, result, this);
        },
        success: function (result) {
            if (result.code <= 0) {
                _executefunction(configData.error, configData.debbug, configData.errorTextDefault, 'error', configData.errorReload, configData.errorReloadUrl, result, this);
            } else if (configData.ignoreDoctype !== true) {
                if (result.html.startsWith('<!DOCTYPE html>') == true) {
                    Swal.fire({
                        icon: 'warning',
                        text: configData.sessionExpiredText + ' (Code: -105)',
                    });
                } else {
                    _executefunction(configData.success, configData.debbug, configData.errorTextDefault, 'fsc', configData.errorReload, configData.errorReloadUrl, result, this);
                }
            } else {
                _executefunction(configData.success, configData.debbug, configData.errorTextDefault, 'fsc', configData.errorReload, configData.errorReloadUrl, result, this);
            }
        },
        error: function (e) {
            try {

                if (e.responseText.startsWith('<!DOCTYPE html>') == true) {
                    Swal.fire({
                        icon: 'error',
                        text: configData.errorTextDefault + ' (Code: -109)',
                    });
                } else {
                    var result = {code: "-989898"};
                    _executefunction(configData.error, configData.debbug, configData.errorTextDefault, 'error', configData.errorReload, configData.errorReloadUrl, result, this);
                }
            } catch (ex) {

            }

        }
    });

    _ajaxArray.push(theXHRajaxcall);
}

    document.addEventListener('DOMContentLoaded', function() {
    // Código a ejecutar cuando el DOM está listo

    // Obtener el contenido del body
    var bodyContent = document.body.innerHTML;

    // Eliminar el carácter invisible al principio
    var cleanedBodyContent = bodyContent.trim();

    // Asignar el contenido limpio al body
    document.body.innerHTML = cleanedBodyContent;
});
</script>
</html>
