moladukes

{
  "Afghanistan": "en.af#holiday@group.v.calendar.google.com",
  "Albania": "en.al#holiday@group.v.calendar.google.com",
  "Algeria": "en.dz#holiday@group.v.calendar.google.com",
  "American Samoa": "en.as#holiday@group.v.calendar.google.com",
  "Andorra": "en.ad#holiday@group.v.calendar.google.com",
  "Angola": "en.ao#holiday@group.v.calendar.google.com",
  "Anguilla": "en.ai#holiday@group.v.calendar.google.com",
  "Antigua and Barbuda": "en.ag#holiday@group.v.calendar.google.com",
  "Argentina": "en.ar#holiday@group.v.calendar.google.com",

moladukes

# db/schema.rb
create_table "webhooks", force: :cascade do |t|
  t.integer "webhook_type", null: false
  t.string "event_type", null: false
  t.string "resource_type", null: false
  t.jsonb "event_data", default: {}, null: false
  t.boolean "processed", default: false, null: false
  t.datetime "created_at", precision: 6, null: false
  t.datetime "updated_at", precision: 6, null: false
end

moladukes

<!-- Uses group-hover for demo but could be toggled with an .active class, :group-active, or inline using your favorite js flavor -->
<button class="group text-white w-10 h-10 relative focus:outline-none bg-blue-500 rounded-md">
  <div class="block w-7 absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2">
    <hr aria-hidden="true" class="block absolute h-0.5 w-7 bg-current transform transition duration-500 ease-in-out -translate-y-2 group-hover:rotate-45 group-hover:-translate-y-0">
    <hr aria-hidden="true" class="block absolute  h-0.5 w-7 bg-current   transform transition duration-500 ease-in-out group-hover:opacity-0">
    <hr aria-hidden="true" class="block absolute  h-0.5 w-7 bg-current transform  transition duration-500 ease-in-out translate-y-2 group-hover:-rotate-45 group-hover:-translate-y-0">
  </div>
</button>

moladukes

<!-- Demo https://codepen.io/moladukes/pen/jZKRrJ -->

<ul>
  <li><a href="#" class="accordian-toggle">Toggle</a>
  <li class="accordian-description">Description</li>
  <li><a href="#" class="accordian-toggle">Toggle</a>
  <li class="accordian-description">Description</li>
  <li><a href="#" class="accordian-toggle">Toggle</a>
  <li class="accordian-description">Description</li>
</ul>

moladukes

.sexy-box-shadow {
  box-shadow: 0 50px 100px rgba(50,50,93,.1), 0 15px 35px rgba(50,50,93,.15), 0 5px 15px rgba(0,0,0,.1);
}

moladukes

<!-- 
NOTES: Edit these variables:
BUTTON_URL is the ticket url
BUTTON TEXT is the text on the button
BUTTON_BG is background color. You can create a color code here: http://hslpicker.com/ (i.e #ffffff )
BUTTON_COLOR is button color. You can create a color code here: http://hslpicker.com/ (i.e #000000 )
-->

<p style="text-align: center;"><a href="BUTTON_URL" style="background-color:BUTTON_BG ;border-radius:4px;color:BUTTON_COLOR ;display:inline-block;font-family:sans-serif;font-size:16px;font-weight:bold;line-height:40px;width: 150px; margin: 0 auto;text-align:center;text-decoration:none;-webkit-text-size-adjust:none;">BUTTON_TEXT</a></p>

moladukes

$gutter-width: 1rem;
$outer-margin: 2rem;
$gutter-compensation: -0.5rem;
$half-gutter-width: 0.5rem;

.row {
  display: inline-block;
  display: -ms-flexbox;
  display: -webkit-flex;

moladukes

<!-- CSS -->
<style>
  .tab-content {
    display: none;
  }
  .tab-content.active {
    display: block;
  }
</style>
<!-- JS // Requires Jquery -->

moladukes

<script src="http://www.youtube.com/player_api"></script>
<div id="player"></div>

moladukes

.video { 
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: -100;
  transition: 1s opacity;