<link rel="stylesheet" href="{% static "assets/web/assets/mobirise-icons-bold/mobirise-icons-bold.css"%}">
  <link rel="stylesheet" href="{% static "assets/web/assets/mobirise-icons/mobirise-icons.css"%}">
  <link rel="stylesheet" href="{% static "assets/tether/tether.min.css"%}">
  <link rel="stylesheet" href="{% static "assets/bootstrap/css/bootstrap.min.css"%}">
  <link rel="stylesheet" href="{% static "assets/bootstrap/css/bootstrap-grid.min.css"%}">
  <link rel="stylesheet" href="{% static "assets/bootstrap/css/bootstrap-reboot.min.css"%}">
  <link rel="stylesheet" href="{% static "assets/dropdown/css/style.css"%}">
  <link rel="stylesheet" href="{% static "assets/theme/css/style.css"%}">
  <link rel="stylesheet" href="{% static "assets/mobirise/css/mbr-additional.css" type="text/css"%}">
  <link rel="stylesheet" href="{% static "assets/gallery/style.css"%}">


  <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

    <!-- jQuery library -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

    <!-- Latest compiled JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

    <!-- Bootstrap Toggle Input Buttons -->
    <link href="https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css" rel="stylesheet">
    <script src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"></script>




<!-- HTML -->

<div class="container-fluid" align="center">
        <input id="inputToggle" type="checkbox" checked data-toggle="toggle" data-size=="large" data-on="Vista Álbum" data-off="Vista Fotos"  data-onstyle="success" data-offstyle="danger">
        <p>El estado actual es:<p id="status"> </p> </p>
    </div>

<!-- JQuery -->

   $("document").ready(function(){
        $("#inputToggle").change(function(){
            if(this.checked){
                $("#status").text(this.getAttribute('data-on'))
            } else {
                $("#status").text(this.getAttribute('data-off'))
            }
        })
    });
</script>