diff --git a/src/Strem.Core/Components/Elements/AutoComplete.razor b/src/Strem.Core/Components/Elements/AutoComplete.razor
index b5f2c24..298f291 100644
--- a/src/Strem.Core/Components/Elements/AutoComplete.razor
+++ b/src/Strem.Core/Components/Elements/AutoComplete.razor
@@ -8,7 +8,7 @@
     </div>
     <div class="dropdown-menu" id="dropdown-menu" role="menu">
         <div class="dropdown-content">
-            @foreach (var entry in CurrentMatches)
+            @foreach (var entry in CurrentMatches.Take(MaxResults))
             {
                 var entryText = entry;
                 <a class="dropdown-item has-text-black" @onclick="() => SetSelection(entryText)">
@@ -28,6 +28,9 @@
 
     [Parameter]
     public IReadOnlyCollection<string> Data { get; set; }
+
+    [Parameter]
+    public int MaxResults { get; set; } = 10;
     
     public IEnumerable<string> CurrentMatches { get; set; }
     
diff --git a/src/Strem.Core/Components/Elements/ProcessedInput.razor b/src/Strem.Core/Components/Elements/ProcessedInput.razor
index 3ce3c2c..efdb6f3 100644
--- a/src/Strem.Core/Components/Elements/ProcessedInput.razor
+++ b/src/Strem.Core/Components/Elements/ProcessedInput.razor
@@ -1,4 +1,5 @@
 @using System.Text.RegularExpressions
+
 <div class="control has-icons-left">
     
     <input class="input @(InputVisible ? "" : "is-hidden")" type="text" placeholder="@Placeholder" value="@Value" @onblur="HideInput"
diff --git a/src/Strem.Core/Components/VariableDescriptorList.razor b/src/Strem.Core/Components/VariableDescriptorList.razor
index 971bec4..bffaefe 100644
--- a/src/Strem.Core/Components/VariableDescriptorList.razor
+++ b/src/Strem.Core/Components/VariableDescriptorList.razor
@@ -1,10 +1,16 @@
 @using Strem.Core.Flows
+@using Strem.Core.Variables
+@using Strem.Core.Events.Bus
+@using Strem.Core.Events
+@using TextCopy
+
+@inject IJSRuntime JS
 
 <div class="field is-grouped is-grouped-multiline">
     @foreach (var descriptor in VariableDescriptors)
     {
         <div class="control">
-            <div class="tags has-addons">
+            <div class="tags has-addons is-clickable" @onclick="() => CopyVariableToClipboard(descriptor.VariableEntry)">
                 <span class="tag @(descriptor.IsMandatory ? "is-success" : "is-warning")">@descriptor.VariableEntry.Name</span>
                 @if (!string.IsNullOrEmpty(descriptor.VariableEntry.Context))
                 {
@@ -18,4 +24,12 @@
 @code {
     [Parameter]
     public VariableDescriptor[] VariableDescriptors { get; set; }
+
+    private async Task CopyVariableToClipboard(VariableEntry variableEntry)
+    {
+        var variableText = $"V({variableEntry.Name}{(variableEntry.HasContext ? $",{variableEntry.Context}" : "")})";
+        await ClipboardService.SetTextAsync(variableText);
+        await JS.InvokeVoidAsync("showNotification", "Copied Variable To Clipboard", "is-info");
+    }
+
 }
\ No newline at end of file
diff --git a/src/Strem.Core/Events/ShowNotificationEvent.cs b/src/Strem.Core/Events/ShowNotificationEvent.cs
new file mode 100644
index 0000000..6fa487b
--- /dev/null
+++ b/src/Strem.Core/Events/ShowNotificationEvent.cs
@@ -0,0 +1,13 @@
+namespace Strem.Core.Events;
+
+public class ShowNotificationEvent
+{
+    public string Classes { get; }
+    public string Message { get; }
+
+    public ShowNotificationEvent(string message, string classes = null)
+    {
+        Classes = classes;
+        Message = message;
+    }
+}
\ No newline at end of file
diff --git a/src/Strem.Core/Strem.Core.csproj b/src/Strem.Core/Strem.Core.csproj
index 94ea96e..d78ec2b 100644
--- a/src/Strem.Core/Strem.Core.csproj
+++ b/src/Strem.Core/Strem.Core.csproj
@@ -9,14 +9,10 @@
 
     <ItemGroup>
       <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="6.0.0" />
+      <PackageReference Include="Microsoft.Extensions.Logging.Abstractions" Version="6.0.0" />
       <PackageReference Include="Newtonsoft.Json" Version="13.0.1" />
       <PackageReference Include="System.Reactive" Version="5.0.0" />
-    </ItemGroup>
-
-    <ItemGroup>
-      <Reference Include="Microsoft.Extensions.Logging.Abstractions">
-        <HintPath>C:\Program Files\dotnet\shared\Microsoft.AspNetCore.App\6.0.7\Microsoft.Extensions.Logging.Abstractions.dll</HintPath>
-      </Reference>
+      <PackageReference Include="TextCopy" Version="6.1.0" />
     </ItemGroup>
 
 </Project>
diff --git a/src/Strem.OBS/Components/Integrations/OBSIntegration.razor b/src/Strem.OBS/Components/Integrations/OBSIntegration.razor
index c68a652..cb80b6b 100644
--- a/src/Strem.OBS/Components/Integrations/OBSIntegration.razor
+++ b/src/Strem.OBS/Components/Integrations/OBSIntegration.razor
@@ -14,47 +14,53 @@
 
 @implements IDisposable
 
-<label class="label">OBS Host/IP & Port</label>
-<div class="field has-addons">
-    <div class="control">
-        <input class="input" type="text" placeholder="i.e localhost or 127.0.0.1" @bind="Host"/>
-    </div>
-    <div class="control">
-        <label class="label m-2">:</label>
-    </div>
-    <div class="control">
-        <input class="input" type="text" placeholder="i.e 4444" @bind="Port"/>
+<div class="columns">
+    <div class="column">
+        <label class="label">OBS Host/IP & Port</label>
+        <div class="field has-addons">
+            <div class="control is-expanded">
+                <input class="input" type="text" placeholder="i.e localhost or 127.0.0.1" @bind="Host"/>
+            </div>
+            <div class="control">
+                <label class="label m-2">:</label>
+            </div>
+            <div class="control">
+                <input class="input" type="text" placeholder="i.e 4444" @bind="Port"/>
+            </div>
+        </div>
+         <div class="field">
+            <div class="control">
+                @if (IsConnected)
+                {
+                    <button class="button is-danger" @onclick="DisconnectFromOBS" disabled="@IsConnecting">Disconnect From OBS</button>
+                }
+                else
+                {
+                    <button class="button is-success" @onclick="ConnectToOBS" disabled="@IsConnecting">Connect To OBS</button>
+                }
+            </div>
+            @if (!string.IsNullOrEmpty(ConnectionError))
+            {
+                <p class="help">
+                    <span class="icon has-text-danger">
+                        <i class="fas fa-circle-exclamation"></i>
+                    </span>
+                    <span class="has-text-danger">
+                        @ConnectionError
+                    </span>
+                </p>
+            }
+        </div>
     </div>
-</div>
-<div class="field">
-    <label class="label">OBS Server Password</label>
-    <div class="control">
-        <input class="input" type="password" @bind="Password"/>
+    <div class="column">
+        <div class="field">
+            <label class="label">OBS Server Password</label>
+            <div class="control">
+                <input class="input" type="password" @bind="Password"/>
+            </div>
+            <HelperInfo>You can leave the password empty if there is no password set on the server</HelperInfo>
+        </div>
     </div>
-    <HelperInfo>You can leave the password empty if there is no password set on the server</HelperInfo>
-</div>
-<div class="field">
-    <div class="control">
-        @if (IsConnected)
-        {
-            <button class="button is-danger" @onclick="DisconnectFromOBS" disabled="@IsConnecting">Disconnect From OBS</button>
-        }
-        else
-        {
-            <button class="button is-success" @onclick="ConnectToOBS" disabled="@IsConnecting">Connect To OBS</button>
-        }
-    </div>
-    @if (!string.IsNullOrEmpty(ConnectionError))
-    {
-        <p class="help">
-            <span class="icon has-text-danger">
-                <i class="fas fa-circle-exclamation"></i>
-            </span>
-            <span class="has-text-danger">
-                @ConnectionError
-            </span>
-        </p>
-    }
 </div>
 
 @code {
@@ -92,8 +98,8 @@
         InvokeAsync(StateHasChanged);
         
         var result = await ObsClient.AttemptConnect(Host, Port, Password);
-        ConnectionError = result.message;
-
+        ConnectionError = string.Empty;
+        
         if (result.success)
         {
             AppState.AppVariables.Delete(OBSVars.Password);
@@ -105,6 +111,10 @@
                 AppState.AppVariables.Set(OBSVars.Password, encryptedPassword);
             }
         }
+        else
+        {
+            ConnectionError = result.message;
+        }
         
         IsConnecting = false;
         InvokeAsync(StateHasChanged);
diff --git a/src/Strem.OBS/Components/Tasks/Sources/ChangeSceneTaskComponent.razor b/src/Strem.OBS/Components/Tasks/Sources/ChangeSceneTaskComponent.razor
new file mode 100644
index 0000000..1e13aa5
--- /dev/null
+++ b/src/Strem.OBS/Components/Tasks/Sources/ChangeSceneTaskComponent.razor
@@ -0,0 +1,41 @@
+@using Microsoft.AspNetCore.Components
+@using Strem.Core.Components.Tasks
+@using Strem.Core.State
+@using Strem.OBS.Extensions
+@using Strem.OBS.Flows.Tasks
+@using Strem.OBS.Services.Client
+@using Strem.OBS.Types
+
+@inherits CustomTaskComponent<ChangeSceneTaskData>
+
+@inject IAppState AppState;
+@inject IObservableOBSClient ObsClient;
+
+<div class="field">
+    <label class="label">Scene Name</label>
+    <div class="control">
+        <AutoComplete @bind-Value="@Data.NewScene" Data="SceneNames"></AutoComplete>
+    </div>
+</div>
+
+@code {
+    public override string Title => $"Change Scene To {Data.NewScene}";
+    
+    public string[] SceneNames { get; set; } = Array.Empty<string>();
+
+    protected override async Task OnInitializedAsync()
+    {
+        if (ObsClient.IsConnected)
+        {
+            var scenes = await ObsClient.GetSceneList();
+            SceneNames = scenes.Scenes.Select(x => x.Name).ToArray();
+        }
+        else
+        {
+            SceneNames = Array.Empty<string>();
+        }
+        
+        await base.OnInitializedAsync();
+    }
+
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Components/Tasks/Sources/SetRecordingStateTaskComponent.razor b/src/Strem.OBS/Components/Tasks/Sources/SetRecordingStateTaskComponent.razor
new file mode 100644
index 0000000..4196c36
--- /dev/null
+++ b/src/Strem.OBS/Components/Tasks/Sources/SetRecordingStateTaskComponent.razor
@@ -0,0 +1,23 @@
+@using Microsoft.AspNetCore.Components
+@using Strem.Core.Components.Tasks
+@using Strem.OBS.Flows.Tasks
+
+@inherits CustomTaskComponent<SetRecordingStateTaskData>
+
+<div class="field">
+    <label class="label">Stream Operation</label>
+    <div class="control">
+        <TrueOrFalse @bind-Value="Data.StartRecording" TrueText="Start Recording" FalseText="Stop Recording"></TrueOrFalse>
+    </div>
+</div>
+
+
+@code {
+    public override string Title => GetTitle();
+    
+    public string GetTitle()
+    {
+        var starter = Data.StartRecording ? "Start" : "Stop";
+        return $"<strong>{starter}</strong> OBS Recording";
+    }
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Components/Tasks/Sources/SetSourceMuteStateComponent.razor b/src/Strem.OBS/Components/Tasks/Sources/SetSourceMuteStateTaskComponent.razor
similarity index 85%
rename from src/Strem.OBS/Components/Tasks/Sources/SetSourceMuteStateComponent.razor
rename to src/Strem.OBS/Components/Tasks/Sources/SetSourceMuteStateTaskComponent.razor
index b9768ea..8466b89 100644
--- a/src/Strem.OBS/Components/Tasks/Sources/SetSourceMuteStateComponent.razor
+++ b/src/Strem.OBS/Components/Tasks/Sources/SetSourceMuteStateTaskComponent.razor
@@ -44,14 +44,16 @@
 
     protected override async Task OnInitializedAsync()
     {
-        if (AppState.HasOBSHost() && ObsClient.IsConnected)
+        if (ObsClient.IsConnected)
         {
-            if (!AppState.HasCurrentSceneItems())
-            { await ObsClient.PopulateActiveSceneTransientData(AppState); }
-            CurrentSceneItems = AppState.GetCurrentSceneItems();
+            if (!AppState.HasSourceList())
+            { await ObsClient.PopulateSourceListData(AppState); }
+            CurrentSceneItems = AppState.GetSourceList();
         }
         else
         { CurrentSceneItems = Array.Empty<string>(); }
+        
+        await base.OnInitializedAsync();
     }
 
 }
\ No newline at end of file
diff --git a/src/Strem.OBS/Components/Tasks/Sources/SetSourceVisibilityTaskComponent.razor b/src/Strem.OBS/Components/Tasks/Sources/SetSourceVisibilityTaskComponent.razor
index 76060ad..ce6b034 100644
--- a/src/Strem.OBS/Components/Tasks/Sources/SetSourceVisibilityTaskComponent.razor
+++ b/src/Strem.OBS/Components/Tasks/Sources/SetSourceVisibilityTaskComponent.razor
@@ -47,11 +47,13 @@
     {
         if (AppState.HasOBSHost() && ObsClient.IsConnected)
         {
-            if (!AppState.HasCurrentSceneItems())
-            { await ObsClient.PopulateActiveSceneTransientData(AppState); }
-            CurrentSceneItems = AppState.GetCurrentSceneItems();
+            if (!AppState.HasSourceList())
+            { await ObsClient.PopulateSourceListData(AppState); }
+            CurrentSceneItems = AppState.GetSourceList();
         }
         else
         { CurrentSceneItems = Array.Empty<string>(); }
+        
+        await base.OnInitializedAsync();
     }
 }
\ No newline at end of file
diff --git a/src/Strem.OBS/Components/Tasks/Sources/SetStreamingStateTaskComponent.razor b/src/Strem.OBS/Components/Tasks/Sources/SetStreamingStateTaskComponent.razor
new file mode 100644
index 0000000..d8575b8
--- /dev/null
+++ b/src/Strem.OBS/Components/Tasks/Sources/SetStreamingStateTaskComponent.razor
@@ -0,0 +1,27 @@
+@using Microsoft.AspNetCore.Components
+@using Strem.Core.Components.Tasks
+@using Strem.Core.State
+@using Strem.OBS.Extensions
+@using Strem.OBS.Flows.Tasks
+@using Strem.OBS.Services.Client
+@using Strem.OBS.Types
+
+@inherits CustomTaskComponent<SetStreamStateTaskData>
+
+<div class="field">
+    <label class="label">Stream Operation</label>
+    <div class="control">
+        <TrueOrFalse @bind-Value="Data.StartStream" TrueText="Start Stream" FalseText="Stop Stream"></TrueOrFalse>
+    </div>
+</div>
+
+
+@code {
+    public override string Title => GetTitle();
+    
+    public string GetTitle()
+    {
+        var starter = Data.StartStream ? "Start" : "Stop";
+        return $"<strong>{starter}</strong> OBS Stream";
+    }
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Components/Triggers/OnMuteStateChangedTriggerComponent.razor b/src/Strem.OBS/Components/Triggers/OnMuteStateChangedTriggerComponent.razor
index 80d2b18..67fe1f5 100644
--- a/src/Strem.OBS/Components/Triggers/OnMuteStateChangedTriggerComponent.razor
+++ b/src/Strem.OBS/Components/Triggers/OnMuteStateChangedTriggerComponent.razor
@@ -48,13 +48,15 @@
     
     protected override async Task OnInitializedAsync()
     {
-        if (AppState.HasOBSHost() && ObsClient.IsConnected)
+        if (ObsClient.IsConnected)
         {
-            if (!AppState.HasCurrentSceneItems())
-            { await ObsClient.PopulateActiveSceneTransientData(AppState); }
-            CurrentSceneItems = AppState.GetCurrentSceneItems();
+            if (!AppState.HasSourceList())
+            { await ObsClient.PopulateSourceListData(AppState); }
+            CurrentSceneItems = AppState.GetSourceList();
         }
         else
         { CurrentSceneItems = Array.Empty<string>(); }
+        
+        await base.OnInitializedAsync();
     }
 }
\ No newline at end of file
diff --git a/src/Strem.OBS/Components/Triggers/OnRecordingStateChangedTriggerComponent.razor b/src/Strem.OBS/Components/Triggers/OnRecordingStateChangedTriggerComponent.razor
new file mode 100644
index 0000000..3ef6f10
--- /dev/null
+++ b/src/Strem.OBS/Components/Triggers/OnRecordingStateChangedTriggerComponent.razor
@@ -0,0 +1,37 @@
+@using Microsoft.AspNetCore.Components
+@using Strem.Core.State
+@using Strem.OBS.Extensions
+@using Strem.OBS.Services.Client
+
+@inherits Strem.Core.Components.Triggers.CustomTriggerComponent<Strem.OBS.Flows.Triggers.OnRecordingStateChangedTriggerData>
+
+<div class="field">
+    <div class="control">
+        <label class="checkbox">
+            <input type="checkbox" @bind="Data.TriggerOnStarted">
+            Trigger When Recording?
+        </label>
+    </div>
+</div>
+<div class="field">
+    <div class="control">
+        <label class="checkbox">
+            <input type="checkbox" @bind="Data.TriggerOnStopped">
+            Trigger When Stopped Recording?
+        </label>
+    </div>
+</div>
+
+<div class="field">
+    <div class="control">
+        <label class="checkbox">
+            <input type="checkbox" @bind="Data.TriggerOnStart">
+            Trigger On Start?
+        </label>
+    </div>
+    <HelperInfo>By default these triggers wait to be told when recording state changes, but with this you can trigger it with the current state when it starts</HelperInfo>
+</div>
+
+@code {
+    public override string Title => $"On Recording State Changed";
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Components/Triggers/OnSceneChangedTriggerComponent.razor b/src/Strem.OBS/Components/Triggers/OnSceneChangedTriggerComponent.razor
new file mode 100644
index 0000000..8e136a7
--- /dev/null
+++ b/src/Strem.OBS/Components/Triggers/OnSceneChangedTriggerComponent.razor
@@ -0,0 +1,34 @@
+@using Microsoft.AspNetCore.Components
+@using Strem.OBS.Services.Client
+
+@inherits Strem.Core.Components.Triggers.CustomTriggerComponent<Strem.OBS.Flows.Triggers.OnSceneChangedTriggerData>
+
+@inject IObservableOBSClient ObsClient;
+
+<div class="field">
+    <label class="label">Matching Scene Name</label>
+    <div class="control">
+        <AutoComplete @bind-Value="@Data.MatchingSceneName" Data="SceneNames"></AutoComplete>
+    </div>
+    <HelperInfo>This optionally lets you only trigger when the new scene matches the name you specified, leave blank to match any scene</HelperInfo>
+</div>
+
+
+@code {
+    public override string Title => $"On Scene Changed {(string.IsNullOrEmpty(Data.MatchingSceneName) ? "" : $"To {Data.MatchingSceneName}")}";
+
+    public string[] SceneNames { get; set; } = Array.Empty<string>();
+    
+    protected override async Task OnInitializedAsync()
+    {
+        if (ObsClient.IsConnected)
+        {
+            var scenes = await ObsClient.GetSceneList();
+            SceneNames = scenes.Scenes.Select(x => x.Name).ToArray();
+        }
+        else
+        { SceneNames = Array.Empty<string>(); }
+        
+        await base.OnInitializedAsync();
+    }
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Components/Triggers/OnStreamingStateChangedTriggerComponent.razor b/src/Strem.OBS/Components/Triggers/OnStreamingStateChangedTriggerComponent.razor
new file mode 100644
index 0000000..34bac0e
--- /dev/null
+++ b/src/Strem.OBS/Components/Triggers/OnStreamingStateChangedTriggerComponent.razor
@@ -0,0 +1,37 @@
+@using Microsoft.AspNetCore.Components
+@using Strem.Core.State
+@using Strem.OBS.Extensions
+@using Strem.OBS.Services.Client
+
+@inherits Strem.Core.Components.Triggers.CustomTriggerComponent<Strem.OBS.Flows.Triggers.OnStreamingStateChangedTriggerData>
+
+<div class="field">
+    <div class="control">
+        <label class="checkbox">
+            <input type="checkbox" @bind="Data.TriggerOnStarted">
+            Trigger When Streaming?
+        </label>
+    </div>
+</div>
+<div class="field">
+    <div class="control">
+        <label class="checkbox">
+            <input type="checkbox" @bind="Data.TriggerOnStopped">
+            Trigger When Stopped Streaming?
+        </label>
+    </div>
+</div>
+
+<div class="field">
+    <div class="control">
+        <label class="checkbox">
+            <input type="checkbox" @bind="Data.TriggerOnStart">
+            Trigger On Start?
+        </label>
+    </div>
+    <HelperInfo>By default these triggers wait to be told when streaming state changes, but with this you can trigger it with the current state when it starts</HelperInfo>
+</div>
+
+@code {
+    public override string Title => $"On Streaming State Changed";
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Components/Triggers/OnVisibilityStateChangedTriggerComponent.razor b/src/Strem.OBS/Components/Triggers/OnVisibilityStateChangedTriggerComponent.razor
index ed9f018..31b792e 100644
--- a/src/Strem.OBS/Components/Triggers/OnVisibilityStateChangedTriggerComponent.razor
+++ b/src/Strem.OBS/Components/Triggers/OnVisibilityStateChangedTriggerComponent.razor
@@ -50,10 +50,10 @@
     {
         if (AppState.HasOBSHost() && ObsClient.IsConnected)
         {
-            if (!AppState.HasCurrentSceneItems())
-            { await ObsClient.PopulateActiveSceneTransientData(AppState); }
+            if (!AppState.HasSourceList())
+            { await ObsClient.PopulateSourceListData(AppState); }
             
-            CurrentSceneItems = AppState.GetCurrentSceneItems();
+            CurrentSceneItems = AppState.GetSourceList();
         }
         else
         { CurrentSceneItems = Array.Empty<string>(); }
diff --git a/src/Strem.OBS/Extensions/IAppSettingsExtensions.cs b/src/Strem.OBS/Extensions/IAppSettingsExtensions.cs
index abedbaf..bac9dc0 100644
--- a/src/Strem.OBS/Extensions/IAppSettingsExtensions.cs
+++ b/src/Strem.OBS/Extensions/IAppSettingsExtensions.cs
@@ -8,7 +8,8 @@ public static class IAppSettingsExtensions
     public static bool HasOBSHost(this IAppState state) => state.AppVariables.Has(OBSVars.Host);
     
     public static string GetCurrentSceneName(this IAppState state) => state.TransientVariables.Get(OBSVars.CurrentScene);
-    public static bool HasCurrentSceneItems(this IAppState state) => state.TransientVariables.Has(OBSVars.CurrentSceneItems);
-    public static bool HasCurrentSceneItem(this IAppState state, string item) => state.TransientVariables.Get(OBSVars.CurrentSceneItems).Contains(item, StringComparison.OrdinalIgnoreCase);
-    public static string[] GetCurrentSceneItems(this IAppState state) => state.TransientVariables.Get(OBSVars.CurrentSceneItems).Split(",");
+    public static void SetCurrentSceneName(this IAppState state, string sceneName) => state.TransientVariables.Set(OBSVars.CurrentScene, sceneName);
+    public static bool HasSourceList(this IAppState state) => state.TransientVariables.Has(OBSVars.SourceItems);
+    public static bool HasSourceItem(this IAppState state, string item) => state.TransientVariables.Get(OBSVars.SourceItems).Contains(item, StringComparison.OrdinalIgnoreCase);
+    public static string[] GetSourceList(this IAppState state) => state.TransientVariables.Get(OBSVars.SourceItems).Split(",");
 }
\ No newline at end of file
diff --git a/src/Strem.OBS/Extensions/IObservableOBSClientExtensions.cs b/src/Strem.OBS/Extensions/IObservableOBSClientExtensions.cs
index fb282e1..cfc8424 100644
--- a/src/Strem.OBS/Extensions/IObservableOBSClientExtensions.cs
+++ b/src/Strem.OBS/Extensions/IObservableOBSClientExtensions.cs
@@ -47,19 +47,21 @@ public static class IObservableOBSClientExtensions
         return await client.AttemptConnect(host, port, password);
     }
     
-    public static async Task PopulateActiveSceneTransientData(this IObservableOBSClient client, IAppState appState)
+    public static async Task PopulateSourceListData(this IObservableOBSClient client, IAppState appState)
     {
-        if(!appState.HasOBSHost()) { return; }
-        var scene = await client.GetCurrentScene();
-        await UpdateActiveSceneTransientData(appState, scene.Name, scene.Items);
+        if(!client.IsConnected) { return; }
+        var sources = await client.GetSourcesList();
+        await UpdateTransientData(appState, sources);
     }
 
-    public static async Task UpdateActiveSceneTransientData(this IAppState appState, string sceneName, IEnumerable<SceneItem> sceneItems)
+    public static async Task UpdateTransientData(this IAppState appState, IEnumerable<SourceInfo> sourceInfo)
     {
-        appState.TransientVariables.Set(OBSVars.CurrentScene, sceneName);
-
-        var sceneItemNames = sceneItems.GetAllSourceNames();
+        var sceneItemNames = sourceInfo
+            .Select(x => x.Name)
+            .Distinct()
+            .OrderBy(x => x);
+        
         var itemNames = string.Join(",", sceneItemNames);
-        appState.TransientVariables.Set(OBSVars.CurrentSceneItems, itemNames);
+        appState.TransientVariables.Set(OBSVars.SourceItems, itemNames);
     }
 }
\ No newline at end of file
diff --git a/src/Strem.OBS/Flows/Tasks/ChangeSceneTask.cs b/src/Strem.OBS/Flows/Tasks/ChangeSceneTask.cs
new file mode 100644
index 0000000..d354631
--- /dev/null
+++ b/src/Strem.OBS/Flows/Tasks/ChangeSceneTask.cs
@@ -0,0 +1,39 @@
+using Microsoft.Extensions.Logging;
+using Strem.Core.Events.Bus;
+using Strem.Core.Flows.Executors;
+using Strem.Core.Flows.Processors;
+using Strem.Core.Flows.Tasks;
+using Strem.Core.State;
+using Strem.Core.Variables;
+using Strem.OBS.Extensions;
+using Strem.OBS.Services.Client;
+
+namespace Strem.OBS.Flows.Tasks;
+
+public class ChangeSceneTask : FlowTask<ChangeSceneTaskData>
+{
+    public override string Code => ChangeSceneTaskData.TaskCode;
+    public override string Version => ChangeSceneTaskData.TaskVersion;
+    
+    public override string Name => "Change Scene";
+    public override string Category => "OBS v4";
+    public override string Description => "Changes the active scene in OBS";
+
+    public IObservableOBSClient ObsClient { get; }
+
+    public ChangeSceneTask(ILogger<FlowTask<ChangeSceneTaskData>> logger, IFlowStringProcessor flowStringProcessor, IAppState appState, IEventBus eventBus, IObservableOBSClient obsClient) : base(logger, flowStringProcessor, appState, eventBus)
+    {
+        ObsClient = obsClient;
+    }
+
+    public override bool CanExecute() => AppState.HasOBSHost() && ObsClient.IsConnected;
+
+    public override async Task<ExecutionResult> Execute(ChangeSceneTaskData data, IVariables flowVars)
+    {
+        if(string.IsNullOrEmpty(data.NewScene))
+        { return ExecutionResult.Failed(); }
+        
+        await ObsClient.SetCurrentScene(data.NewScene);
+        return ExecutionResult.Success();
+    }
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Flows/Tasks/ChangeSceneTaskData.cs b/src/Strem.OBS/Flows/Tasks/ChangeSceneTaskData.cs
new file mode 100644
index 0000000..bae3a5b
--- /dev/null
+++ b/src/Strem.OBS/Flows/Tasks/ChangeSceneTaskData.cs
@@ -0,0 +1,15 @@
+using Strem.Core.Flows.Tasks;
+
+namespace Strem.OBS.Flows.Tasks;
+
+public class ChangeSceneTaskData : IFlowTaskData
+{
+    public static readonly string TaskCode = "set-obs-v4-change-scene";
+    public static readonly string TaskVersion = "1.0.0";
+    
+    public Guid Id { get; set; } = Guid.NewGuid();
+    public string Code => TaskCode;
+    public string Version { get; set; } = TaskVersion;
+    
+    public string NewScene { get; set; }
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Flows/Tasks/SetRecordingStateTask.cs b/src/Strem.OBS/Flows/Tasks/SetRecordingStateTask.cs
new file mode 100644
index 0000000..74adff2
--- /dev/null
+++ b/src/Strem.OBS/Flows/Tasks/SetRecordingStateTask.cs
@@ -0,0 +1,38 @@
+using Microsoft.Extensions.Logging;
+using Strem.Core.Events.Bus;
+using Strem.Core.Flows.Executors;
+using Strem.Core.Flows.Processors;
+using Strem.Core.Flows.Tasks;
+using Strem.Core.State;
+using Strem.Core.Variables;
+using Strem.OBS.Extensions;
+using Strem.OBS.Services.Client;
+
+namespace Strem.OBS.Flows.Tasks;
+
+public class SetRecordingStateTask : FlowTask<SetRecordingStateTaskData>
+{
+    public override string Code => SetRecordingStateTaskData.TaskCode;
+    public override string Version => SetRecordingStateTaskData.TaskVersion;
+    
+    public override string Name => "Set Recording State";
+    public override string Category => "OBS v4";
+    public override string Description => "Starts or stops recording on OBS";
+
+    public IObservableOBSClient ObsClient { get; }
+
+    public SetRecordingStateTask(ILogger<FlowTask<SetRecordingStateTaskData>> logger, IFlowStringProcessor flowStringProcessor, IAppState appState, IEventBus eventBus, IObservableOBSClient obsClient) : base(logger, flowStringProcessor, appState, eventBus)
+    {
+        ObsClient = obsClient;
+    }
+
+    public override bool CanExecute() => AppState.HasOBSHost() && ObsClient.IsConnected;
+
+    public override async Task<ExecutionResult> Execute(SetRecordingStateTaskData data, IVariables flowVars)
+    {
+        if (data.StartRecording) { await ObsClient.StartRecording(); }
+        else { await ObsClient.StopRecording(); }
+
+        return ExecutionResult.Success();
+    }
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Flows/Tasks/SetRecordingStateTaskData.cs b/src/Strem.OBS/Flows/Tasks/SetRecordingStateTaskData.cs
new file mode 100644
index 0000000..340031b
--- /dev/null
+++ b/src/Strem.OBS/Flows/Tasks/SetRecordingStateTaskData.cs
@@ -0,0 +1,15 @@
+using Strem.Core.Flows.Tasks;
+
+namespace Strem.OBS.Flows.Tasks;
+
+public class SetRecordingStateTaskData : IFlowTaskData
+{
+    public static readonly string TaskCode = "set-obs-v4-recording-state";
+    public static readonly string TaskVersion = "1.0.0";
+    
+    public Guid Id { get; set; } = Guid.NewGuid();
+    public string Code => TaskCode;
+    public string Version { get; set; } = TaskVersion;
+    
+    public bool StartRecording { get; set; }
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Flows/Tasks/SetStreamStateTask.cs b/src/Strem.OBS/Flows/Tasks/SetStreamStateTask.cs
new file mode 100644
index 0000000..eb05698
--- /dev/null
+++ b/src/Strem.OBS/Flows/Tasks/SetStreamStateTask.cs
@@ -0,0 +1,38 @@
+using Microsoft.Extensions.Logging;
+using Strem.Core.Events.Bus;
+using Strem.Core.Flows.Executors;
+using Strem.Core.Flows.Processors;
+using Strem.Core.Flows.Tasks;
+using Strem.Core.State;
+using Strem.Core.Variables;
+using Strem.OBS.Extensions;
+using Strem.OBS.Services.Client;
+
+namespace Strem.OBS.Flows.Tasks;
+
+public class SetStreamStateTask : FlowTask<SetStreamStateTaskData>
+{
+    public override string Code => SetStreamStateTaskData.TaskCode;
+    public override string Version => SetStreamStateTaskData.TaskVersion;
+    
+    public override string Name => "Set Streaming State";
+    public override string Category => "OBS v4";
+    public override string Description => "Starts or stops streaming on OBS";
+
+    public IObservableOBSClient ObsClient { get; }
+
+    public SetStreamStateTask(ILogger<FlowTask<SetStreamStateTaskData>> logger, IFlowStringProcessor flowStringProcessor, IAppState appState, IEventBus eventBus, IObservableOBSClient obsClient) : base(logger, flowStringProcessor, appState, eventBus)
+    {
+        ObsClient = obsClient;
+    }
+
+    public override bool CanExecute() => AppState.HasOBSHost() && ObsClient.IsConnected;
+
+    public override async Task<ExecutionResult> Execute(SetStreamStateTaskData data, IVariables flowVars)
+    {
+        if (data.StartStream) { await ObsClient.StartStreaming(); }
+        else { await ObsClient.StopStreaming(); }
+
+        return ExecutionResult.Success();
+    }
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Flows/Tasks/SetStreamStateTaskData.cs b/src/Strem.OBS/Flows/Tasks/SetStreamStateTaskData.cs
new file mode 100644
index 0000000..958e0d1
--- /dev/null
+++ b/src/Strem.OBS/Flows/Tasks/SetStreamStateTaskData.cs
@@ -0,0 +1,15 @@
+using Strem.Core.Flows.Tasks;
+
+namespace Strem.OBS.Flows.Tasks;
+
+public class SetStreamStateTaskData : IFlowTaskData
+{
+    public static readonly string TaskCode = "set-obs-v4-stream-state";
+    public static readonly string TaskVersion = "1.0.0";
+    
+    public Guid Id { get; set; } = Guid.NewGuid();
+    public string Code => TaskCode;
+    public string Version { get; set; } = TaskVersion;
+    
+    public bool StartStream { get; set; }
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Flows/Triggers/OnRecordingStateChangedTrigger.cs b/src/Strem.OBS/Flows/Triggers/OnRecordingStateChangedTrigger.cs
new file mode 100644
index 0000000..33f84be
--- /dev/null
+++ b/src/Strem.OBS/Flows/Triggers/OnRecordingStateChangedTrigger.cs
@@ -0,0 +1,86 @@
+using System.Reactive.Linq;
+using Microsoft.Extensions.Logging;
+using OBSWebsocketDotNet;
+using OBSWebsocketDotNet.Types;
+using Strem.Core.Events.Bus;
+using Strem.Core.Extensions;
+using Strem.Core.Flows;
+using Strem.Core.Flows.Processors;
+using Strem.Core.Flows.Triggers;
+using Strem.Core.State;
+using Strem.Core.Variables;
+using Strem.OBS.Extensions;
+using Strem.OBS.Services.Client;
+using Strem.OBS.Variables;
+
+namespace Strem.OBS.Flows.Triggers;
+
+public class OnRecordingStateChangedTrigger : FlowTrigger<OnRecordingStateChangedTriggerData>
+{
+    public override string Code => OnRecordingStateChangedTriggerData.TriggerCode;
+    public override string Version => OnRecordingStateChangedTriggerData.TriggerVersion;
+
+    public override string Name => "On Recording State Changed";
+    public override string Category => "OBS v4";
+    public override string Description => "Triggers when OBS starts or stops recording";
+
+    public static VariableEntry ObsIsRecordingVariable = new("is-recording", OBSVars.OBSContext);
+    public static VariableEntry ObsRecordingStateVariable = new("recording-state", OBSVars.OBSContext);
+
+    public override VariableDescriptor[] VariableOutputs { get; } = new[]
+    {
+        ObsIsRecordingVariable.ToDescriptor(), ObsRecordingStateVariable.ToDescriptor()
+    };
+
+    public IObservableOBSClient ObsClient { get; }
+
+    public OnRecordingStateChangedTrigger(ILogger<FlowTrigger<OnRecordingStateChangedTriggerData>> logger, IFlowStringProcessor flowStringProcessor, IAppState appState, IEventBus eventBus, IObservableOBSClient obsClient) : base(logger, flowStringProcessor, appState, eventBus)
+    {
+        ObsClient = obsClient;
+    }
+
+    public override bool CanExecute() => AppState.HasOBSHost();
+
+    public override async Task<IObservable<IVariables>> Execute(OnRecordingStateChangedTriggerData data)
+    {
+        if(string.IsNullOrEmpty(data.SourceName))
+        { return Observable.Empty<IVariables>(); }
+        
+        var observableChain = ObsClient.OnRecordingStateChanged;
+        if (data.TriggerOnStart)
+        {
+            var isRecording = await GetInitialValue(data);
+            var args = new OutputStateChangedEventArgs { OutputState = isRecording ? OutputState.Started : OutputState.Stopped  };
+            observableChain = observableChain.StartWith(args);
+        }
+
+        return observableChain
+            .Where(x => x.OutputState is OutputState.Started or OutputState.Stopped)
+            .Where(x => MatchesEvent(data, x))
+            .Select(PopulateVariables);
+    }
+
+    public async Task<bool> GetInitialValue(OnRecordingStateChangedTriggerData data)
+    {
+        if(!ObsClient.IsConnected) { return false; }
+        var result = await ObsClient.GetStreamingStatus();
+        return result.IsRecording;
+    }
+
+    public bool MatchesEvent(OnRecordingStateChangedTriggerData data, OutputStateChangedEventArgs args)
+    {
+        var isRecording = args.OutputState == OutputState.Started;
+        if(data.TriggerOnStarted && isRecording) { return true; }
+        if(data.TriggerOnStopped && !isRecording) { return true; }
+        return false;
+    }
+    
+    public IVariables PopulateVariables(OutputStateChangedEventArgs args)
+    {
+        var isRecording = args.OutputState == OutputState.Started;
+        var variables = new Core.Variables.Variables();
+        variables.Set(ObsIsRecordingVariable, isRecording);
+        variables.Set(ObsRecordingStateVariable, isRecording ? "Recording" : "Not Recording");
+        return variables;
+    }
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Flows/Triggers/OnRecordingStateChangedTriggerData.cs b/src/Strem.OBS/Flows/Triggers/OnRecordingStateChangedTriggerData.cs
new file mode 100644
index 0000000..640b347
--- /dev/null
+++ b/src/Strem.OBS/Flows/Triggers/OnRecordingStateChangedTriggerData.cs
@@ -0,0 +1,18 @@
+using Strem.Core.Flows.Triggers;
+
+namespace Strem.OBS.Flows.Triggers;
+
+public class OnRecordingStateChangedTriggerData : IFlowTriggerData
+{
+    public static readonly string TriggerCode = "on-obs-v4-recording-state-changed";
+    public static readonly string TriggerVersion = "1.0.0";
+
+    public Guid Id { get; set; } = Guid.NewGuid();
+    public string Code => TriggerCode;
+    public string Version { get; set; } = TriggerVersion;
+
+    public string SourceName { get; set; }
+    public bool TriggerOnStarted { get; set; }
+    public bool TriggerOnStopped { get; set; }
+    public bool TriggerOnStart { get; set; }
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Flows/Triggers/OnSceneChangedTrigger.cs b/src/Strem.OBS/Flows/Triggers/OnSceneChangedTrigger.cs
new file mode 100644
index 0000000..9b0f405
--- /dev/null
+++ b/src/Strem.OBS/Flows/Triggers/OnSceneChangedTrigger.cs
@@ -0,0 +1,58 @@
+using System.Reactive.Linq;
+using Microsoft.Extensions.Logging;
+using OBSWebsocketDotNet;
+using Strem.Core.Events.Bus;
+using Strem.Core.Extensions;
+using Strem.Core.Flows;
+using Strem.Core.Flows.Processors;
+using Strem.Core.Flows.Triggers;
+using Strem.Core.State;
+using Strem.Core.Variables;
+using Strem.OBS.Extensions;
+using Strem.OBS.Services.Client;
+using Strem.OBS.Variables;
+
+namespace Strem.OBS.Flows.Triggers;
+
+public class OnSceneChangedTrigger : FlowTrigger<OnSceneChangedTriggerData>
+{
+    public override string Code => OnSceneChangedTriggerData.TriggerCode;
+    public override string Version => OnSceneChangedTriggerData.TriggerVersion;
+
+    public override string Name => "On Scene Changed";
+    public override string Category => "OBS v4";
+    public override string Description => "Triggers when a scene has been changed, with optional name checking";
+
+    public static VariableEntry ObsSourceVariable = new("scene.name", OBSVars.OBSContext);
+
+    public override VariableDescriptor[] VariableOutputs { get; } = new[]
+    {
+        ObsSourceVariable.ToDescriptor()
+    };
+
+    public IObservableOBSClient ObsClient { get; }
+
+    public OnSceneChangedTrigger(ILogger<FlowTrigger<OnSceneChangedTriggerData>> logger, IFlowStringProcessor flowStringProcessor, IAppState appState, IEventBus eventBus, IObservableOBSClient obsClient) : base(logger, flowStringProcessor, appState, eventBus)
+    {
+        ObsClient = obsClient;
+    }
+
+    public override bool CanExecute() => AppState.HasOBSHost();
+
+    public override async Task<IObservable<IVariables>> Execute(OnSceneChangedTriggerData data)
+    {
+        bool NameMatchesIfRequired(SceneChangeEventArgs x) => string.IsNullOrEmpty(data.MatchingSceneName) || 
+                                                              x.NewSceneName.Equals(data.MatchingSceneName, StringComparison.OrdinalIgnoreCase);
+        
+        return ObsClient.OnSceneChanged
+            .Where(NameMatchesIfRequired )
+            .Select(PopulateVariables);
+    }
+    
+    public IVariables PopulateVariables(SceneChangeEventArgs args)
+    {
+        var variables = new Core.Variables.Variables();
+        variables.Set(ObsSourceVariable, args.NewSceneName);
+        return variables;
+    }
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Flows/Triggers/OnSceneChangedTriggerData.cs b/src/Strem.OBS/Flows/Triggers/OnSceneChangedTriggerData.cs
new file mode 100644
index 0000000..7d07340
--- /dev/null
+++ b/src/Strem.OBS/Flows/Triggers/OnSceneChangedTriggerData.cs
@@ -0,0 +1,15 @@
+using Strem.Core.Flows.Triggers;
+
+namespace Strem.OBS.Flows.Triggers;
+
+public class OnSceneChangedTriggerData : IFlowTriggerData
+{
+    public static readonly string TriggerCode = "on-obs-v4-scene-changed";
+    public static readonly string TriggerVersion = "1.0.0";
+
+    public Guid Id { get; set; } = Guid.NewGuid();
+    public string Code => TriggerCode;
+    public string Version { get; set; } = TriggerVersion;
+
+    public string MatchingSceneName { get; set; }
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Flows/Triggers/OnStreamingStateChangedTrigger.cs b/src/Strem.OBS/Flows/Triggers/OnStreamingStateChangedTrigger.cs
new file mode 100644
index 0000000..3d1db06
--- /dev/null
+++ b/src/Strem.OBS/Flows/Triggers/OnStreamingStateChangedTrigger.cs
@@ -0,0 +1,86 @@
+using System.Reactive.Linq;
+using Microsoft.Extensions.Logging;
+using OBSWebsocketDotNet;
+using OBSWebsocketDotNet.Types;
+using Strem.Core.Events.Bus;
+using Strem.Core.Extensions;
+using Strem.Core.Flows;
+using Strem.Core.Flows.Processors;
+using Strem.Core.Flows.Triggers;
+using Strem.Core.State;
+using Strem.Core.Variables;
+using Strem.OBS.Extensions;
+using Strem.OBS.Services.Client;
+using Strem.OBS.Variables;
+
+namespace Strem.OBS.Flows.Triggers;
+
+public class OnStreamingStateChangedTrigger : FlowTrigger<OnStreamingStateChangedTriggerData>
+{
+    public override string Code => OnStreamingStateChangedTriggerData.TriggerCode;
+    public override string Version => OnStreamingStateChangedTriggerData.TriggerVersion;
+
+    public override string Name => "On Streaming State Changed";
+    public override string Category => "OBS v4";
+    public override string Description => "Triggers when OBS starts or stops streaming";
+
+    public static VariableEntry ObsIsStreamingVariable = new("is-streaming", OBSVars.OBSContext);
+    public static VariableEntry ObsStreamingStateVariable = new("streaming-state", OBSVars.OBSContext);
+
+    public override VariableDescriptor[] VariableOutputs { get; } = new[]
+    {
+        ObsIsStreamingVariable.ToDescriptor(), ObsStreamingStateVariable.ToDescriptor()
+    };
+
+    public IObservableOBSClient ObsClient { get; }
+
+    public OnStreamingStateChangedTrigger(ILogger<FlowTrigger<OnStreamingStateChangedTriggerData>> logger, IFlowStringProcessor flowStringProcessor, IAppState appState, IEventBus eventBus, IObservableOBSClient obsClient) : base(logger, flowStringProcessor, appState, eventBus)
+    {
+        ObsClient = obsClient;
+    }
+
+    public override bool CanExecute() => AppState.HasOBSHost();
+
+    public override async Task<IObservable<IVariables>> Execute(OnStreamingStateChangedTriggerData data)
+    {
+        if(string.IsNullOrEmpty(data.SourceName))
+        { return Observable.Empty<IVariables>(); }
+        
+        var observableChain = ObsClient.OnStreamingStateChanged;
+        if (data.TriggerOnStart)
+        {
+            var isStreaming = await GetInitialValue(data);
+            var args = new OutputStateChangedEventArgs { OutputState = isStreaming ? OutputState.Started : OutputState.Stopped  };
+            observableChain = observableChain.StartWith(args);
+        }
+
+        return observableChain
+            .Where(x => x.OutputState is OutputState.Started or OutputState.Stopped)
+            .Where(x => MatchesEvent(data, x))
+            .Select(PopulateVariables);
+    }
+
+    public async Task<bool> GetInitialValue(OnStreamingStateChangedTriggerData data)
+    {
+        if(!ObsClient.IsConnected) { return false; }
+        var result = await ObsClient.GetStreamingStatus();
+        return result.IsStreaming;
+    }
+
+    public bool MatchesEvent(OnStreamingStateChangedTriggerData data, OutputStateChangedEventArgs args)
+    {
+        var isStreaming = args.OutputState == OutputState.Started;
+        if(data.TriggerOnStarted && isStreaming) { return true; }
+        if(data.TriggerOnStopped && !isStreaming) { return true; }
+        return false;
+    }
+    
+    public IVariables PopulateVariables(OutputStateChangedEventArgs args)
+    {
+        var isStreaming = args.OutputState == OutputState.Started;
+        var variables = new Core.Variables.Variables();
+        variables.Set(ObsIsStreamingVariable, isStreaming);
+        variables.Set(ObsStreamingStateVariable, isStreaming ? "Streaming" : "Not Streaming");
+        return variables;
+    }
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Flows/Triggers/OnStreamingStateChangedTriggerData.cs b/src/Strem.OBS/Flows/Triggers/OnStreamingStateChangedTriggerData.cs
new file mode 100644
index 0000000..e4ed92d
--- /dev/null
+++ b/src/Strem.OBS/Flows/Triggers/OnStreamingStateChangedTriggerData.cs
@@ -0,0 +1,18 @@
+using Strem.Core.Flows.Triggers;
+
+namespace Strem.OBS.Flows.Triggers;
+
+public class OnStreamingStateChangedTriggerData : IFlowTriggerData
+{
+    public static readonly string TriggerCode = "on-obs-v4-stream-state-changed";
+    public static readonly string TriggerVersion = "1.0.0";
+
+    public Guid Id { get; set; } = Guid.NewGuid();
+    public string Code => TriggerCode;
+    public string Version { get; set; } = TriggerVersion;
+
+    public string SourceName { get; set; }
+    public bool TriggerOnStarted { get; set; }
+    public bool TriggerOnStopped { get; set; }
+    public bool TriggerOnStart { get; set; }
+}
\ No newline at end of file
diff --git a/src/Strem.OBS/Plugin/OBSIntegrationDescriptor.cs b/src/Strem.OBS/Plugin/OBSIntegrationDescriptor.cs
index c002e6f..21e34c3 100644
--- a/src/Strem.OBS/Plugin/OBSIntegrationDescriptor.cs
+++ b/src/Strem.OBS/Plugin/OBSIntegrationDescriptor.cs
@@ -13,7 +13,7 @@ public class OBSIntegrationDescriptor : IIntegrationDescriptor
 
     public VariableDescriptor[] VariableOutputs { get; } = new[]
     {
-        OBSVars.CurrentScene.ToDescriptor(), OBSVars.CurrentSceneItems.ToDescriptor()
+        OBSVars.CurrentScene.ToDescriptor(), OBSVars.SourceItems.ToDescriptor()
     };
 
     public Type ComponentType { get; } = typeof(OBSIntegration);
diff --git a/src/Strem.OBS/Plugin/OBSPluginStartup.cs b/src/Strem.OBS/Plugin/OBSPluginStartup.cs
index b7c6d17..0fca72b 100644
--- a/src/Strem.OBS/Plugin/OBSPluginStartup.cs
+++ b/src/Strem.OBS/Plugin/OBSPluginStartup.cs
@@ -40,16 +40,19 @@ public async Task StartPlugin()
             .Subscribe(x => Logger.Error($"Unhandled Error in OBS: {x}"))
             .AddTo(_subs);
         
-        if (AppState.HasOBSHost())
-        { await ConnectToOBS(); }
-        
-        Observable.Timer(TimeSpan.Zero, TimeSpan.FromMinutes(OBSPluginSettings.RefreshScenePeriodInSeconds))
-            .Subscribe(x => RefreshOBSData())
+        OBSClient.OnSceneChanged
+            .Subscribe(x => AppState.SetCurrentSceneName(x.NewSceneName))
             .AddTo(_subs);
 
-        OBSClient.OnSceneChanged
-            .Subscribe(x => AppState.UpdateActiveSceneTransientData(x.NewSceneName, x.SceneItems))
+        Observable.Merge(OBSClient.OnSourceCreated.ToUnit(), OBSClient.OnSourceDestroyed.ToUnit(), OBSClient.OnSourceRenamed.ToUnit())
+            .Subscribe(x => RefreshOBSData())
             .AddTo(_subs);
+
+        if (AppState.HasOBSHost())
+        {
+            await ConnectToOBS();
+            await RefreshOBSData();
+        }
     }
 
     public async Task ConnectToOBS()
@@ -63,11 +66,13 @@ public async Task ConnectToOBS()
 
     public async Task RefreshOBSData()
     {
-        if (AppState.HasOBSHost() && !OBSClient.IsConnected)
-        { await ConnectToOBS();  }
+        if (!OBSClient.IsConnected)
+        { await ConnectToOBS(); }
 
         if (!OBSClient.IsConnected) { return; }
-        await OBSClient.PopulateActiveSceneTransientData(AppState);
+        var scene = await OBSClient.GetCurrentScene();
+        AppState.SetCurrentSceneName(scene.Name);
+        await OBSClient.PopulateSourceListData(AppState);
     }
 
     public void Dispose()
diff --git a/src/Strem.OBS/Variables/OBSVars.cs b/src/Strem.OBS/Variables/OBSVars.cs
index 661dbcc..d2bff53 100644
--- a/src/Strem.OBS/Variables/OBSVars.cs
+++ b/src/Strem.OBS/Variables/OBSVars.cs
@@ -11,5 +11,5 @@ public class OBSVars
     public static readonly VariableEntry Password = new("password", OBSContext);
     
     public static readonly VariableEntry CurrentScene = new("current-scene", OBSContext);
-    public static readonly VariableEntry CurrentSceneItems = new("current-scene.items", OBSContext);
+    public static readonly VariableEntry SourceItems = new("source-items", OBSContext);
 }
\ No newline at end of file
diff --git a/src/Strem.Twitch/Plugin/TwitchPluginStartup.cs b/src/Strem.Twitch/Plugin/TwitchPluginStartup.cs
index 1c5e617..9b0f699 100644
--- a/src/Strem.Twitch/Plugin/TwitchPluginStartup.cs
+++ b/src/Strem.Twitch/Plugin/TwitchPluginStartup.cs
@@ -6,11 +6,11 @@
 using Strem.Core.State;
 using Strem.Twitch.Events.OAuth;
 using Strem.Twitch.Extensions;
+using Strem.Twitch.Services.Client;
 using Strem.Twitch.Services.OAuth;
 using Strem.Twitch.Types;
 using Strem.Twitch.Variables;
 using TwitchLib.Api.Interfaces;
-using TwitchLib.Client.Interfaces;
 
 namespace Strem.Twitch.Plugin;
 
@@ -20,12 +20,12 @@ public class TwitchPluginStartup : IPluginStartup, IDisposable
     
     public ITwitchOAuthClient TwitchOAuthClient { get; }
     public ITwitchAPI TwitchApi { get; }
-    public ITwitchClient TwitchClient { get; }
+    public IObservableTwitchClient TwitchClient { get; }
     public IEventBus EventBus { get; }
     public IAppState AppState { get; }
     public ILogger<TwitchPluginStartup> Logger { get; }
 
-    public TwitchPluginStartup(ITwitchOAuthClient twitchOAuthClient, ITwitchAPI twitchApi, ITwitchClient twitchClient, IEventBus eventBus, IAppState appState, ILogger<TwitchPluginStartup> logger)
+    public TwitchPluginStartup(ITwitchOAuthClient twitchOAuthClient, ITwitchAPI twitchApi, IObservableTwitchClient twitchClient, IEventBus eventBus, IAppState appState, ILogger<TwitchPluginStartup> logger)
     {
         TwitchOAuthClient = twitchOAuthClient;
         TwitchApi = twitchApi;
@@ -48,6 +48,10 @@ public async Task StartPlugin()
         Observable.Timer(TimeSpan.Zero, TimeSpan.FromMinutes(TwitchPluginSettings.RefreshChannelPeriodInMins))
             .Subscribe(x => RefreshChannelDetails())
             .AddTo(_subs);
+
+        TwitchClient.OnChannelStateChanged
+            .Subscribe(x => RefreshChannelDetails())
+            .AddTo(_subs);
         
         EventBus.Receive<TwitchOAuthSuccessEvent>()
             .Subscribe(x => VerifyAndSetupConnections())
@@ -61,10 +65,10 @@ public async Task StartPlugin()
     public void AttemptToConnectToChat()
     {
         if(!AppState.HasTwitchOAuth()) { return; }
-        if(TwitchClient.IsConnected) { return; }
+        if(TwitchClient.Client.IsConnected) { return; }
         if(!AppState.HasTwitchScope(ChatScopes.ReadChat)) { return; }
         
-        var result = TwitchClient.ConnectOrRefresh(AppState);
+        var result = TwitchClient.Client.ConnectOrRefresh(AppState);
         if(result.success)
         { Logger.Information($"Connected to twitch chat"); }
         else
@@ -80,8 +84,8 @@ public async Task VerifyAndSetupConnections()
 
     public async Task DisconnectEverything()
     {
-        if(TwitchClient.IsConnected)
-        { TwitchClient.Disconnect(); }
+        if(TwitchClient.Client.IsConnected)
+        { TwitchClient.Client.Disconnect(); }
     }
 
     public async Task VerifyToken()
diff --git a/src/Strem.Twitch/Services/Client/IObservableTwitchClient.cs b/src/Strem.Twitch/Services/Client/IObservableTwitchClient.cs
index 7718a48..5e7fcf4 100644
--- a/src/Strem.Twitch/Services/Client/IObservableTwitchClient.cs
+++ b/src/Strem.Twitch/Services/Client/IObservableTwitchClient.cs
@@ -1,11 +1,14 @@
 using System.Reactive;
 using TwitchLib.Client.Events;
+using TwitchLib.Client.Interfaces;
 using TwitchLib.Communication.Events;
 
 namespace Strem.Twitch.Services.Client;
 
 public interface IObservableTwitchClient
 {
+    ITwitchClient Client { get; }
+    
     /// <summary>Occurs when [on being hosted].</summary>
     IObservable<OnBeingHostedArgs> OnBeingHosted { get; }
 
@@ -134,9 +137,6 @@ public interface IObservableTwitchClient
     /// <summary>Occurs when [on message deleted].</summary>
     IObservable<OnMessageClearedArgs> OnMessageCleared { get; }
 
-    /// <summary>Occurs when [on ritual for new chatter received].</summary>
-    IObservable<OnRitualNewChatterArgs> OnRitualNewChatter { get; }
-
     /// <summary>
     /// Occurs when chatting in a channel that requires a verified email without a verified email attached to the account.
     /// </summary>
diff --git a/src/Strem.Twitch/Services/Client/IObservableTwitchPubSub.cs b/src/Strem.Twitch/Services/Client/IObservableTwitchPubSub.cs
new file mode 100644
index 0000000..5104bb8
--- /dev/null
+++ b/src/Strem.Twitch/Services/Client/IObservableTwitchPubSub.cs
@@ -0,0 +1,8 @@
+using TwitchLib.PubSub.Interfaces;
+
+namespace Strem.Twitch.Services.Client;
+
+public interface IObservableTwitchPubSub
+{
+    ITwitchPubSub PubSub { get; }
+}
\ No newline at end of file
diff --git a/src/Strem.Twitch/Services/Client/ObservableTwitchClient.cs b/src/Strem.Twitch/Services/Client/ObservableTwitchClient.cs
index a7c27b5..2766b30 100644
--- a/src/Strem.Twitch/Services/Client/ObservableTwitchClient.cs
+++ b/src/Strem.Twitch/Services/Client/ObservableTwitchClient.cs
@@ -9,7 +9,7 @@ namespace Strem.Twitch.Services.Client;
 
 public class ObservableTwitchClient : IObservableTwitchClient
 {
-    public ITwitchClient TwitchClient { get; }
+    public ITwitchClient Client { get; }
     
     /// <summary>Occurs when [on being hosted].</summary>
     public IObservable<OnBeingHostedArgs> OnBeingHosted { get; private set; }
@@ -139,9 +139,6 @@ public class ObservableTwitchClient : IObservableTwitchClient
     /// <summary>Occurs when [on message deleted].</summary>
     public IObservable<OnMessageClearedArgs> OnMessageCleared { get; private set; }
 
-    /// <summary>Occurs when [on ritual for new chatter received].</summary>
-    public IObservable<OnRitualNewChatterArgs> OnRitualNewChatter { get; private set; }
-
     /// <summary>
     /// Occurs when chatting in a channel that requires a verified email without a verified email attached to the account.
     /// </summary>
@@ -157,248 +154,242 @@ public class ObservableTwitchClient : IObservableTwitchClient
     /// </summary>
     public IObservable<OnBannedEmailAliasArgs> OnBannedEmailAlias { get; private set; }
 
-    public ObservableTwitchClient(ITwitchClient twitchClient)
+    public ObservableTwitchClient(ITwitchClient client)
     {
-        TwitchClient = twitchClient;
+        Client = client;
         SetupObservables();
     }
     
     public void SetupObservables()
     {
         OnConnected = Observable.FromEventPattern<OnConnectedArgs>(
-            e => TwitchClient.OnConnected += e,
-            e => TwitchClient.OnConnected -= e)
+            e => Client.OnConnected += e,
+            e => Client.OnConnected -= e)
             .Select(x => x.EventArgs);
         
         OnDisconnected = Observable.FromEventPattern<OnDisconnectedEventArgs>(
-                e => TwitchClient.OnDisconnected += e,
-                e => TwitchClient.OnDisconnected -= e)
+                e => Client.OnDisconnected += e,
+                e => Client.OnDisconnected -= e)
             .Select(x => x.EventArgs);
         
         OnError = Observable.FromEventPattern<OnErrorEventArgs>(
-                e => TwitchClient.OnError += e,
-                e => TwitchClient.OnError -= e)
+                e => Client.OnError += e,
+                e => Client.OnError -= e)
             .Select(x => x.EventArgs);
         
         OnLog = Observable.FromEventPattern<OnLogArgs>(
-                e => TwitchClient.OnLog += e,
-                e => TwitchClient.OnLog -= e)
+                e => Client.OnLog += e,
+                e => Client.OnLog -= e)
             .Select(x => x.EventArgs);
         
         OnReconnected = Observable.FromEventPattern<OnReconnectedEventArgs>(
-                e => TwitchClient.OnReconnected += e,
-                e => TwitchClient.OnReconnected -= e)
+                e => Client.OnReconnected += e,
+                e => Client.OnReconnected -= e)
             .Select(x => x.EventArgs);
         
         OnBeingHosted = Observable.FromEventPattern<OnBeingHostedArgs>(
-                e => TwitchClient.OnBeingHosted += e,
-                e => TwitchClient.OnBeingHosted -= e)
+                e => Client.OnBeingHosted += e,
+                e => Client.OnBeingHosted -= e)
             .Select(x => x.EventArgs);
         
         OnChatCleared = Observable.FromEventPattern<OnChatClearedArgs>(
-                e => TwitchClient.OnChatCleared += e,
-                e => TwitchClient.OnChatCleared -= e)
+                e => Client.OnChatCleared += e,
+                e => Client.OnChatCleared -= e)
             .Select(x => x.EventArgs);
         
         OnCommunitySubscription = Observable.FromEventPattern<OnCommunitySubscriptionArgs>(
-                e => TwitchClient.OnCommunitySubscription += e,
-                e => TwitchClient.OnCommunitySubscription -= e)
+                e => Client.OnCommunitySubscription += e,
+                e => Client.OnCommunitySubscription -= e)
             .Select(x => x.EventArgs);
         
         OnConnectionError = Observable.FromEventPattern<OnConnectionErrorArgs>(
-                e => TwitchClient.OnConnectionError += e,
-                e => TwitchClient.OnConnectionError -= e)
+                e => Client.OnConnectionError += e,
+                e => Client.OnConnectionError -= e)
             .Select(x => x.EventArgs);
         
         OnGiftedSubscription = Observable.FromEventPattern<OnGiftedSubscriptionArgs>(
-                e => TwitchClient.OnGiftedSubscription += e,
-                e => TwitchClient.OnGiftedSubscription -= e)
+                e => Client.OnGiftedSubscription += e,
+                e => Client.OnGiftedSubscription -= e)
             .Select(x => x.EventArgs);
         
         OnHostingStarted = Observable.FromEventPattern<OnHostingStartedArgs>(
-                e => TwitchClient.OnHostingStarted += e,
-                e => TwitchClient.OnHostingStarted -= e)
+                e => Client.OnHostingStarted += e,
+                e => Client.OnHostingStarted -= e)
             .Select(x => x.EventArgs);
         
         OnHostingStopped = Observable.FromEventPattern<OnHostingStoppedArgs>(
-                e => TwitchClient.OnHostingStopped += e,
-                e => TwitchClient.OnHostingStopped -= e)
+                e => Client.OnHostingStopped += e,
+                e => Client.OnHostingStopped -= e)
             .Select(x => x.EventArgs);
         
         OnHostLeft = Observable.FromEventPattern(
-                e => TwitchClient.OnHostLeft += e,
-                e => TwitchClient.OnHostLeft -= e)
+                e => Client.OnHostLeft += e,
+                e => Client.OnHostLeft -= e)
             .ToUnit();
 
         OnGiftedSubscription = Observable.FromEventPattern<OnGiftedSubscriptionArgs>(
-                e => TwitchClient.OnGiftedSubscription += e,
-                e => TwitchClient.OnGiftedSubscription -= e)
+                e => Client.OnGiftedSubscription += e,
+                e => Client.OnGiftedSubscription -= e)
             .Select(x => x.EventArgs);
         
         OnIncorrectLogin = Observable.FromEventPattern<OnIncorrectLoginArgs>(
-                e => TwitchClient.OnIncorrectLogin += e,
-                e => TwitchClient.OnIncorrectLogin -= e)
+                e => Client.OnIncorrectLogin += e,
+                e => Client.OnIncorrectLogin -= e)
             .Select(x => x.EventArgs);
         
         OnJoinedChannel = Observable.FromEventPattern<OnJoinedChannelArgs>(
-                e => TwitchClient.OnJoinedChannel += e,
-                e => TwitchClient.OnJoinedChannel -= e)
+                e => Client.OnJoinedChannel += e,
+                e => Client.OnJoinedChannel -= e)
             .Select(x => x.EventArgs);
         
         OnLeftChannel = Observable.FromEventPattern<OnLeftChannelArgs>(
-                e => TwitchClient.OnLeftChannel += e,
-                e => TwitchClient.OnLeftChannel -= e)
+                e => Client.OnLeftChannel += e,
+                e => Client.OnLeftChannel -= e)
             .Select(x => x.EventArgs);
         
         OnMessageCleared = Observable.FromEventPattern<OnMessageClearedArgs>(
-                e => TwitchClient.OnMessageCleared += e,
-                e => TwitchClient.OnMessageCleared -= e)
+                e => Client.OnMessageCleared += e,
+                e => Client.OnMessageCleared -= e)
             .Select(x => x.EventArgs);
         
         OnMessageReceived = Observable.FromEventPattern<OnMessageReceivedArgs>(
-                e => TwitchClient.OnMessageReceived += e,
-                e => TwitchClient.OnMessageReceived -= e)
+                e => Client.OnMessageReceived += e,
+                e => Client.OnMessageReceived -= e)
             .Select(x => x.EventArgs);
         
         OnMessageSent = Observable.FromEventPattern<OnMessageSentArgs>(
-                e => TwitchClient.OnMessageSent += e,
-                e => TwitchClient.OnMessageSent -= e)
+                e => Client.OnMessageSent += e,
+                e => Client.OnMessageSent -= e)
             .Select(x => x.EventArgs);
         
         OnMessageThrottled = Observable.FromEventPattern<OnMessageThrottledEventArgs>(
-                e => TwitchClient.OnMessageThrottled += e,
-                e => TwitchClient.OnMessageThrottled -= e)
+                e => Client.OnMessageThrottled += e,
+                e => Client.OnMessageThrottled -= e)
             .Select(x => x.EventArgs);
         
         OnModeratorJoined = Observable.FromEventPattern<OnModeratorJoinedArgs>(
-                e => TwitchClient.OnModeratorJoined += e,
-                e => TwitchClient.OnModeratorJoined -= e)
+                e => Client.OnModeratorJoined += e,
+                e => Client.OnModeratorJoined -= e)
             .Select(x => x.EventArgs);
         
         OnModeratorLeft = Observable.FromEventPattern<OnModeratorLeftArgs>(
-                e => TwitchClient.OnModeratorLeft += e,
-                e => TwitchClient.OnModeratorLeft -= e)
+                e => Client.OnModeratorLeft += e,
+                e => Client.OnModeratorLeft -= e)
             .Select(x => x.EventArgs);
         
         OnModeratorsReceived = Observable.FromEventPattern<OnModeratorsReceivedArgs>(
-                e => TwitchClient.OnModeratorsReceived += e,
-                e => TwitchClient.OnModeratorsReceived -= e)
+                e => Client.OnModeratorsReceived += e,
+                e => Client.OnModeratorsReceived -= e)
             .Select(x => x.EventArgs);
         
         OnNewSubscriber = Observable.FromEventPattern<OnNewSubscriberArgs>(
-                e => TwitchClient.OnNewSubscriber += e,
-                e => TwitchClient.OnNewSubscriber -= e)
+                e => Client.OnNewSubscriber += e,
+                e => Client.OnNewSubscriber -= e)
             .Select(x => x.EventArgs);
         
         OnNowHosting = Observable.FromEventPattern<OnNowHostingArgs>(
-                e => TwitchClient.OnNowHosting += e,
-                e => TwitchClient.OnNowHosting -= e)
+                e => Client.OnNowHosting += e,
+                e => Client.OnNowHosting -= e)
             .Select(x => x.EventArgs);
         
         OnRaidNotification = Observable.FromEventPattern<OnRaidNotificationArgs>(
-                e => TwitchClient.OnRaidNotification += e,
-                e => TwitchClient.OnRaidNotification -= e)
+                e => Client.OnRaidNotification += e,
+                e => Client.OnRaidNotification -= e)
             .Select(x => x.EventArgs);
         
         OnReSubscriber = Observable.FromEventPattern<OnReSubscriberArgs>(
-                e => TwitchClient.OnReSubscriber += e,
-                e => TwitchClient.OnReSubscriber -= e)
+                e => Client.OnReSubscriber += e,
+                e => Client.OnReSubscriber -= e)
             .Select(x => x.EventArgs);
         
         OnUserBanned = Observable.FromEventPattern<OnUserBannedArgs>(
-                e => TwitchClient.OnUserBanned += e,
-                e => TwitchClient.OnUserBanned -= e)
+                e => Client.OnUserBanned += e,
+                e => Client.OnUserBanned -= e)
             .Select(x => x.EventArgs);
         
         OnUserJoined = Observable.FromEventPattern<OnUserJoinedArgs>(
-                e => TwitchClient.OnUserJoined += e,
-                e => TwitchClient.OnUserJoined -= e)
+                e => Client.OnUserJoined += e,
+                e => Client.OnUserJoined -= e)
             .Select(x => x.EventArgs);        
         
         OnUserLeft = Observable.FromEventPattern<OnUserLeftArgs>(
-                e => TwitchClient.OnUserLeft += e,
-                e => TwitchClient.OnUserLeft -= e)
+                e => Client.OnUserLeft += e,
+                e => Client.OnUserLeft -= e)
             .Select(x => x.EventArgs);
         
         OnUserTimedout = Observable.FromEventPattern<OnUserTimedoutArgs>(
-                e => TwitchClient.OnUserTimedout += e,
-                e => TwitchClient.OnUserTimedout -= e)
+                e => Client.OnUserTimedout += e,
+                e => Client.OnUserTimedout -= e)
             .Select(x => x.EventArgs);
         
         OnWhisperReceived = Observable.FromEventPattern<OnWhisperReceivedArgs>(
-                e => TwitchClient.OnWhisperReceived += e,
-                e => TwitchClient.OnWhisperReceived -= e)
+                e => Client.OnWhisperReceived += e,
+                e => Client.OnWhisperReceived -= e)
             .Select(x => x.EventArgs);
         
         OnWhisperSent = Observable.FromEventPattern<OnWhisperSentArgs>(
-                e => TwitchClient.OnWhisperSent += e,
-                e => TwitchClient.OnWhisperSent -= e)
+                e => Client.OnWhisperSent += e,
+                e => Client.OnWhisperSent -= e)
             .Select(x => x.EventArgs);
         
         OnWhisperThrottled = Observable.FromEventPattern<OnWhisperThrottledEventArgs>(
-                e => TwitchClient.OnWhisperThrottled += e,
-                e => TwitchClient.OnWhisperThrottled -= e)
+                e => Client.OnWhisperThrottled += e,
+                e => Client.OnWhisperThrottled -= e)
             .Select(x => x.EventArgs);
         
         OnBannedEmailAlias = Observable.FromEventPattern<OnBannedEmailAliasArgs>(
-                e => TwitchClient.OnBannedEmailAlias += e,
-                e => TwitchClient.OnBannedEmailAlias -= e)
+                e => Client.OnBannedEmailAlias += e,
+                e => Client.OnBannedEmailAlias -= e)
             .Select(x => x.EventArgs);
         
         OnChannelStateChanged = Observable.FromEventPattern<OnChannelStateChangedArgs>(
-                e => TwitchClient.OnChannelStateChanged += e,
-                e => TwitchClient.OnChannelStateChanged -= e)
+                e => Client.OnChannelStateChanged += e,
+                e => Client.OnChannelStateChanged -= e)
             .Select(x => x.EventArgs);
         
         OnChatColorChanged = Observable.FromEventPattern<OnChatColorChangedArgs>(
-                e => TwitchClient.OnChatColorChanged += e,
-                e => TwitchClient.OnChatColorChanged -= e)
+                e => Client.OnChatColorChanged += e,
+                e => Client.OnChatColorChanged -= e)
             .Select(x => x.EventArgs);
         
         OnChatCommandReceived = Observable.FromEventPattern<OnChatCommandReceivedArgs>(
-                e => TwitchClient.OnChatCommandReceived += e,
-                e => TwitchClient.OnChatCommandReceived -= e)
+                e => Client.OnChatCommandReceived += e,
+                e => Client.OnChatCommandReceived -= e)
             .Select(x => x.EventArgs);
         
         OnExistingUsersDetected = Observable.FromEventPattern<OnExistingUsersDetectedArgs>(
-                e => TwitchClient.OnExistingUsersDetected += e,
-                e => TwitchClient.OnExistingUsersDetected -= e)
+                e => Client.OnExistingUsersDetected += e,
+                e => Client.OnExistingUsersDetected -= e)
             .Select(x => x.EventArgs);
         
         OnRequiresVerifiedEmail = Observable.FromEventPattern<OnRequiresVerifiedEmailArgs>(
-                e => TwitchClient.OnRequiresVerifiedEmail += e,
-                e => TwitchClient.OnRequiresVerifiedEmail -= e)
-            .Select(x => x.EventArgs);
-        
-        OnRitualNewChatter = Observable.FromEventPattern<OnRitualNewChatterArgs>(
-                e => TwitchClient.OnRitualNewChatter += e,
-                e => TwitchClient.OnRitualNewChatter -= e)
+                e => Client.OnRequiresVerifiedEmail += e,
+                e => Client.OnRequiresVerifiedEmail -= e)
             .Select(x => x.EventArgs);
         
         OnSendReceiveData = Observable.FromEventPattern<OnSendReceiveDataArgs>(
-                e => TwitchClient.OnSendReceiveData += e,
-                e => TwitchClient.OnSendReceiveData -= e)
+                e => Client.OnSendReceiveData += e,
+                e => Client.OnSendReceiveData -= e)
             .Select(x => x.EventArgs);
         
         OnUserStateChanged = Observable.FromEventPattern<OnUserStateChangedArgs>(
-                e => TwitchClient.OnUserStateChanged += e,
-                e => TwitchClient.OnUserStateChanged -= e)
+                e => Client.OnUserStateChanged += e,
+                e => Client.OnUserStateChanged -= e)
             .Select(x => x.EventArgs);
         
         OnWhisperCommandReceived = Observable.FromEventPattern<OnWhisperCommandReceivedArgs>(
-                e => TwitchClient.OnWhisperCommandReceived += e,
-                e => TwitchClient.OnWhisperCommandReceived -= e)
+                e => Client.OnWhisperCommandReceived += e,
+                e => Client.OnWhisperCommandReceived -= e)
             .Select(x => x.EventArgs);
         
         OnRequiresVerifiedPhoneNumber = Observable.FromEventPattern<OnRequiresVerifiedPhoneNumberArgs>(
-                e => TwitchClient.OnRequiresVerifiedPhoneNumber += e,
-                e => TwitchClient.OnRequiresVerifiedPhoneNumber -= e)
+                e => Client.OnRequiresVerifiedPhoneNumber += e,
+                e => Client.OnRequiresVerifiedPhoneNumber -= e)
             .Select(x => x.EventArgs);
         
         OnVIPsReceived = Observable.FromEventPattern<OnVIPsReceivedArgs>(
-                e => TwitchClient.OnVIPsReceived += e,
-                e => TwitchClient.OnVIPsReceived -= e)
+                e => Client.OnVIPsReceived += e,
+                e => Client.OnVIPsReceived -= e)
             .Select(x => x.EventArgs);
-
     }
 }
\ No newline at end of file
diff --git a/src/Strem.Twitch/Services/Client/ObservableTwitchPubSub.cs b/src/Strem.Twitch/Services/Client/ObservableTwitchPubSub.cs
new file mode 100644
index 0000000..41e5adb
--- /dev/null
+++ b/src/Strem.Twitch/Services/Client/ObservableTwitchPubSub.cs
@@ -0,0 +1,141 @@
+using System.Reactive;
+using System.Reactive.Linq;
+using TwitchLib.Client.Events;
+using TwitchLib.PubSub.Events;
+using TwitchLib.PubSub.Interfaces;
+using OnEmoteOnlyArgs = TwitchLib.PubSub.Events.OnEmoteOnlyArgs;
+using OnLogArgs = TwitchLib.PubSub.Events.OnLogArgs;
+
+namespace Strem.Twitch.Services.Client;
+
+class ObservableTwitchPubSub : IObservableTwitchPubSub
+{
+    public ITwitchPubSub PubSub { get; }
+    
+/// <summary>Occurs when [on ban].</summary>
+    public IObservable<OnBanArgs> OnBan { get; private set; }
+
+    /// <summary>Occurs when [on bits received].</summary>
+    public IObservable<OnBitsReceivedArgs> OnBitsReceived { get; private set; }
+
+    /// <summary>Occurs when [on channel extension broadcast].</summary>
+    public IObservable<OnChannelExtensionBroadcastArgs> OnChannelExtensionBroadcast { get; private set; }
+
+    /// <summary>Occurs when [on channel subscription].</summary>
+    public IObservable<OnChannelSubscriptionArgs> OnChannelSubscription { get; private set; }
+
+    /// <summary>Occurs when [on clear].</summary>
+    public IObservable<OnClearArgs> OnClear { get; private set; }
+
+    /// <summary>Occurs when [on emote only].</summary>
+    public IObservable<OnEmoteOnlyArgs> OnEmoteOnly { get; private set; }
+
+    /// <summary>Occurs when [on emote only off].</summary>
+    public IObservable<OnEmoteOnlyOffArgs> OnEmoteOnlyOff { get; private set; }
+
+    /// <summary>Occurs when [on follow].</summary>
+    public IObservable<OnFollowArgs> OnFollow { get; private set; }
+
+    /// <summary>Occurs when [on host].</summary>
+    public IObservable<OnHostArgs> OnHost { get; private set; }
+
+    /// <summary>Occurs when [on message deleted].</summary>
+    public IObservable<OnMessageDeletedArgs> OnMessageDeleted { get; private set; }
+
+    /// <summary>Occurs when [on listen response].</summary>
+    public IObservable<OnListenResponseArgs> OnListenResponse { get; private set; }
+
+    /// <summary>Occurs when [on pub sub service closed].</summary>
+    public IObservable<Unit> OnPubSubServiceClosed { get; private set; }
+
+    /// <summary>Occurs when [on pub sub service connected].</summary>
+    public IObservable<Unit> OnPubSubServiceConnected { get; private set; }
+
+    /// <summary>Occurs when [on pub sub service error].</summary>
+    public IObservable<OnPubSubServiceErrorArgs> OnPubSubServiceError { get; private set; }
+
+    /// <summary>Occurs when [on R9K beta].</summary>
+    public IObservable<OnR9kBetaArgs> OnR9kBeta { get; private set; }
+
+    /// <summary>Occurs when [on R9K beta off].</summary>
+    public IObservable<OnR9kBetaOffArgs> OnR9kBetaOff { get; private set; }
+
+    /// <summary>Occurs when [on stream down].</summary>
+    public IObservable<OnStreamDownArgs> OnStreamDown { get; private set; }
+
+    /// <summary>Occurs when [on stream up].</summary>
+    public IObservable<OnStreamUpArgs> OnStreamUp { get; private set; }
+
+    /// <summary>Occurs when [on subscribers only].</summary>
+    public IObservable<OnSubscribersOnlyArgs> OnSubscribersOnly { get; private set; }
+
+    /// <summary>Occurs when [on subscribers only off].</summary>
+    public IObservable<OnSubscribersOnlyOffArgs> OnSubscribersOnlyOff { get; private set; }
+
+    /// <summary>Occurs when [on timeout].</summary>
+    public IObservable<OnTimeoutArgs> OnTimeout { get; private set; }
+
+    /// <summary>Occurs when [on unban].</summary>
+    public IObservable<OnUnbanArgs> OnUnban { get; private set; }
+
+    /// <summary>Occurs when [on untimeout].</summary>
+    public IObservable<OnUntimeoutArgs> OnUntimeout { get; private set; }
+
+    /// <summary>Occurs when [on view count].</summary>
+    public IObservable<OnViewCountArgs> OnViewCount { get; private set; }
+
+    /// <summary>Occurs when [on whisper].</summary>
+    public IObservable<OnWhisperArgs> OnWhisper { get; private set; }
+
+    /// <summary>Occurs when [on reward created]</summary>
+    public IObservable<OnCustomRewardCreatedArgs> OnCustomRewardCreated { get; private set; }
+
+    /// <summary>Occurs when [on reward updated]</summary>
+    public IObservable<OnCustomRewardUpdatedArgs> OnCustomRewardUpdated { get; private set; }
+
+    /// <summary>Occurs when [on reward deleted]</summary>
+    public IObservable<OnCustomRewardDeletedArgs> OnCustomRewardDeleted { get; private set; }
+
+    /// <summary>Occurs when [on reward redeemed]</summary>
+    public IObservable<OnRewardRedeemedArgs> OnRewardRedeemed { get; private set; }
+
+    /// <summary>Occurs when [on leaderboard subs].</summary>
+    public IObservable<OnLeaderboardEventArgs> OnLeaderboardSubs { get; private set; }
+
+    /// <summary>Occurs when [on leaderboard bits].</summary>
+    public IObservable<OnLeaderboardEventArgs> OnLeaderboardBits { get; private set; }
+
+    /// <summary>Occurs when [on raid update]</summary>
+    public IObservable<OnRaidUpdateArgs> OnRaidUpdate { get; private set; }
+
+    /// <summary>Occurs when [on raid update v2]</summary>
+    public IObservable<OnRaidUpdateV2Args> OnRaidUpdateV2 { get; private set; }
+
+    /// <summary>Occurs when [on raid go]</summary>
+    public IObservable<OnRaidGoArgs> OnRaidGo { get; private set; }
+
+    /// <summary>Occurs when [on log].</summary>
+    public IObservable<OnLogArgs> OnLog { get; private set; }
+
+    /// <summary>Occurs when [on commercial].</summary>
+    public IObservable<OnCommercialArgs> OnCommercial { get; private set; }
+
+    /// <summary>Occurs when [on prediction].</summary>
+    public IObservable<OnPredictionArgs> OnPrediction { get; private set; }
+
+    public ObservableTwitchPubSub(ITwitchPubSub pubSub)
+    {
+        PubSub = pubSub;
+        SetupObservables();
+    }
+
+    private void SetupObservables()
+    {
+        OnBan = Observable.FromEventPattern<OnBanArgs>(
+                e => PubSub.OnBan += e,
+                e => PubSub.OnBan -= e)
+            .Select(x => x.EventArgs);
+        
+        // Todo: Add More Here
+    }
+}
\ No newline at end of file
diff --git a/src/Strem.Twitch/Strem.Twitch.csproj b/src/Strem.Twitch/Strem.Twitch.csproj
index 203531b..4f69ac0 100644
--- a/src/Strem.Twitch/Strem.Twitch.csproj
+++ b/src/Strem.Twitch/Strem.Twitch.csproj
@@ -11,7 +11,7 @@
       <PackageReference Include="Newtonsoft.Json" Version="13.0.1" />
       <PackageReference Include="RestSharp" Version="108.0.1" />
       <PackageReference Include="System.Reactive" Version="5.0.0" />
-      <PackageReference Include="TwitchLib" Version="3.3.0" />
+      <PackageReference Include="TwitchLib" Version="3.4.1" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/Strem.UI/Pages/Test.razor b/src/Strem.UI/Pages/Test.razor
index 998840b..48110a8 100644
--- a/src/Strem.UI/Pages/Test.razor
+++ b/src/Strem.UI/Pages/Test.razor
@@ -1,5 +1,8 @@
 @page "/test"
 @using Strem.Core.Types
+@using Strem.OBS.Services.Client
+
+@inject IObservableOBSClient ObsClient;
 
 <div class="container is-fullwidth">
     <div class="box">
@@ -39,4 +42,10 @@
     public TimeUnitType UnitType { get; set; }
     public string ValueType { get; set; }
 
+    protected override async Task OnInitializedAsync()
+    {
+        var result = await ObsClient.GetSourcesList();
+        result.Select(x => x.Name).Distinct();
+    }
+
 }
\ No newline at end of file
diff --git a/src/Strem/wwwroot/css/animate.css b/src/Strem/wwwroot/css/animate.css
new file mode 100644
index 0000000..59b824c
--- /dev/null
+++ b/src/Strem/wwwroot/css/animate.css
@@ -0,0 +1,7 @@
+@charset "UTF-8";/*!
+ * animate.css - https://animate.style/
+ * Version - 4.1.1
+ * Licensed under the MIT license - http://opensource.org/licenses/MIT
+ *
+ * Copyright (c) 2020 Animate.css
+ */:root{--animate-duration:1s;--animate-delay:1s;--animate-repeat:1}.animate__animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-duration:var(--animate-duration);animation-duration:var(--animate-duration);-webkit-animation-fill-mode:both;animation-fill-mode:both}.animate__animated.animate__infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.animate__animated.animate__repeat-1{-webkit-animation-iteration-count:1;animation-iteration-count:1;-webkit-animation-iteration-count:var(--animate-repeat);animation-iteration-count:var(--animate-repeat)}.animate__animated.animate__repeat-2{-webkit-animation-iteration-count:2;animation-iteration-count:2;-webkit-animation-iteration-count:calc(var(--animate-repeat)*2);animation-iteration-count:calc(var(--animate-repeat)*2)}.animate__animated.animate__repeat-3{-webkit-animation-iteration-count:3;animation-iteration-count:3;-webkit-animation-iteration-count:calc(var(--animate-repeat)*3);animation-iteration-count:calc(var(--animate-repeat)*3)}.animate__animated.animate__delay-1s{-webkit-animation-delay:1s;animation-delay:1s;-webkit-animation-delay:var(--animate-delay);animation-delay:var(--animate-delay)}.animate__animated.animate__delay-2s{-webkit-animation-delay:2s;animation-delay:2s;-webkit-animation-delay:calc(var(--animate-delay)*2);animation-delay:calc(var(--animate-delay)*2)}.animate__animated.animate__delay-3s{-webkit-animation-delay:3s;animation-delay:3s;-webkit-animation-delay:calc(var(--animate-delay)*3);animation-delay:calc(var(--animate-delay)*3)}.animate__animated.animate__delay-4s{-webkit-animation-delay:4s;animation-delay:4s;-webkit-animation-delay:calc(var(--animate-delay)*4);animation-delay:calc(var(--animate-delay)*4)}.animate__animated.animate__delay-5s{-webkit-animation-delay:5s;animation-delay:5s;-webkit-animation-delay:calc(var(--animate-delay)*5);animation-delay:calc(var(--animate-delay)*5)}.animate__animated.animate__faster{-webkit-animation-duration:.5s;animation-duration:.5s;-webkit-animation-duration:calc(var(--animate-duration)/2);animation-duration:calc(var(--animate-duration)/2)}.animate__animated.animate__fast{-webkit-animation-duration:.8s;animation-duration:.8s;-webkit-animation-duration:calc(var(--animate-duration)*0.8);animation-duration:calc(var(--animate-duration)*0.8)}.animate__animated.animate__slow{-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-duration:calc(var(--animate-duration)*2);animation-duration:calc(var(--animate-duration)*2)}.animate__animated.animate__slower{-webkit-animation-duration:3s;animation-duration:3s;-webkit-animation-duration:calc(var(--animate-duration)*3);animation-duration:calc(var(--animate-duration)*3)}@media (prefers-reduced-motion:reduce),print{.animate__animated{-webkit-animation-duration:1ms!important;animation-duration:1ms!important;-webkit-transition-duration:1ms!important;transition-duration:1ms!important;-webkit-animation-iteration-count:1!important;animation-iteration-count:1!important}.animate__animated[class*=Out]{opacity:0}}@-webkit-keyframes bounce{0%,20%,53%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translateZ(0);transform:translateZ(0)}40%,43%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06);-webkit-transform:translate3d(0,-30px,0) scaleY(1.1);transform:translate3d(0,-30px,0) scaleY(1.1)}70%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06);-webkit-transform:translate3d(0,-15px,0) scaleY(1.05);transform:translate3d(0,-15px,0) scaleY(1.05)}80%{-webkit-transition-timing-function:cubic-bezier(.215,.61,.355,1);transition-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translateZ(0) scaleY(.95);transform:translateZ(0) scaleY(.95)}90%{-webkit-transform:translate3d(0,-4px,0) scaleY(1.02);transform:translate3d(0,-4px,0) scaleY(1.02)}}@keyframes bounce{0%,20%,53%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translateZ(0);transform:translateZ(0)}40%,43%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06);-webkit-transform:translate3d(0,-30px,0) scaleY(1.1);transform:translate3d(0,-30px,0) scaleY(1.1)}70%{-webkit-animation-timing-function:cubic-bezier(.755,.05,.855,.06);animation-timing-function:cubic-bezier(.755,.05,.855,.06);-webkit-transform:translate3d(0,-15px,0) scaleY(1.05);transform:translate3d(0,-15px,0) scaleY(1.05)}80%{-webkit-transition-timing-function:cubic-bezier(.215,.61,.355,1);transition-timing-function:cubic-bezier(.215,.61,.355,1);-webkit-transform:translateZ(0) scaleY(.95);transform:translateZ(0) scaleY(.95)}90%{-webkit-transform:translate3d(0,-4px,0) scaleY(1.02);transform:translate3d(0,-4px,0) scaleY(1.02)}}.animate__bounce{-webkit-animation-name:bounce;animation-name:bounce;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}@keyframes flash{0%,50%,to{opacity:1}25%,75%{opacity:0}}.animate__flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes pulse{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}50%{-webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}.animate__pulse{-webkit-animation-name:pulse;animation-name:pulse;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}@-webkit-keyframes rubberBand{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes rubberBand{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}.animate__rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand}@-webkit-keyframes shakeX{0%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}@keyframes shakeX{0%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(-10px,0,0);transform:translate3d(-10px,0,0)}20%,40%,60%,80%{-webkit-transform:translate3d(10px,0,0);transform:translate3d(10px,0,0)}}.animate__shakeX{-webkit-animation-name:shakeX;animation-name:shakeX}@-webkit-keyframes shakeY{0%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}20%,40%,60%,80%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}}@keyframes shakeY{0%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}20%,40%,60%,80%{-webkit-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}}.animate__shakeY{-webkit-animation-name:shakeY;animation-name:shakeY}@-webkit-keyframes headShake{0%{-webkit-transform:translateX(0);transform:translateX(0)}6.5%{-webkit-transform:translateX(-6px) rotateY(-9deg);transform:translateX(-6px) rotateY(-9deg)}18.5%{-webkit-transform:translateX(5px) rotateY(7deg);transform:translateX(5px) rotateY(7deg)}31.5%{-webkit-transform:translateX(-3px) rotateY(-5deg);transform:translateX(-3px) rotateY(-5deg)}43.5%{-webkit-transform:translateX(2px) rotateY(3deg);transform:translateX(2px) rotateY(3deg)}50%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes headShake{0%{-webkit-transform:translateX(0);transform:translateX(0)}6.5%{-webkit-transform:translateX(-6px) rotateY(-9deg);transform:translateX(-6px) rotateY(-9deg)}18.5%{-webkit-transform:translateX(5px) rotateY(7deg);transform:translateX(5px) rotateY(7deg)}31.5%{-webkit-transform:translateX(-3px) rotateY(-5deg);transform:translateX(-3px) rotateY(-5deg)}43.5%{-webkit-transform:translateX(2px) rotateY(3deg);transform:translateX(2px) rotateY(3deg)}50%{-webkit-transform:translateX(0);transform:translateX(0)}}.animate__headShake{-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-name:headShake;animation-name:headShake}@-webkit-keyframes swing{20%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}to{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}@keyframes swing{20%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}to{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}.animate__swing{-webkit-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}@-webkit-keyframes tada{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate(-3deg);transform:scale3d(.9,.9,.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(3deg);transform:scale3d(1.1,1.1,1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(-3deg);transform:scale3d(1.1,1.1,1.1) rotate(-3deg)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes tada{0%{-webkit-transform:scaleX(1);transform:scaleX(1)}10%,20%{-webkit-transform:scale3d(.9,.9,.9) rotate(-3deg);transform:scale3d(.9,.9,.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(3deg);transform:scale3d(1.1,1.1,1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale3d(1.1,1.1,1.1) rotate(-3deg);transform:scale3d(1.1,1.1,1.1) rotate(-3deg)}to{-webkit-transform:scaleX(1);transform:scaleX(1)}}.animate__tada{-webkit-animation-name:tada;animation-name:tada}@-webkit-keyframes wobble{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}15%{-webkit-transform:translate3d(-25%,0,0) rotate(-5deg);transform:translate3d(-25%,0,0) rotate(-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate(3deg);transform:translate3d(20%,0,0) rotate(3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate(-3deg);transform:translate3d(-15%,0,0) rotate(-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate(2deg);transform:translate3d(10%,0,0) rotate(2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate(-1deg);transform:translate3d(-5%,0,0) rotate(-1deg)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes wobble{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}15%{-webkit-transform:translate3d(-25%,0,0) rotate(-5deg);transform:translate3d(-25%,0,0) rotate(-5deg)}30%{-webkit-transform:translate3d(20%,0,0) rotate(3deg);transform:translate3d(20%,0,0) rotate(3deg)}45%{-webkit-transform:translate3d(-15%,0,0) rotate(-3deg);transform:translate3d(-15%,0,0) rotate(-3deg)}60%{-webkit-transform:translate3d(10%,0,0) rotate(2deg);transform:translate3d(10%,0,0) rotate(2deg)}75%{-webkit-transform:translate3d(-5%,0,0) rotate(-1deg);transform:translate3d(-5%,0,0) rotate(-1deg)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__wobble{-webkit-animation-name:wobble;animation-name:wobble}@-webkit-keyframes jello{0%,11.1%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}22.2%{-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);transform:skewX(-12.5deg) skewY(-12.5deg)}33.3%{-webkit-transform:skewX(6.25deg) skewY(6.25deg);transform:skewX(6.25deg) skewY(6.25deg)}44.4%{-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);transform:skewX(-3.125deg) skewY(-3.125deg)}55.5%{-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);transform:skewX(1.5625deg) skewY(1.5625deg)}66.6%{-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);transform:skewX(-.78125deg) skewY(-.78125deg)}77.7%{-webkit-transform:skewX(.390625deg) skewY(.390625deg);transform:skewX(.390625deg) skewY(.390625deg)}88.8%{-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);transform:skewX(-.1953125deg) skewY(-.1953125deg)}}@keyframes jello{0%,11.1%,to{-webkit-transform:translateZ(0);transform:translateZ(0)}22.2%{-webkit-transform:skewX(-12.5deg) skewY(-12.5deg);transform:skewX(-12.5deg) skewY(-12.5deg)}33.3%{-webkit-transform:skewX(6.25deg) skewY(6.25deg);transform:skewX(6.25deg) skewY(6.25deg)}44.4%{-webkit-transform:skewX(-3.125deg) skewY(-3.125deg);transform:skewX(-3.125deg) skewY(-3.125deg)}55.5%{-webkit-transform:skewX(1.5625deg) skewY(1.5625deg);transform:skewX(1.5625deg) skewY(1.5625deg)}66.6%{-webkit-transform:skewX(-.78125deg) skewY(-.78125deg);transform:skewX(-.78125deg) skewY(-.78125deg)}77.7%{-webkit-transform:skewX(.390625deg) skewY(.390625deg);transform:skewX(.390625deg) skewY(.390625deg)}88.8%{-webkit-transform:skewX(-.1953125deg) skewY(-.1953125deg);transform:skewX(-.1953125deg) skewY(-.1953125deg)}}.animate__jello{-webkit-animation-name:jello;animation-name:jello;-webkit-transform-origin:center;transform-origin:center}@-webkit-keyframes heartBeat{0%{-webkit-transform:scale(1);transform:scale(1)}14%{-webkit-transform:scale(1.3);transform:scale(1.3)}28%{-webkit-transform:scale(1);transform:scale(1)}42%{-webkit-transform:scale(1.3);transform:scale(1.3)}70%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes heartBeat{0%{-webkit-transform:scale(1);transform:scale(1)}14%{-webkit-transform:scale(1.3);transform:scale(1.3)}28%{-webkit-transform:scale(1);transform:scale(1)}42%{-webkit-transform:scale(1.3);transform:scale(1.3)}70%{-webkit-transform:scale(1);transform:scale(1)}}.animate__heartBeat{-webkit-animation-name:heartBeat;animation-name:heartBeat;-webkit-animation-duration:1.3s;animation-duration:1.3s;-webkit-animation-duration:calc(var(--animate-duration)*1.3);animation-duration:calc(var(--animate-duration)*1.3);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}@-webkit-keyframes backInDown{0%{-webkit-transform:translateY(-1200px) scale(.7);transform:translateY(-1200px) scale(.7);opacity:.7}80%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:.7}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes backInDown{0%{-webkit-transform:translateY(-1200px) scale(.7);transform:translateY(-1200px) scale(.7);opacity:.7}80%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:.7}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.animate__backInDown{-webkit-animation-name:backInDown;animation-name:backInDown}@-webkit-keyframes backInLeft{0%{-webkit-transform:translateX(-2000px) scale(.7);transform:translateX(-2000px) scale(.7);opacity:.7}80%{-webkit-transform:translateX(0) scale(.7);transform:translateX(0) scale(.7);opacity:.7}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes backInLeft{0%{-webkit-transform:translateX(-2000px) scale(.7);transform:translateX(-2000px) scale(.7);opacity:.7}80%{-webkit-transform:translateX(0) scale(.7);transform:translateX(0) scale(.7);opacity:.7}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.animate__backInLeft{-webkit-animation-name:backInLeft;animation-name:backInLeft}@-webkit-keyframes backInRight{0%{-webkit-transform:translateX(2000px) scale(.7);transform:translateX(2000px) scale(.7);opacity:.7}80%{-webkit-transform:translateX(0) scale(.7);transform:translateX(0) scale(.7);opacity:.7}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes backInRight{0%{-webkit-transform:translateX(2000px) scale(.7);transform:translateX(2000px) scale(.7);opacity:.7}80%{-webkit-transform:translateX(0) scale(.7);transform:translateX(0) scale(.7);opacity:.7}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.animate__backInRight{-webkit-animation-name:backInRight;animation-name:backInRight}@-webkit-keyframes backInUp{0%{-webkit-transform:translateY(1200px) scale(.7);transform:translateY(1200px) scale(.7);opacity:.7}80%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:.7}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes backInUp{0%{-webkit-transform:translateY(1200px) scale(.7);transform:translateY(1200px) scale(.7);opacity:.7}80%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:.7}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.animate__backInUp{-webkit-animation-name:backInUp;animation-name:backInUp}@-webkit-keyframes backOutDown{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:.7}to{-webkit-transform:translateY(700px) scale(.7);transform:translateY(700px) scale(.7);opacity:.7}}@keyframes backOutDown{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:.7}to{-webkit-transform:translateY(700px) scale(.7);transform:translateY(700px) scale(.7);opacity:.7}}.animate__backOutDown{-webkit-animation-name:backOutDown;animation-name:backOutDown}@-webkit-keyframes backOutLeft{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translateX(0) scale(.7);transform:translateX(0) scale(.7);opacity:.7}to{-webkit-transform:translateX(-2000px) scale(.7);transform:translateX(-2000px) scale(.7);opacity:.7}}@keyframes backOutLeft{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translateX(0) scale(.7);transform:translateX(0) scale(.7);opacity:.7}to{-webkit-transform:translateX(-2000px) scale(.7);transform:translateX(-2000px) scale(.7);opacity:.7}}.animate__backOutLeft{-webkit-animation-name:backOutLeft;animation-name:backOutLeft}@-webkit-keyframes backOutRight{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translateX(0) scale(.7);transform:translateX(0) scale(.7);opacity:.7}to{-webkit-transform:translateX(2000px) scale(.7);transform:translateX(2000px) scale(.7);opacity:.7}}@keyframes backOutRight{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translateX(0) scale(.7);transform:translateX(0) scale(.7);opacity:.7}to{-webkit-transform:translateX(2000px) scale(.7);transform:translateX(2000px) scale(.7);opacity:.7}}.animate__backOutRight{-webkit-animation-name:backOutRight;animation-name:backOutRight}@-webkit-keyframes backOutUp{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:.7}to{-webkit-transform:translateY(-700px) scale(.7);transform:translateY(-700px) scale(.7);opacity:.7}}@keyframes backOutUp{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}20%{-webkit-transform:translateY(0) scale(.7);transform:translateY(0) scale(.7);opacity:.7}to{-webkit-transform:translateY(-700px) scale(.7);transform:translateY(-700px) scale(.7);opacity:.7}}.animate__backOutUp{-webkit-animation-name:backOutUp;animation-name:backOutUp}@-webkit-keyframes bounceIn{0%,20%,40%,60%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}to{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}}@keyframes bounceIn{0%,20%,40%,60%,80%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}20%{-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}40%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}60%{opacity:1;-webkit-transform:scale3d(1.03,1.03,1.03);transform:scale3d(1.03,1.03,1.03)}80%{-webkit-transform:scale3d(.97,.97,.97);transform:scale3d(.97,.97,.97)}to{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}}.animate__bounceIn{-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-duration:calc(var(--animate-duration)*0.75);animation-duration:calc(var(--animate-duration)*0.75);-webkit-animation-name:bounceIn;animation-name:bounceIn}@-webkit-keyframes bounceInDown{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0) scaleY(3);transform:translate3d(0,-3000px,0) scaleY(3)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0) scaleY(.9);transform:translate3d(0,25px,0) scaleY(.9)}75%{-webkit-transform:translate3d(0,-10px,0) scaleY(.95);transform:translate3d(0,-10px,0) scaleY(.95)}90%{-webkit-transform:translate3d(0,5px,0) scaleY(.985);transform:translate3d(0,5px,0) scaleY(.985)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes bounceInDown{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,-3000px,0) scaleY(3);transform:translate3d(0,-3000px,0) scaleY(3)}60%{opacity:1;-webkit-transform:translate3d(0,25px,0) scaleY(.9);transform:translate3d(0,25px,0) scaleY(.9)}75%{-webkit-transform:translate3d(0,-10px,0) scaleY(.95);transform:translate3d(0,-10px,0) scaleY(.95)}90%{-webkit-transform:translate3d(0,5px,0) scaleY(.985);transform:translate3d(0,5px,0) scaleY(.985)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__bounceInDown{-webkit-animation-name:bounceInDown;animation-name:bounceInDown}@-webkit-keyframes bounceInLeft{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0) scaleX(3);transform:translate3d(-3000px,0,0) scaleX(3)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0) scaleX(1);transform:translate3d(25px,0,0) scaleX(1)}75%{-webkit-transform:translate3d(-10px,0,0) scaleX(.98);transform:translate3d(-10px,0,0) scaleX(.98)}90%{-webkit-transform:translate3d(5px,0,0) scaleX(.995);transform:translate3d(5px,0,0) scaleX(.995)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes bounceInLeft{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(-3000px,0,0) scaleX(3);transform:translate3d(-3000px,0,0) scaleX(3)}60%{opacity:1;-webkit-transform:translate3d(25px,0,0) scaleX(1);transform:translate3d(25px,0,0) scaleX(1)}75%{-webkit-transform:translate3d(-10px,0,0) scaleX(.98);transform:translate3d(-10px,0,0) scaleX(.98)}90%{-webkit-transform:translate3d(5px,0,0) scaleX(.995);transform:translate3d(5px,0,0) scaleX(.995)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__bounceInLeft{-webkit-animation-name:bounceInLeft;animation-name:bounceInLeft}@-webkit-keyframes bounceInRight{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(3000px,0,0) scaleX(3);transform:translate3d(3000px,0,0) scaleX(3)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0) scaleX(1);transform:translate3d(-25px,0,0) scaleX(1)}75%{-webkit-transform:translate3d(10px,0,0) scaleX(.98);transform:translate3d(10px,0,0) scaleX(.98)}90%{-webkit-transform:translate3d(-5px,0,0) scaleX(.995);transform:translate3d(-5px,0,0) scaleX(.995)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes bounceInRight{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(3000px,0,0) scaleX(3);transform:translate3d(3000px,0,0) scaleX(3)}60%{opacity:1;-webkit-transform:translate3d(-25px,0,0) scaleX(1);transform:translate3d(-25px,0,0) scaleX(1)}75%{-webkit-transform:translate3d(10px,0,0) scaleX(.98);transform:translate3d(10px,0,0) scaleX(.98)}90%{-webkit-transform:translate3d(-5px,0,0) scaleX(.995);transform:translate3d(-5px,0,0) scaleX(.995)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__bounceInRight{-webkit-animation-name:bounceInRight;animation-name:bounceInRight}@-webkit-keyframes bounceInUp{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,3000px,0) scaleY(5);transform:translate3d(0,3000px,0) scaleY(5)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0) scaleY(.9);transform:translate3d(0,-20px,0) scaleY(.9)}75%{-webkit-transform:translate3d(0,10px,0) scaleY(.95);transform:translate3d(0,10px,0) scaleY(.95)}90%{-webkit-transform:translate3d(0,-5px,0) scaleY(.985);transform:translate3d(0,-5px,0) scaleY(.985)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes bounceInUp{0%,60%,75%,90%,to{-webkit-animation-timing-function:cubic-bezier(.215,.61,.355,1);animation-timing-function:cubic-bezier(.215,.61,.355,1)}0%{opacity:0;-webkit-transform:translate3d(0,3000px,0) scaleY(5);transform:translate3d(0,3000px,0) scaleY(5)}60%{opacity:1;-webkit-transform:translate3d(0,-20px,0) scaleY(.9);transform:translate3d(0,-20px,0) scaleY(.9)}75%{-webkit-transform:translate3d(0,10px,0) scaleY(.95);transform:translate3d(0,10px,0) scaleY(.95)}90%{-webkit-transform:translate3d(0,-5px,0) scaleY(.985);transform:translate3d(0,-5px,0) scaleY(.985)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__bounceInUp{-webkit-animation-name:bounceInUp;animation-name:bounceInUp}@-webkit-keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}to{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}@keyframes bounceOut{20%{-webkit-transform:scale3d(.9,.9,.9);transform:scale3d(.9,.9,.9)}50%,55%{opacity:1;-webkit-transform:scale3d(1.1,1.1,1.1);transform:scale3d(1.1,1.1,1.1)}to{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}}.animate__bounceOut{-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-duration:calc(var(--animate-duration)*0.75);animation-duration:calc(var(--animate-duration)*0.75);-webkit-animation-name:bounceOut;animation-name:bounceOut}@-webkit-keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0) scaleY(.985);transform:translate3d(0,10px,0) scaleY(.985)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0) scaleY(.9);transform:translate3d(0,-20px,0) scaleY(.9)}to{opacity:0;-webkit-transform:translate3d(0,2000px,0) scaleY(3);transform:translate3d(0,2000px,0) scaleY(3)}}@keyframes bounceOutDown{20%{-webkit-transform:translate3d(0,10px,0) scaleY(.985);transform:translate3d(0,10px,0) scaleY(.985)}40%,45%{opacity:1;-webkit-transform:translate3d(0,-20px,0) scaleY(.9);transform:translate3d(0,-20px,0) scaleY(.9)}to{opacity:0;-webkit-transform:translate3d(0,2000px,0) scaleY(3);transform:translate3d(0,2000px,0) scaleY(3)}}.animate__bounceOutDown{-webkit-animation-name:bounceOutDown;animation-name:bounceOutDown}@-webkit-keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0) scaleX(.9);transform:translate3d(20px,0,0) scaleX(.9)}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0) scaleX(2);transform:translate3d(-2000px,0,0) scaleX(2)}}@keyframes bounceOutLeft{20%{opacity:1;-webkit-transform:translate3d(20px,0,0) scaleX(.9);transform:translate3d(20px,0,0) scaleX(.9)}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0) scaleX(2);transform:translate3d(-2000px,0,0) scaleX(2)}}.animate__bounceOutLeft{-webkit-animation-name:bounceOutLeft;animation-name:bounceOutLeft}@-webkit-keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0) scaleX(.9);transform:translate3d(-20px,0,0) scaleX(.9)}to{opacity:0;-webkit-transform:translate3d(2000px,0,0) scaleX(2);transform:translate3d(2000px,0,0) scaleX(2)}}@keyframes bounceOutRight{20%{opacity:1;-webkit-transform:translate3d(-20px,0,0) scaleX(.9);transform:translate3d(-20px,0,0) scaleX(.9)}to{opacity:0;-webkit-transform:translate3d(2000px,0,0) scaleX(2);transform:translate3d(2000px,0,0) scaleX(2)}}.animate__bounceOutRight{-webkit-animation-name:bounceOutRight;animation-name:bounceOutRight}@-webkit-keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0) scaleY(.985);transform:translate3d(0,-10px,0) scaleY(.985)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0) scaleY(.9);transform:translate3d(0,20px,0) scaleY(.9)}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0) scaleY(3);transform:translate3d(0,-2000px,0) scaleY(3)}}@keyframes bounceOutUp{20%{-webkit-transform:translate3d(0,-10px,0) scaleY(.985);transform:translate3d(0,-10px,0) scaleY(.985)}40%,45%{opacity:1;-webkit-transform:translate3d(0,20px,0) scaleY(.9);transform:translate3d(0,20px,0) scaleY(.9)}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0) scaleY(3);transform:translate3d(0,-2000px,0) scaleY(3)}}.animate__bounceOutUp{-webkit-animation-name:bounceOutUp;animation-name:bounceOutUp}@-webkit-keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.animate__fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInDown{0%{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__fadeInDown{-webkit-animation-name:fadeInDown;animation-name:fadeInDown}@-webkit-keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__fadeInDownBig{-webkit-animation-name:fadeInDownBig;animation-name:fadeInDownBig}@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig}@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInRight{0%{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__fadeInRight{-webkit-animation-name:fadeInRight;animation-name:fadeInRight}@-webkit-keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__fadeInRightBig{-webkit-animation-name:fadeInRightBig;animation-name:fadeInRightBig}@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInUp{0%{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__fadeInUpBig{-webkit-animation-name:fadeInUpBig;animation-name:fadeInUpBig}@-webkit-keyframes fadeInTopLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,-100%,0);transform:translate3d(-100%,-100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInTopLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,-100%,0);transform:translate3d(-100%,-100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__fadeInTopLeft{-webkit-animation-name:fadeInTopLeft;animation-name:fadeInTopLeft}@-webkit-keyframes fadeInTopRight{0%{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInTopRight{0%{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__fadeInTopRight{-webkit-animation-name:fadeInTopRight;animation-name:fadeInTopRight}@-webkit-keyframes fadeInBottomLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,100%,0);transform:translate3d(-100%,100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInBottomLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,100%,0);transform:translate3d(-100%,100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__fadeInBottomLeft{-webkit-animation-name:fadeInBottomLeft;animation-name:fadeInBottomLeft}@-webkit-keyframes fadeInBottomRight{0%{opacity:0;-webkit-transform:translate3d(100%,100%,0);transform:translate3d(100%,100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInBottomRight{0%{opacity:0;-webkit-transform:translate3d(100%,100%,0);transform:translate3d(100%,100%,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__fadeInBottomRight{-webkit-animation-name:fadeInBottomRight;animation-name:fadeInBottomRight}@-webkit-keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.animate__fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOutDown{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes fadeOutDown{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.animate__fadeOutDown{-webkit-animation-name:fadeOutDown;animation-name:fadeOutDown}@-webkit-keyframes fadeOutDownBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}@keyframes fadeOutDownBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,2000px,0);transform:translate3d(0,2000px,0)}}.animate__fadeOutDownBig{-webkit-animation-name:fadeOutDownBig;animation-name:fadeOutDownBig}@-webkit-keyframes fadeOutLeft{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes fadeOutLeft{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.animate__fadeOutLeft{-webkit-animation-name:fadeOutLeft;animation-name:fadeOutLeft}@-webkit-keyframes fadeOutLeftBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}@keyframes fadeOutLeftBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}}.animate__fadeOutLeftBig{-webkit-animation-name:fadeOutLeftBig;animation-name:fadeOutLeftBig}@-webkit-keyframes fadeOutRight{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes fadeOutRight{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.animate__fadeOutRight{-webkit-animation-name:fadeOutRight;animation-name:fadeOutRight}@-webkit-keyframes fadeOutRightBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}@keyframes fadeOutRightBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(2000px,0,0);transform:translate3d(2000px,0,0)}}.animate__fadeOutRightBig{-webkit-animation-name:fadeOutRightBig;animation-name:fadeOutRightBig}@-webkit-keyframes fadeOutUp{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes fadeOutUp{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.animate__fadeOutUp{-webkit-animation-name:fadeOutUp;animation-name:fadeOutUp}@-webkit-keyframes fadeOutUpBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}@keyframes fadeOutUpBig{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(0,-2000px,0);transform:translate3d(0,-2000px,0)}}.animate__fadeOutUpBig{-webkit-animation-name:fadeOutUpBig;animation-name:fadeOutUpBig}@-webkit-keyframes fadeOutTopLeft{0%{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}to{opacity:0;-webkit-transform:translate3d(-100%,-100%,0);transform:translate3d(-100%,-100%,0)}}@keyframes fadeOutTopLeft{0%{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}to{opacity:0;-webkit-transform:translate3d(-100%,-100%,0);transform:translate3d(-100%,-100%,0)}}.animate__fadeOutTopLeft{-webkit-animation-name:fadeOutTopLeft;animation-name:fadeOutTopLeft}@-webkit-keyframes fadeOutTopRight{0%{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}to{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)}}@keyframes fadeOutTopRight{0%{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}to{opacity:0;-webkit-transform:translate3d(100%,-100%,0);transform:translate3d(100%,-100%,0)}}.animate__fadeOutTopRight{-webkit-animation-name:fadeOutTopRight;animation-name:fadeOutTopRight}@-webkit-keyframes fadeOutBottomRight{0%{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}to{opacity:0;-webkit-transform:translate3d(100%,100%,0);transform:translate3d(100%,100%,0)}}@keyframes fadeOutBottomRight{0%{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}to{opacity:0;-webkit-transform:translate3d(100%,100%,0);transform:translate3d(100%,100%,0)}}.animate__fadeOutBottomRight{-webkit-animation-name:fadeOutBottomRight;animation-name:fadeOutBottomRight}@-webkit-keyframes fadeOutBottomLeft{0%{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}to{opacity:0;-webkit-transform:translate3d(-100%,100%,0);transform:translate3d(-100%,100%,0)}}@keyframes fadeOutBottomLeft{0%{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}to{opacity:0;-webkit-transform:translate3d(-100%,100%,0);transform:translate3d(-100%,100%,0)}}.animate__fadeOutBottomLeft{-webkit-animation-name:fadeOutBottomLeft;animation-name:fadeOutBottomLeft}@-webkit-keyframes flip{0%{-webkit-transform:perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn);transform:perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg);transform:perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg);transform:perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95) translateZ(0) rotateY(0deg);transform:perspective(400px) scale3d(.95,.95,.95) translateZ(0) rotateY(0deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}to{-webkit-transform:perspective(400px) scaleX(1) translateZ(0) rotateY(0deg);transform:perspective(400px) scaleX(1) translateZ(0) rotateY(0deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}@keyframes flip{0%{-webkit-transform:perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn);transform:perspective(400px) scaleX(1) translateZ(0) rotateY(-1turn);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg);transform:perspective(400px) scaleX(1) translateZ(150px) rotateY(-190deg);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg);transform:perspective(400px) scaleX(1) translateZ(150px) rotateY(-170deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) scale3d(.95,.95,.95) translateZ(0) rotateY(0deg);transform:perspective(400px) scale3d(.95,.95,.95) translateZ(0) rotateY(0deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}to{-webkit-transform:perspective(400px) scaleX(1) translateZ(0) rotateY(0deg);transform:perspective(400px) scaleX(1) translateZ(0) rotateY(0deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}.animate__animated.animate__flip{-webkit-backface-visibility:visible;backface-visibility:visible;-webkit-animation-name:flip;animation-name:flip}@-webkit-keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotateX(-20deg);transform:perspective(400px) rotateX(-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotateX(-5deg);transform:perspective(400px) rotateX(-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotateX(-20deg);transform:perspective(400px) rotateX(-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotateX(-5deg);transform:perspective(400px) rotateX(-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}.animate__flipInX{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX}@-webkit-keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotateY(-20deg);transform:perspective(400px) rotateY(-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotateY(10deg);transform:perspective(400px) rotateY(10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotateY(-5deg);transform:perspective(400px) rotateY(-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}@keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in;opacity:0}40%{-webkit-transform:perspective(400px) rotateY(-20deg);transform:perspective(400px) rotateY(-20deg);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}60%{-webkit-transform:perspective(400px) rotateY(10deg);transform:perspective(400px) rotateY(10deg);opacity:1}80%{-webkit-transform:perspective(400px) rotateY(-5deg);transform:perspective(400px) rotateY(-5deg)}to{-webkit-transform:perspective(400px);transform:perspective(400px)}}.animate__flipInY{-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInY;animation-name:flipInY}@-webkit-keyframes flipOutX{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotateX(-20deg);transform:perspective(400px) rotateX(-20deg);opacity:1}to{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}}@keyframes flipOutX{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotateX(-20deg);transform:perspective(400px) rotateX(-20deg);opacity:1}to{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}}.animate__flipOutX{-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-duration:calc(var(--animate-duration)*0.75);animation-duration:calc(var(--animate-duration)*0.75);-webkit-animation-name:flipOutX;animation-name:flipOutX;-webkit-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flipOutY{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotateY(-15deg);transform:perspective(400px) rotateY(-15deg);opacity:1}to{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}}@keyframes flipOutY{0%{-webkit-transform:perspective(400px);transform:perspective(400px)}30%{-webkit-transform:perspective(400px) rotateY(-15deg);transform:perspective(400px) rotateY(-15deg);opacity:1}to{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}}.animate__flipOutY{-webkit-animation-duration:.75s;animation-duration:.75s;-webkit-animation-duration:calc(var(--animate-duration)*0.75);animation-duration:calc(var(--animate-duration)*0.75);-webkit-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipOutY;animation-name:flipOutY}@-webkit-keyframes lightSpeedInRight{0%{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes lightSpeedInRight{0%{-webkit-transform:translate3d(100%,0,0) skewX(-30deg);transform:translate3d(100%,0,0) skewX(-30deg);opacity:0}60%{-webkit-transform:skewX(20deg);transform:skewX(20deg);opacity:1}80%{-webkit-transform:skewX(-5deg);transform:skewX(-5deg)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__lightSpeedInRight{-webkit-animation-name:lightSpeedInRight;animation-name:lightSpeedInRight;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightSpeedInLeft{0%{-webkit-transform:translate3d(-100%,0,0) skewX(30deg);transform:translate3d(-100%,0,0) skewX(30deg);opacity:0}60%{-webkit-transform:skewX(-20deg);transform:skewX(-20deg);opacity:1}80%{-webkit-transform:skewX(5deg);transform:skewX(5deg)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes lightSpeedInLeft{0%{-webkit-transform:translate3d(-100%,0,0) skewX(30deg);transform:translate3d(-100%,0,0) skewX(30deg);opacity:0}60%{-webkit-transform:skewX(-20deg);transform:skewX(-20deg);opacity:1}80%{-webkit-transform:skewX(5deg);transform:skewX(5deg)}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__lightSpeedInLeft{-webkit-animation-name:lightSpeedInLeft;animation-name:lightSpeedInLeft;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightSpeedOutRight{0%{opacity:1}to{-webkit-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}@keyframes lightSpeedOutRight{0%{opacity:1}to{-webkit-transform:translate3d(100%,0,0) skewX(30deg);transform:translate3d(100%,0,0) skewX(30deg);opacity:0}}.animate__lightSpeedOutRight{-webkit-animation-name:lightSpeedOutRight;animation-name:lightSpeedOutRight;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes lightSpeedOutLeft{0%{opacity:1}to{-webkit-transform:translate3d(-100%,0,0) skewX(-30deg);transform:translate3d(-100%,0,0) skewX(-30deg);opacity:0}}@keyframes lightSpeedOutLeft{0%{opacity:1}to{-webkit-transform:translate3d(-100%,0,0) skewX(-30deg);transform:translate3d(-100%,0,0) skewX(-30deg);opacity:0}}.animate__lightSpeedOutLeft{-webkit-animation-name:lightSpeedOutLeft;animation-name:lightSpeedOutLeft;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes rotateIn{0%{-webkit-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}to{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}@keyframes rotateIn{0%{-webkit-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}to{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}.animate__rotateIn{-webkit-animation-name:rotateIn;animation-name:rotateIn;-webkit-transform-origin:center;transform-origin:center}@-webkit-keyframes rotateInDownLeft{0%{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}to{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}@keyframes rotateInDownLeft{0%{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}to{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}.animate__rotateInDownLeft{-webkit-animation-name:rotateInDownLeft;animation-name:rotateInDownLeft;-webkit-transform-origin:left bottom;transform-origin:left bottom}@-webkit-keyframes rotateInDownRight{0%{-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}to{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}@keyframes rotateInDownRight{0%{-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}to{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}.animate__rotateInDownRight{-webkit-animation-name:rotateInDownRight;animation-name:rotateInDownRight;-webkit-transform-origin:right bottom;transform-origin:right bottom}@-webkit-keyframes rotateInUpLeft{0%{-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}to{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}@keyframes rotateInUpLeft{0%{-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}to{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}.animate__rotateInUpLeft{-webkit-animation-name:rotateInUpLeft;animation-name:rotateInUpLeft;-webkit-transform-origin:left bottom;transform-origin:left bottom}@-webkit-keyframes rotateInUpRight{0%{-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}to{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}@keyframes rotateInUpRight{0%{-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}to{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}.animate__rotateInUpRight{-webkit-animation-name:rotateInUpRight;animation-name:rotateInUpRight;-webkit-transform-origin:right bottom;transform-origin:right bottom}@-webkit-keyframes rotateOut{0%{opacity:1}to{-webkit-transform:rotate(200deg);transform:rotate(200deg);opacity:0}}@keyframes rotateOut{0%{opacity:1}to{-webkit-transform:rotate(200deg);transform:rotate(200deg);opacity:0}}.animate__rotateOut{-webkit-animation-name:rotateOut;animation-name:rotateOut;-webkit-transform-origin:center;transform-origin:center}@-webkit-keyframes rotateOutDownLeft{0%{opacity:1}to{-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}}@keyframes rotateOutDownLeft{0%{opacity:1}to{-webkit-transform:rotate(45deg);transform:rotate(45deg);opacity:0}}.animate__rotateOutDownLeft{-webkit-animation-name:rotateOutDownLeft;animation-name:rotateOutDownLeft;-webkit-transform-origin:left bottom;transform-origin:left bottom}@-webkit-keyframes rotateOutDownRight{0%{opacity:1}to{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}}@keyframes rotateOutDownRight{0%{opacity:1}to{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}}.animate__rotateOutDownRight{-webkit-animation-name:rotateOutDownRight;animation-name:rotateOutDownRight;-webkit-transform-origin:right bottom;transform-origin:right bottom}@-webkit-keyframes rotateOutUpLeft{0%{opacity:1}to{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}}@keyframes rotateOutUpLeft{0%{opacity:1}to{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);opacity:0}}.animate__rotateOutUpLeft{-webkit-animation-name:rotateOutUpLeft;animation-name:rotateOutUpLeft;-webkit-transform-origin:left bottom;transform-origin:left bottom}@-webkit-keyframes rotateOutUpRight{0%{opacity:1}to{-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}@keyframes rotateOutUpRight{0%{opacity:1}to{-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}.animate__rotateOutUpRight{-webkit-animation-name:rotateOutUpRight;animation-name:rotateOutUpRight;-webkit-transform-origin:right bottom;transform-origin:right bottom}@-webkit-keyframes hinge{0%{-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate(80deg);transform:rotate(80deg);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate(60deg);transform:rotate(60deg);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}to{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}@keyframes hinge{0%{-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate(80deg);transform:rotate(80deg);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%,80%{-webkit-transform:rotate(60deg);transform:rotate(60deg);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}to{-webkit-transform:translate3d(0,700px,0);transform:translate3d(0,700px,0);opacity:0}}.animate__hinge{-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-duration:calc(var(--animate-duration)*2);animation-duration:calc(var(--animate-duration)*2);-webkit-animation-name:hinge;animation-name:hinge;-webkit-transform-origin:top left;transform-origin:top left}@-webkit-keyframes jackInTheBox{0%{opacity:0;-webkit-transform:scale(.1) rotate(30deg);transform:scale(.1) rotate(30deg);-webkit-transform-origin:center bottom;transform-origin:center bottom}50%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}70%{-webkit-transform:rotate(3deg);transform:rotate(3deg)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes jackInTheBox{0%{opacity:0;-webkit-transform:scale(.1) rotate(30deg);transform:scale(.1) rotate(30deg);-webkit-transform-origin:center bottom;transform-origin:center bottom}50%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}70%{-webkit-transform:rotate(3deg);transform:rotate(3deg)}to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}.animate__jackInTheBox{-webkit-animation-name:jackInTheBox;animation-name:jackInTheBox}@-webkit-keyframes rollIn{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate(-120deg);transform:translate3d(-100%,0,0) rotate(-120deg)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes rollIn{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0) rotate(-120deg);transform:translate3d(-100%,0,0) rotate(-120deg)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__rollIn{-webkit-animation-name:rollIn;animation-name:rollIn}@-webkit-keyframes rollOut{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate(120deg);transform:translate3d(100%,0,0) rotate(120deg)}}@keyframes rollOut{0%{opacity:1}to{opacity:0;-webkit-transform:translate3d(100%,0,0) rotate(120deg);transform:translate3d(100%,0,0) rotate(120deg)}}.animate__rollOut{-webkit-animation-name:rollOut;animation-name:rollOut}@-webkit-keyframes zoomIn{0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}@keyframes zoomIn{0%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}50%{opacity:1}}.animate__zoomIn{-webkit-animation-name:zoomIn;animation-name:zoomIn}@-webkit-keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.animate__zoomInDown{-webkit-animation-name:zoomInDown;animation-name:zoomInDown}@-webkit-keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(-1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(10px,0,0);transform:scale3d(.475,.475,.475) translate3d(10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.animate__zoomInLeft{-webkit-animation-name:zoomInLeft;animation-name:zoomInLeft}@-webkit-keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);transform:scale3d(.1,.1,.1) translate3d(1000px,0,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);transform:scale3d(.475,.475,.475) translate3d(-10px,0,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.animate__zoomInRight{-webkit-animation-name:zoomInRight;animation-name:zoomInRight}@-webkit-keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);transform:scale3d(.1,.1,.1) translate3d(0,1000px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}60%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.animate__zoomInUp{-webkit-animation-name:zoomInUp;animation-name:zoomInUp}@-webkit-keyframes zoomOut{0%{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:0}}@keyframes zoomOut{0%{opacity:1}50%{opacity:0;-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)}to{opacity:0}}.animate__zoomOut{-webkit-animation-name:zoomOut;animation-name:zoomOut}@-webkit-keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);transform:scale3d(.475,.475,.475) translate3d(0,-60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,2000px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.animate__zoomOutDown{-webkit-animation-name:zoomOutDown;animation-name:zoomOutDown;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0)}}@keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(42px,0,0);transform:scale3d(.475,.475,.475) translate3d(42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(-2000px,0,0);transform:scale(.1) translate3d(-2000px,0,0)}}.animate__zoomOutLeft{-webkit-animation-name:zoomOutLeft;animation-name:zoomOutLeft;-webkit-transform-origin:left center;transform-origin:left center}@-webkit-keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0)}}@keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(-42px,0,0);transform:scale3d(.475,.475,.475) translate3d(-42px,0,0)}to{opacity:0;-webkit-transform:scale(.1) translate3d(2000px,0,0);transform:scale(.1) translate3d(2000px,0,0)}}.animate__zoomOutRight{-webkit-animation-name:zoomOutRight;animation-name:zoomOutRight;-webkit-transform-origin:right center;transform-origin:right center}@-webkit-keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}@keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale3d(.475,.475,.475) translate3d(0,60px,0);transform:scale3d(.475,.475,.475) translate3d(0,60px,0);-webkit-animation-timing-function:cubic-bezier(.55,.055,.675,.19);animation-timing-function:cubic-bezier(.55,.055,.675,.19)}to{opacity:0;-webkit-transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);transform:scale3d(.1,.1,.1) translate3d(0,-2000px,0);-webkit-animation-timing-function:cubic-bezier(.175,.885,.32,1);animation-timing-function:cubic-bezier(.175,.885,.32,1)}}.animate__zoomOutUp{-webkit-animation-name:zoomOutUp;animation-name:zoomOutUp;-webkit-transform-origin:center bottom;transform-origin:center bottom}@-webkit-keyframes slideInDown{0%{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes slideInDown{0%{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__slideInDown{-webkit-animation-name:slideInDown;animation-name:slideInDown}@-webkit-keyframes slideInLeft{0%{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes slideInLeft{0%{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__slideInLeft{-webkit-animation-name:slideInLeft;animation-name:slideInLeft}@-webkit-keyframes slideInRight{0%{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes slideInRight{0%{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__slideInRight{-webkit-animation-name:slideInRight;animation-name:slideInRight}@-webkit-keyframes slideInUp{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes slideInUp{0%{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0);visibility:visible}to{-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__slideInUp{-webkit-animation-name:slideInUp;animation-name:slideInUp}@-webkit-keyframes slideOutDown{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}@keyframes slideOutDown{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}}.animate__slideOutDown{-webkit-animation-name:slideOutDown;animation-name:slideOutDown}@-webkit-keyframes slideOutLeft{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}@keyframes slideOutLeft{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}}.animate__slideOutLeft{-webkit-animation-name:slideOutLeft;animation-name:slideOutLeft}@-webkit-keyframes slideOutRight{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}@keyframes slideOutRight{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}}.animate__slideOutRight{-webkit-animation-name:slideOutRight;animation-name:slideOutRight}@-webkit-keyframes slideOutUp{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}@keyframes slideOutUp{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{visibility:hidden;-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}}.animate__slideOutUp{-webkit-animation-name:slideOutUp;animation-name:slideOutUp}
\ No newline at end of file
diff --git a/src/Strem/wwwroot/index.html b/src/Strem/wwwroot/index.html
index 7c1210a..4b67018 100644
--- a/src/Strem/wwwroot/index.html
+++ b/src/Strem/wwwroot/index.html
@@ -10,6 +10,7 @@
         <link href="css/bulma-slider.css" rel="stylesheet" />
         <link href="css/fontawesome-iconpicker.css" rel="stylesheet" />
         <link href="css/all.css" rel="stylesheet" />
+        <link href="css/animate.css" rel="stylesheet" />
         <link href="css/app-styles.less" type="text/css" rel="stylesheet/less" />
     </head>    
     <body>
@@ -19,6 +20,7 @@
         <script src="js/less.min.js" ></script>
         <script src="js/bulma-slider.js" ></script>
         <script src="js/fontawesome-iconpicker.js" ></script>
+        <script src="js/bulma-toast.min.js" ></script>
         <script src="js/interop-methods.js" ></script>
         <script src="_framework/blazor.webview.js"></script>
     </body>
diff --git a/src/Strem/wwwroot/js/bulma-toast.min.js b/src/Strem/wwwroot/js/bulma-toast.min.js
new file mode 100644
index 0000000..8b294a2
--- /dev/null
+++ b/src/Strem/wwwroot/js/bulma-toast.min.js
@@ -0,0 +1,6 @@
+/*!
+ * bulma-toast 2.4.1 
+ * (c) 2018-present @rfoel <rafaelfr@outlook.com> 
+ * Released under the MIT License.
+ */
+(function(a,b){"object"==typeof exports&&"undefined"!=typeof module?b(exports):"function"==typeof define&&define.amd?define(["exports"],b):(a="undefined"==typeof globalThis?a||self:globalThis,b(a.bulmaToast={}))})(this,function(a){'use strict';function b(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function c(a){for(var c,d=1;d<arguments.length;d++)c=null==arguments[d]?{}:arguments[d],d%2?b(Object(c),!0).forEach(function(b){g(a,b,c[b])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(c)):b(Object(c)).forEach(function(b){Object.defineProperty(a,b,Object.getOwnPropertyDescriptor(c,b))});return a}function d(a,b){if(!(a instanceof b))throw new TypeError("Cannot call a class as a function")}function e(a,b){for(var c,d=0;d<b.length;d++)c=b[d],c.enumerable=c.enumerable||!1,c.configurable=!0,"value"in c&&(c.writable=!0),Object.defineProperty(a,c.key,c)}function f(a,b,c){return b&&e(a.prototype,b),c&&e(a,c),a}function g(a,b,c){return b in a?Object.defineProperty(a,b,{value:c,enumerable:!0,configurable:!0,writable:!0}):a[b]=c,a}function h(){var a;return null!==(a=o)&&void 0!==a?a:document}function i(a,b,c,d,e,f){if(n.position)return n.position;var g=h().createElement("div");return g.setAttribute("style","width:100%;z-index:99999;position:fixed;pointer-events:none;display:flex;flex-direction:column;padding:15px;"+p(b,c,d,e,f)),a.appendChild(g),n.position=g,g}function j(a){for(var b in n)n[b].remove();n={},o=a}function k(a){if(!a.message)throw new Error("message is required");var b=c(c({},m),a),d=new q(b),e=i(b.appendTo||h().body,b.position||m.position,b.offsetTop||m.offsetTop,b.offsetBottom||m.offsetBottom,b.offsetLeft||m.offsetLeft,b.offsetRight||m.offsetRight);if(b.single)for(var f=e.lastElementChild;f;)e.removeChild(f),f=e.lastElementChild;e.appendChild(d.element)}var l={duration:2e3,position:"top-right",closeOnClick:!0,opacity:1,single:!1,offsetTop:0,offsetBottom:0,offsetLeft:0,offsetRight:0,extraClasses:""},m=c({},l),n={},o=null,p=function(a,b,c,d,e){return"top-left"===a?"left:".concat(d,";top:").concat(b,";text-align:left;align-items:flex-start;"):"top-right"===a?"right:".concat(e,";top:").concat(b,";text-align:right;align-items:flex-end;"):"top-center"===a?"top:".concat(b,";left:0;right:0;text-align:center;align-items:center;"):"bottom-left"===a?"left:".concat(d,";bottom:").concat(c,";text-align:left;align-items:flex-start;"):"bottom-right"===a?"right:".concat(e,";bottom:").concat(c,";text-align:right;align-items:flex-end;"):"bottom-center"===a?"bottom:".concat(c,";left:0;right:0;text-align:center;align-items:center;"):"center"===a?"top:0;left:0;right:0;bottom:0;flex-flow:column;justify-content:center;align-items:center;":void 0},q=/*#__PURE__*/function(){function a(b){var c=this;d(this,a),this.element=h().createElement("div"),this.opacity=b.opacity,this.type=b.type,this.animate=b.animate,this.dismissible=b.dismissible,this.closeOnClick=b.closeOnClick,this.message=b.message,this.duration=b.duration,this.pauseOnHover=b.pauseOnHover,this.offsetTop=b.offsetTop,this.offsetBottom=b.offsetBottom,this.offsetLeft=b.offsetLeft,this.offsetRight=b.offsetRight,this.extraClasses=b.extraClasses;var e="width:auto;pointer-events:auto;display:inline-flex;white-space:pre-wrap;opacity:".concat(this.opacity,";"),f=["notification",this.extraClasses];if(this.type&&f.push(this.type),this.animate&&this.animate["in"]){var g="animate__".concat(this.animate["in"]),i=this.animate.speed?"animate__".concat(this.animate.speed):"animate__faster";f.push("animate__animated ".concat(g," ").concat(i)),this.onAnimationEnd(function(){return c.element.classList.remove(g)})}if(this.element.className=f.join(" "),this.dismissible){var j=h().createElement("button");j.className="delete",j.addEventListener("click",function(){c.destroy()}),this.element.insertAdjacentElement("afterbegin",j)}else e+="padding: 1.25rem 1.5rem";this.closeOnClick&&this.element.addEventListener("click",function(){c.destroy()}),this.element.setAttribute("style",e),"string"==typeof this.message?this.element.insertAdjacentHTML("beforeend",this.message):this.element.appendChild(this.message);var k=new r(function(){c.destroy()},this.duration);this.pauseOnHover&&(this.element.addEventListener("mouseover",function(){k.pause()}),this.element.addEventListener("mouseout",function(){k.resume()}))}return f(a,[{key:"destroy",value:function(){var a=this;this.animate&&this.animate.out?(this.element.classList.add("animate__".concat(this.animate.out)),this.onAnimationEnd(function(){a.removeParent(a.element.parentNode),a.element.remove(),delete n.position})):(this.removeParent(this.element.parentNode),this.element.remove(),delete n.position)}},{key:"removeParent",value:function(a){a&&1>=a.children.length&&a.remove()}},{key:"onAnimationEnd",value:function(){var a=0<arguments.length&&void 0!==arguments[0]?arguments[0]:function(){},b={animation:"animationend",OAnimation:"oAnimationEnd",MozAnimation:"mozAnimationEnd",WebkitAnimation:"webkitAnimationEnd"};for(var c in b)if(void 0!==this.element.style[c]){this.element.addEventListener(b[c],function(){return a()});break}}}]),a}(),r=/*#__PURE__*/function(){function a(b,c){d(this,a),this.timer,this.start,this.remaining=c,this.callback=b,this.resume()}return f(a,[{key:"pause",value:function(){"undefined"==typeof document||(window.clearTimeout(this.timer),this.remaining-=new Date-this.start)}},{key:"resume",value:function(){"undefined"==typeof document||(this.start=new Date,window.clearTimeout(this.timer),this.timer=window.setTimeout(this.callback,this.remaining))}}]),a}();a.resetDefaults=function(){m=c({},l)},a.setDefaults=function(a){m=c(c({},l),a)},a.setDoc=j,a.toast=k,Object.defineProperty(a,"__esModule",{value:!0})});
diff --git a/src/Strem/wwwroot/js/interop-methods.js b/src/Strem/wwwroot/js/interop-methods.js
index 7a48d9e..4776108 100644
--- a/src/Strem/wwwroot/js/interop-methods.js
+++ b/src/Strem/wwwroot/js/interop-methods.js
@@ -5,7 +5,6 @@
     if(scaleAlteration >= 0) { scaleAlteration *= 1.5; }
     if(scaleAlteration < 0) { scaleAlteration /= 1.5; }
 
-
     console.log("alteration", scaleAlteration);
     const scalingFactor = 1+scaleAlteration;
     const base = 100;
@@ -21,4 +20,34 @@ function processButtonPicker()
         hideOnSelect: true,
         inputSearch: true
     })
-}
\ No newline at end of file
+}
+
+function showNotification(text, type)
+{
+    bulmaToast.toast({ message: text, type: type })
+}
+
+const animateCSS = (element, animation, prefix = 'animate__') =>
+    // We create a Promise and return it
+    new Promise((resolve, reject) => {
+        const animationName = `${prefix}${animation}`;
+        const node = document.querySelector(element);
+
+        node.classList.add(`${prefix}animated`, animationName);
+
+        // When the animation ends, we clean the classes and resolve the Promise
+        function handleAnimationEnd(event) {
+            event.stopPropagation();
+            node.classList.remove(`${prefix}animated`, animationName);
+            resolve('Animation ended');
+        }
+
+        node.addEventListener('animationend', handleAnimationEnd, {once: true});
+    });
+
+bulmaToast.setDefaults({
+    duration: 2000,
+    position: 'bottom-right',
+    closeOnClick: true,
+    animate: {in: 'bounceInRight', out: 'bounceOutRight'}
+});
\ No newline at end of file