diff --git a/LICENSE.3RDPARTY b/LICENSE.3RDPARTY index 144220eb..1e89116b 100644 --- a/LICENSE.3RDPARTY +++ b/LICENSE.3RDPARTY @@ -13,6 +13,7 @@ distributed with django-helpdesk. 10. License for Metis Menu 11. License for Bootstrap CSS v4.2.1 12. License for Font Awesome v5.6.3 +13. License for Timeline 3 ---------------------------------------------------------------------- @@ -330,4 +331,28 @@ trademarks does not indicate endorsement of the trademark holder by Font Awesome, nor vice versa. **Please do not use brand logos for any purpose except to represent the company, product, or service to which they refer.** +---------------------------------------------------------------------- + +13. License for Timeline 3 + +TimelineJS is released under the Mozilla Public License (MPL), version 2.0. +That means that TimelineJS is free to "use, reproduce, make available, modify, +display, perform, distribute" or otherwise employ. You don't need our permission +to publish stories with TimelineJS and you don't need to pay us any fees or +arrange any further license beyond the MPL. You may also make changes to our +source code, although if you use changed code publicly, you must make the source +code to your modified version available. + +Note that this page is not offered as legal counsel and you may wish to consult +your own lawyers. + +If you have more questions, feel free to reach out to us. + +You may: +embed TimelineJS in a personal or commercial website. +receive compensation for a page containing Timelines you have created, whether +from a client or from display advertising. +copy, modify, clone or fork the code for personal or commercial use. +host the TimelineJS source code on your own server. + diff --git a/README.rst b/README.rst index e4f4b47d..d7499fa6 100644 --- a/README.rst +++ b/README.rst @@ -80,6 +80,11 @@ Django project. For further installation information see `docs/install.html` and `docs/configuration.html` +Testing +------- + +See quicktest.py for usage details + Upgrading from previous versions -------------------------------- @@ -111,3 +116,4 @@ We're happy to include any type of contribution! This can be: For more information on contributing, please see the `CONTRIBUTING.rst` file. .. _note: http://docs.djangoproject.com/en/dev/ref/databases/#sqlite-string-matching + diff --git a/helpdesk/email.py b/helpdesk/email.py index 5fd68a86..ea0316f1 100644 --- a/helpdesk/email.py +++ b/helpdesk/email.py @@ -4,42 +4,35 @@ Django Helpdesk - A Django powered ticket tracker for small enterprise. (c) Copyright 2008 Jutda. Copyright 2018 Timothy Hobbs. All Rights Reserved. See LICENSE for details. """ -from django.core.exceptions import ValidationError -from django.core.files.base import ContentFile -from django.core.files.uploadedfile import SimpleUploadedFile -from django.core.management.base import BaseCommand -from django.db.models import Q -from django.utils.translation import ugettext as _ -from django.utils import encoding, timezone -from django.contrib.auth import get_user_model - -from helpdesk import settings -from helpdesk.lib import safe_template_context, process_attachments -from helpdesk.models import Queue, Ticket, TicketCC, FollowUp, IgnoreEmail - -from datetime import timedelta -import base64 -import binascii +# import base64 import email -from email.header import decode_header -from email.utils import getaddresses, parseaddr, collapse_rfc2231_value import imaplib +import logging import mimetypes -from os import listdir, unlink -from os.path import isfile, join +import os import poplib import re import socket import ssl import sys +from datetime import timedelta +from email.utils import getaddresses +from os.path import isfile, join from time import ctime -from optparse import make_option from bs4 import BeautifulSoup - +from django.contrib.auth import get_user_model +from django.core.exceptions import ValidationError +from django.core.files.uploadedfile import SimpleUploadedFile +from django.db.models import Q +from django.utils import encoding, timezone +from django.utils.translation import ugettext as _ from email_reply_parser import EmailReplyParser -import logging +from helpdesk import settings +from helpdesk.lib import safe_template_context, process_attachments +from helpdesk.models import Queue, Ticket, TicketCC, FollowUp, IgnoreEmail + # import User model, which may be a custom model User = get_user_model() @@ -70,37 +63,48 @@ def process_email(quiet=False): if q.logging_type in logging_types: logger.setLevel(logging_types[q.logging_type]) elif not q.logging_type or q.logging_type == 'none': - logging.disable(logging.CRITICAL) # disable all messages + # disable all handlers so messages go to nowhere + logger.handlers = [] + logger.propagate = False if quiet: logger.propagate = False # do not propagate to root logger that would log to console - logdir = q.logging_dir or '/var/log/helpdesk/' + + # Log messages to specific file only if the queue has it configured + if (q.logging_type in logging_types) and q.logging_dir: # if it's enabled and the dir is set + log_file_handler = logging.FileHandler(join(q.logging_dir, q.slug + '_get_email.log')) + logger.addHandler(log_file_handler) + else: + log_file_handler = None try: - handler = logging.FileHandler(join(logdir, q.slug + '_get_email.log')) - logger.addHandler(handler) - if not q.email_box_last_check: q.email_box_last_check = timezone.now() - timedelta(minutes=30) queue_time_delta = timedelta(minutes=q.email_box_interval or 0) - if (q.email_box_last_check + queue_time_delta) < timezone.now(): process_queue(q, logger=logger) q.email_box_last_check = timezone.now() q.save() finally: + # we must close the file handler correctly if it's created try: - handler.close() + if log_file_handler: + log_file_handler.close() except Exception as e: logging.exception(e) try: - logger.removeHandler(handler) + if log_file_handler: + logger.removeHandler(log_file_handler) except Exception as e: logging.exception(e) def pop3_sync(q, logger, server): server.getwelcome() + try: + server.stls() + except Exception: + logger.warning("POP3 StartTLS failed or unsupported. Connection will be unencrypted.") server.user(q.email_box_user or settings.QUEUE_EMAIL_BOX_USER) server.pass_(q.email_box_pass or settings.QUEUE_EMAIL_BOX_PASSWORD) @@ -138,17 +142,27 @@ def pop3_sync(q, logger, server): def imap_sync(q, logger, server): try: + try: + server.starttl() + except Exception: + logger.warning("IMAP4 StartTLS unsupported or failed. Connection will be unencrypted.") server.login(q.email_box_user or settings.QUEUE_EMAIL_BOX_USER, q.email_box_pass or settings.QUEUE_EMAIL_BOX_PASSWORD) server.select(q.email_box_imap_folder) except imaplib.IMAP4.abort: - logger.error("IMAP login failed. Check that the server is accessible and that the username and password are correct.") + logger.error( + "IMAP login failed. Check that the server is accessible and that " + "the username and password are correct." + ) server.logout() sys.exit() except ssl.SSLError: - logger.error("IMAP login failed due to SSL error. This is often due to a timeout. Please check your connection and try again.") + logger.error( + "IMAP login failed due to SSL error. This is often due to a timeout. " + "Please check your connection and try again." + ) server.logout() sys.exit() @@ -171,7 +185,10 @@ def imap_sync(q, logger, server): else: logger.warn("Message %s was not successfully processed, and will be left on IMAP server" % num) except imaplib.IMAP4.error: - logger.error("IMAP retrieve failed. Is the folder '%s' spelled correctly, and does it exist on the server?" % q.email_box_imap_folder) + logger.error( + "IMAP retrieve failed. Is the folder '%s' spelled correctly, and does it exist on the server?", + q.email_box_imap_folder + ) server.expunge() server.close() @@ -243,7 +260,7 @@ def process_queue(q, logger): elif email_box_type == 'local': mail_dir = q.email_box_local_dir or '/var/lib/mail/helpdesk/' - mail = [join(mail_dir, f) for f in listdir(mail_dir) if isfile(join(mail_dir, f))] + mail = [join(mail_dir, f) for f in os.listdir(mail_dir) if isfile(join(mail_dir, f))] logger.info("Found %d messages in local mailbox directory" % len(mail)) logger.info("Found %d messages in local mailbox directory" % len(mail)) @@ -253,15 +270,15 @@ def process_queue(q, logger): full_message = encoding.force_text(f.read(), errors='replace') ticket = object_from_message(message=full_message, queue=q, logger=logger) if ticket: - logger.info("Successfully processed message %d, ticket/comment created." % i) + logger.info("Successfully processed message %d, ticket/comment created.", i) try: - unlink(m) # delete message file if ticket was successful - except OSError: - logger.error("Unable to delete message %d." % i) + os.unlink(m) # delete message file if ticket was successful + except OSError as e: + logger.error("Unable to delete message %d (%s).", i, str(e)) else: - logger.info("Successfully deleted message %d." % i) + logger.info("Successfully deleted message %d.", i) else: - logger.warn("Message %d was not successfully processed, and will be left in local directory" % i) + logger.warn("Message %d was not successfully processed, and will be left in local directory", i) def decodeUnknown(charset, string): @@ -277,7 +294,11 @@ def decodeUnknown(charset, string): def decode_mail_headers(string): decoded = email.header.decode_header(string) - return u' '.join([str(msg, encoding=charset, errors='replace') if charset else str(msg) for msg, charset in decoded]) + return u' '.join([ + str(msg, encoding=charset, errors='replace') if charset else str(msg) + for msg, charset + in decoded + ]) def create_ticket_cc(ticket, cc_list): @@ -305,7 +326,7 @@ def create_ticket_cc(ticket, cc_list): try: ticket_cc = subscribe_to_ticket_updates(ticket=ticket, user=user, email=cced_email) new_ticket_ccs.append(ticket_cc) - except ValidationError as err: + except ValidationError: pass return new_ticket_ccs @@ -362,7 +383,6 @@ def create_object_from_email_message(message, ticket_id, payload, files, logger) logger.debug("Created new ticket %s-%s" % (ticket.queue.slug, ticket.id)) new = True - update = '' # Old issue being re-opened elif ticket.status == Ticket.CLOSED_STATUS: @@ -389,7 +409,10 @@ def create_object_from_email_message(message, ticket_id, payload, files, logger) attached = process_attachments(f, files) for att_file in attached: - logger.info("Attachment '%s' (with size %s) successfully added to ticket from email." % (att_file[0], att_file[1].size)) + logger.info( + "Attachment '%s' (with size %s) successfully added to ticket from email.", + att_file[0], att_file[1].size + ) context = safe_template_context(ticket) @@ -402,8 +425,8 @@ def create_object_from_email_message(message, ticket_id, payload, files, logger) ticket_cc_list = TicketCC.objects.filter(ticket=ticket).all().values_list('email', flat=True) - for email in ticket_cc_list: - notifications_to_be_sent.append(email) + for email_address in ticket_cc_list: + notifications_to_be_sent.append(email_address) # send mail to appropriate people now depending on what objects # were created and who was CC'd @@ -453,8 +476,6 @@ def object_from_message(message, queue, logger): # correctly. Not ideal, but this seems to work for now. sender_email = email.utils.getaddresses(['\"' + sender.replace('<', '\" <')])[0][1] - body_plain, body_html = '', '' - cc = message.get_all('cc', None) if cc: # first, fixup the encoding if necessary @@ -530,18 +551,23 @@ def object_from_message(message, queue, logger): if not name: ext = mimetypes.guess_extension(part.get_content_type()) name = "part-%i%s" % (counter, ext) + + # FIXME: this code gets the paylods, then does something with it and then completely ignores it + # writing the part.get_payload(decode=True) instead; and then the payload variable is + # replaced by some dict later. + # the `payloadToWrite` has been also ignored so was commented payload = part.get_payload() if isinstance(payload, list): payload = payload.pop().as_string() - payloadToWrite = payload + # payloadToWrite = payload # check version of python to ensure use of only the correct error type non_b64_err = TypeError try: logger.debug("Try to base64 decode the attachment payload") - payloadToWrite = base64.decodebytes(payload) + # payloadToWrite = base64.decodebytes(payload) except non_b64_err: logger.debug("Payload was not base64 encoded, using raw bytes") - payloadToWrite = payload + # payloadToWrite = payload files.append(SimpleUploadedFile(name, part.get_payload(decode=True), mimetypes.guess_type(name)[0])) logger.debug("Found MIME attachment %s" % name) diff --git a/helpdesk/locale/cs/LC_MESSAGES/django.po b/helpdesk/locale/cs/LC_MESSAGES/django.po index 657c55df..4a601d3d 100644 --- a/helpdesk/locale/cs/LC_MESSAGES/django.po +++ b/helpdesk/locale/cs/LC_MESSAGES/django.po @@ -502,7 +502,7 @@ msgstr "Složka pro log soubory" #: third_party/django-helpdesk/helpdesk/models.py:306 msgid "" "If logging is enabled, what directory should we use to store log files for " -"this queue? If no directory is set, default to /var/log/helpdesk/" +"this queue? The standard logging mechanims are used if no directory is set" msgstr "" #: third_party/django-helpdesk/helpdesk/models.py:317 diff --git a/helpdesk/locale/fr/LC_MESSAGES/django.po b/helpdesk/locale/fr/LC_MESSAGES/django.po index 6ea0de00..bf5b8a21 100644 --- a/helpdesk/locale/fr/LC_MESSAGES/django.po +++ b/helpdesk/locale/fr/LC_MESSAGES/django.po @@ -522,11 +522,10 @@ msgstr "Dossier de logs" #: .\models.py:308 msgid "" "If logging is enabled, what directory should we use to store log files for " -"this queue? If no directory is set, default to /var/log/helpdesk/" +"this queue? The standard logging mechanims are used if no directory is set" msgstr "" "Si les logs sont activés, quel dossier doit être utilisé pour stocker les " -"fichiers de logs pour cette file ? Si aucun dossier n'est défini, cela sera /" -"var/log/helpdesk/ par défaut" +"fichiers de logs pour cette file?" #: .\models.py:319 msgid "Default owner" diff --git a/helpdesk/locale/ru/LC_MESSAGES/django.po b/helpdesk/locale/ru/LC_MESSAGES/django.po index c1d484a1..62e2a5d2 100644 --- a/helpdesk/locale/ru/LC_MESSAGES/django.po +++ b/helpdesk/locale/ru/LC_MESSAGES/django.po @@ -531,13 +531,15 @@ msgstr "" #: models.py:247 msgid "Logging Directory" -msgstr "" +msgstr "Директория логов" #: models.py:251 msgid "" "If logging is enabled, what directory should we use to store log files for " -"this queue? If no directory is set, default to /var/log/helpdesk/" +"this queue? The standard logging mechanims are used if no directory is set" msgstr "" +"Директория в которую будут сохраняться файлы с логами; стандартная конфигурация " +"используется если ничего не указано" #: models.py:261 msgid "Default owner" diff --git a/helpdesk/locale/zh_CN/LC_MESSAGES/django.po b/helpdesk/locale/zh_CN/LC_MESSAGES/django.po index dfd3c151..7261c9a0 100644 --- a/helpdesk/locale/zh_CN/LC_MESSAGES/django.po +++ b/helpdesk/locale/zh_CN/LC_MESSAGES/django.po @@ -470,7 +470,7 @@ msgstr "" #: models.py:308 msgid "" "If logging is enabled, what directory should we use to store log files for " -"this queue? If no directory is set, default to /var/log/helpdesk/" +"this queue? The standard logging mechanims are used if no directory is set" msgstr "" #: models.py:319 diff --git a/helpdesk/migrations/0013_email_box_local_dir_and_logging.py b/helpdesk/migrations/0013_email_box_local_dir_and_logging.py index 6fc936ca..58e383e5 100644 --- a/helpdesk/migrations/0013_email_box_local_dir_and_logging.py +++ b/helpdesk/migrations/0013_email_box_local_dir_and_logging.py @@ -18,7 +18,7 @@ class Migration(migrations.Migration): migrations.AddField( model_name='queue', name='logging_dir', - field=models.CharField(blank=True, help_text='If logging is enabled, what directory should we use to store log files for this queue? If no directory is set, default to /var/log/helpdesk/', max_length=200, null=True, verbose_name='Logging Directory'), + field=models.CharField(blank=True, help_text='If logging is enabled, what directory should we use to store log files for this queue? The standard logging mechanims are used if no directory is set', max_length=200, null=True, verbose_name='Logging Directory'), ), migrations.AddField( model_name='queue', diff --git a/helpdesk/models.py b/helpdesk/models.py index 90945ddc..71f3a721 100644 --- a/helpdesk/models.py +++ b/helpdesk/models.py @@ -307,7 +307,7 @@ class Queue(models.Model): null=True, help_text=_('If logging is enabled, what directory should we use to ' 'store log files for this queue? ' - 'If no directory is set, default to /var/log/helpdesk/'), + 'The standard logging mechanims are used if no directory is set'), ) default_owner = models.ForeignKey( diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.abril-droidsans.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.abril-droidsans.css new file mode 100644 index 00000000..4a3dcb6a --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.abril-droidsans.css @@ -0,0 +1,142 @@ +/* Font Abril Fatface & Droid Sans + +https://www.google.com/fonts/specimen/Abril+Fatface +https://www.google.com/fonts/specimen/Droid+Sans +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'Abril Fatface'; + font-style: normal; + font-weight: 400; + src: local('Abril Fatface'), local('AbrilFatface-Regular'), url(https://fonts.gstatic.com/s/abrilfatface/v12/zOL64pLDlL1D99S8g8PtiKchq-dmiA.ttf) format('truetype'); +} +@font-face { + font-family: 'Droid Sans'; + font-style: normal; + font-weight: 400; + src: local('Droid Sans Regular'), local('DroidSans-Regular'), url(https://fonts.gstatic.com/s/droidsans/v12/SlGVmQWMvZQIdix7AFxXkHNSaA.ttf) format('truetype'); +} +@font-face { + font-family: 'Droid Sans'; + font-style: normal; + font-weight: 700; + src: local('Droid Sans Bold'), local('DroidSans-Bold'), url(https://fonts.gstatic.com/s/droidsans/v12/SlGWmQWMvZQIdix7AFxXmMh3eDs1Yg.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'Droid Sans', sans-serif; + font-weight: 400; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'Abril Fatface', cursive; + text-transform: none; + font-weight: 700; + font-size: 46px; + line-height: 46px; +} +.tl-timeline h2.tl-headline-title { + font-size: 58px; + line-height: 58px; +} +.tl-timeline p { + font-family: 'Droid Sans', sans-serif; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'Droid Sans', sans-serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'Droid Sans', sans-serif; + font-weight: 700; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'Droid Sans', sans-serif; +} +.tl-timeline .vcard { + font-family: 'Droid Sans', sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'Droid Sans', sans-serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'Droid Sans', sans-serif !important; + font-weight: normal !important; + text-transform: none !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'Droid Sans', sans-serif; + font-weight: 700; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'Droid Sans', sans-serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'Droid Sans', sans-serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-menubar { + font-family: 'Droid Sans', sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'Droid Sans', sans-serif; + font-style: normal; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'Abril Fatface', cursive; + text-transform: none; + font-weight: 700; + font-size: 46px; + line-height: 46px; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.amatic-andika.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.amatic-andika.css new file mode 100644 index 00000000..b0ae3115 --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.amatic-andika.css @@ -0,0 +1,142 @@ +/* Font Amatic & Andika + +https://www.google.com/fonts/specimen/Amatic+SC +https://www.google.com/fonts/specimen/Andika +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'Amatic SC'; + font-style: normal; + font-weight: 400; + src: local('Amatic SC Regular'), local('AmaticSC-Regular'), url(https://fonts.gstatic.com/s/amaticsc/v15/TUZyzwprpvBS1izr_vOECuSa.ttf) format('truetype'); +} +@font-face { + font-family: 'Amatic SC'; + font-style: normal; + font-weight: 700; + src: local('Amatic SC Bold'), local('AmaticSC-Bold'), url(https://fonts.gstatic.com/s/amaticsc/v15/TUZ3zwprpvBS1izr_vOMscGKfrUH.ttf) format('truetype'); +} +@font-face { + font-family: 'Andika'; + font-style: normal; + font-weight: 400; + src: local('Andika Regular'), local('Andika-Regular'), url(https://fonts.gstatic.com/s/andika/v12/mem_Ya6iyW-LwqgwarYV.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'Andika', sans-serif; + font-weight: 400; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'Amatic SC', cursive; + text-transform: none; + font-weight: 700; + font-size: 64px; + line-height: 64px; +} +.tl-timeline h2.tl-headline-title { + font-size: 86px; + line-height: 86px; +} +.tl-timeline p { + font-family: 'Andika', sans-serif; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'Andika', sans-serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'Andika', sans-serif; + font-weight: 700; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'Andika', sans-serif; +} +.tl-timeline .vcard { + font-family: 'Andika', sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'Andika', sans-serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'Andika', sans-serif !important; + font-weight: normal !important; + text-transform: none !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'Andika', sans-serif; + font-weight: 700; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'Andika', sans-serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'Andika', sans-serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-menubar { + font-family: 'Andika', sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'Andika', sans-serif; + font-style: normal; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'Amatic SC', cursive; + text-transform: none; + font-weight: 700; + font-size: 64px; + line-height: 64px; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.bevan-pontanosans.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.bevan-pontanosans.css new file mode 100644 index 00000000..ce621a75 --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.bevan-pontanosans.css @@ -0,0 +1,140 @@ +/* Font Bevan & Pontano+Sans + +https://www.google.com/fonts/specimen/Bevan +https://www.google.com/fonts/specimen/Pontano+Sans +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'Bevan'; + font-style: normal; + font-weight: 400; + src: local('Bevan Regular'), local('Bevan-Regular'), url(https://fonts.gstatic.com/s/bevan/v12/4iCj6KZ0a9NXjG8dWC4.ttf) format('truetype'); +} +@font-face { + font-family: 'Pontano Sans'; + font-style: normal; + font-weight: 400; + src: local('Pontano Sans'), local('PontanoSans-Regular'), url(https://fonts.gstatic.com/s/pontanosans/v8/qFdD35GdgYR8EzR6oBLDHa3axT8I.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'Pontano Sans', sans-serif; + font-weight: 400; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'Bevan', cursive; + text-transform: none; + font-weight: 400; + font-size: 38px; + line-height: 38px; +} +.tl-timeline h2.tl-headline-title { + font-size: 58px; + line-height: 58px; +} +.tl-timeline p { + font-family: 'Pontano Sans', sans-serif; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'Pontano Sans', sans-serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'Pontano Sans', sans-serif; + font-weight: 400; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'Pontano Sans', sans-serif; +} +.tl-timeline .vcard { + font-family: 'Pontano Sans', sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'Pontano Sans', sans-serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'Pontano Sans', sans-serif !important; + font-weight: normal !important; + text-transform: none !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'Pontano Sans', sans-serif; + font-weight: 400; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'Pontano Sans', sans-serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'Pontano Sans', sans-serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-menubar { + font-family: 'Pontano Sans', sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'Pontano Sans', sans-serif; + font-style: italic; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'Bevan', cursive; + text-transform: none; + font-weight: 400; + font-size: 38px; + line-height: 38px; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + margin-bottom: 10px !important; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.bitter-raleway.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.bitter-raleway.css new file mode 100644 index 00000000..450532ff --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.bitter-raleway.css @@ -0,0 +1,148 @@ +/* Font Bitter & Raleway + +https://www.google.com/fonts/specimen/Bitter +https://www.google.com/fonts/specimen/Raleway +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'Bitter'; + font-style: normal; + font-weight: 700; + src: url(https://fonts.gstatic.com/s/bitter/v16/raxhHiqOu8IVPmnRc6SY1KXhnF_Y8RHYOLjOWA.ttf) format('truetype'); +} +@font-face { + font-family: 'Raleway'; + font-style: normal; + font-weight: 200; + src: url(https://fonts.gstatic.com/s/raleway/v18/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVtaorCIPrQ.ttf) format('truetype'); +} +@font-face { + font-family: 'Raleway'; + font-style: normal; + font-weight: 300; + src: url(https://fonts.gstatic.com/s/raleway/v18/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVuEorCIPrQ.ttf) format('truetype'); +} +@font-face { + font-family: 'Raleway'; + font-style: normal; + font-weight: 700; + src: url(https://fonts.gstatic.com/s/raleway/v18/1Ptxg8zYS_SKggPN4iEgvnHyvveLxVs9pbCIPrQ.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'Raleway', sans-serif; + font-weight: 300; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'Bitter', serif; + text-transform: none; + font-weight: 700; + font-size: 46px; + line-height: 46px; +} +.tl-timeline h2.tl-headline-title { + font-size: 58px; + line-height: 58px; +} +.tl-timeline p { + font-family: 'Raleway', sans-serif; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'Raleway', sans-serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'Raleway', sans-serif; + font-weight: 700; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'Raleway', sans-serif; +} +.tl-timeline .vcard { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif !important; + font-weight: normal !important; + text-transform: none !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 700; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'Bitter', serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-menubar { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'Raleway', sans-serif; + font-style: italic; + font-weight: 200; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'Bitter', serif; + text-transform: none; + font-weight: 700; + font-size: 46px; + line-height: 46px; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.clicker-garamond.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.clicker-garamond.css new file mode 100644 index 00000000..2a44311d --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.clicker-garamond.css @@ -0,0 +1,140 @@ +/* Font Clicker & Garamond + +https://www.google.com/fonts/specimen/Clicker+Script +https://www.google.com/fonts/specimen/EB+Garamond +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'Clicker Script'; + font-style: normal; + font-weight: 400; + src: local('Clicker Script'), local('ClickerScript-Regular'), url(https://fonts.gstatic.com/s/clickerscript/v8/raxkHiKPvt8CMH6ZWP8PdlEq71rf0T4.ttf) format('truetype'); +} +@font-face { + font-family: 'EB Garamond'; + font-style: normal; + font-weight: 400; + src: url(https://fonts.gstatic.com/s/ebgaramond/v14/SlGDmQSNjdsmc35JDF1K5E55YMjF_7DPuGi-6_RkBI96.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'EB Garamond', serif; + font-weight: 400; + font-size: 18px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'Clicker Script', cursive; + text-transform: none; + font-weight: 400; + font-size: 58px; + line-height: 58px; +} +.tl-timeline h2.tl-headline-title { + font-size: 64px; + line-height: 64px; +} +.tl-timeline p { + font-family: 'EB Garamond', serif; + font-size: 18px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'EB Garamond', serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'EB Garamond', serif; + font-weight: 400; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'EB Garamond', serif; +} +.tl-timeline .vcard { + font-family: 'EB Garamond', serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'EB Garamond', serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'EB Garamond', serif !important; + font-weight: normal !important; + text-transform: none !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'EB Garamond', serif; + font-weight: 400; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'EB Garamond', serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'EB Garamond', serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-menubar { + font-family: 'EB Garamond', serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'EB Garamond', serif; + font-style: italic; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'Clicker Script', cursive; + text-transform: none; + font-weight: 400; + font-size: 58px; + line-height: 58px; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + margin-bottom: 10px !important; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.dancing-ledger.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.dancing-ledger.css new file mode 100644 index 00000000..3f76f6bd --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.dancing-ledger.css @@ -0,0 +1,142 @@ +/* Font Dancing & Ledger + +https://www.google.com/fonts/specimen/Dancing+Script +https://www.google.com/fonts/specimen/Ledger +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'Dancing Script'; + font-style: normal; + font-weight: 400; + src: url(https://fonts.gstatic.com/s/dancingscript/v15/If2cXTr6YS-zF4S-kcSWSVi_sxjsohD9F50Ruu7BMSo3Sup5.ttf) format('truetype'); +} +@font-face { + font-family: 'Dancing Script'; + font-style: normal; + font-weight: 700; + src: url(https://fonts.gstatic.com/s/dancingscript/v15/If2cXTr6YS-zF4S-kcSWSVi_sxjsohD9F50Ruu7B1i03Sup5.ttf) format('truetype'); +} +@font-face { + font-family: 'Ledger'; + font-style: normal; + font-weight: 400; + src: local('Ledger'), local('Ledger-Regular'), url(https://fonts.gstatic.com/s/ledger/v9/j8_q6-HK1L3if_sBnMr0.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'Ledger', serif; + font-weight: 400; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'Dancing Script', cursive; + text-transform: none; + font-weight: 700; + font-size: 58px; + line-height: 58px; +} +.tl-timeline h2.tl-headline-title { + font-size: 68px; + line-height: 68px; +} +.tl-timeline p { + font-family: 'Ledger', serif; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'Ledger', serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'Ledger', serif; + font-weight: 700; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'Ledger', serif; +} +.tl-timeline .vcard { + font-family: 'Ledger', serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'Ledger', serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'Ledger', serif !important; + font-weight: normal !important; + text-transform: none !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'Ledger', serif; + font-weight: 700; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'Dancing Script', cursive; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'Ledger', serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-menubar { + font-family: 'Ledger', serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'Ledger', serif; + font-style: normal; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'Dancing Script', cursive; + text-transform: none; + font-weight: 700; + font-size: 58px; + line-height: 58px; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.default.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.default.css new file mode 100644 index 00000000..6d3be29b --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.default.css @@ -0,0 +1,154 @@ +/* Font Default +----------------------------------------------------- */ +/* Font PT Sans & PT Serif & PT Sans Narrow + +http://www.google.com/webfonts/specimen/PT+Sans+Narrow +http://www.google.com/webfonts/specimen/PT+Sans +http://www.google.com/webfonts/specimen/PT+Serif +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'PT Sans'; + font-style: normal; + font-weight: 400; + src: local('PT Sans'), local('PTSans-Regular'), url(https://fonts.gstatic.com/s/ptsans/v12/jizaRExUiTo99u79D0KEwA.ttf) format('truetype'); +} +@font-face { + font-family: 'PT Sans Narrow'; + font-style: normal; + font-weight: 700; + src: local('PT Sans Narrow Bold'), local('PTSans-NarrowBold'), url(https://fonts.gstatic.com/s/ptsansnarrow/v12/BngSUXNadjH0qYEzV7ab-oWlsbg95AiFW_g.ttf) format('truetype'); +} +@font-face { + font-family: 'PT Serif'; + font-style: italic; + font-weight: 400; + src: local('PT Serif Italic'), local('PTSerif-Italic'), url(https://fonts.gstatic.com/s/ptserif/v12/EJRTQgYoZZY2vCFuvAFT_r21dw.ttf) format('truetype'); +} +@font-face { + font-family: 'PT Serif'; + font-style: normal; + font-weight: 400; + src: local('PT Serif'), local('PTSerif-Regular'), url(https://fonts.gstatic.com/s/ptserif/v12/EJRVQgYoZZY2vCFuvAFWzro.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'PT Serif', serif; + font-weight: 400; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'PT Sans Narrow', sans-serif; + text-transform: uppercase; + font-weight: 700; + font-size: 46px; + line-height: 46px; +} +.tl-timeline h2.tl-headline-title { + font-size: 58px; + line-height: 58px; +} +.tl-timeline p { + font-family: 'PT Serif', serif; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'PT Serif', serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'PT Serif', serif; + font-weight: 700; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'PT Serif', serif; +} +.tl-timeline .vcard { + font-family: 'PT Sans Narrow', sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'PT Sans Narrow', sans-serif; + font-weight: 700; + text-transform: uppercase; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'PT Sans Narrow', sans-serif !important; + font-weight: normal !important; + text-transform: uppercase !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'PT Sans Narrow', sans-serif; + font-weight: 700; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'PT Sans', sans-serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'PT Sans Narrow', sans-serif; + font-weight: 700; + text-transform: uppercase; +} +.tl-timeline .tl-menubar { + font-family: 'PT Sans Narrow', sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'PT Serif', serif; + font-style: italic; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'PT Sans Narrow', sans-serif; + text-transform: uppercase; + font-weight: 700; + font-size: 46px; + line-height: 46px; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-weight: normal; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.fjalla-average.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.fjalla-average.css new file mode 100644 index 00000000..ebf90707 --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.fjalla-average.css @@ -0,0 +1,140 @@ +/* Font Fjalla & Average + +https://www.google.com/fonts/specimen/Fjalla+One +https://www.google.com/fonts/specimen/Average+Sans +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'Average Sans'; + font-style: normal; + font-weight: 400; + src: local('Average Sans Regular'), local('AverageSans-Regular'), url(https://fonts.gstatic.com/s/averagesans/v9/1Ptpg8fLXP2dlAXR-HlJJNJ_AtCe.ttf) format('truetype'); +} +@font-face { + font-family: 'Fjalla One'; + font-style: normal; + font-weight: 400; + src: local('Fjalla One'), local('FjallaOne-Regular'), url(https://fonts.gstatic.com/s/fjallaone/v8/Yq6R-LCAWCX3-6Ky7FAFrOF6lw.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'Average Sans', sans-serif; + font-weight: 400; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'Fjalla One', sans-serif; + text-transform: none; + font-weight: 400; + font-size: 46px; + line-height: 1.1em; +} +.tl-timeline h2.tl-headline-title { + font-size: 58px; + line-height: 58px; +} +.tl-timeline p { + font-family: 'Average Sans', sans-serif; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'Average Sans', sans-serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'Average Sans', sans-serif; + font-weight: 400; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'Average Sans', sans-serif; +} +.tl-timeline .vcard { + font-family: 'Average Sans', sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'Average Sans', sans-serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'Average Sans', sans-serif !important; + font-weight: normal !important; + text-transform: none !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'Average Sans', sans-serif; + font-weight: 400; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'Average Sans', sans-serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'Average Sans', sans-serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-menubar { + font-family: 'Average Sans', sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'Average Sans', sans-serif; + font-style: normal; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'Fjalla One', sans-serif; + text-transform: none; + font-weight: 400; + font-size: 46px; + line-height: 46px; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + margin-bottom: 10px !important; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.georgia-helvetica.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.georgia-helvetica.css new file mode 100644 index 00000000..c49a7709 --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.georgia-helvetica.css @@ -0,0 +1,122 @@ +/* Font Georgia & Helvetica + +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 400; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: Georgia, Times, serif; + text-transform: normal; + font-weight: 800; + font-size: 42px; + line-height: 42px; +} +.tl-timeline h2.tl-headline-title { + font-size: 46px; + line-height: 46px; +} +.tl-timeline p { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 800; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; +} +.tl-timeline .vcard { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 800; + text-transform: normal; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif !important; + font-weight: normal !important; + text-transform: normal !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 800; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: Georgia, Times, serif; + font-weight: 800; + text-transform: normal; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 800; + text-transform: normal; +} +.tl-timeline .tl-menubar { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-style: italic; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: Georgia, Times, serif; + text-transform: normal; + font-weight: 800; + font-size: 42px; + line-height: 42px; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.knightlab.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.knightlab.css new file mode 100644 index 00000000..d9e14b80 --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.knightlab.css @@ -0,0 +1,124 @@ +/* Font Default + +Knight Lab Specific +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@import url(//cloud.webtype.com/css/d4767ecb-457a-4677-8761-72f890add836.css); +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: "Turnip RE", Georgia, "Times New Roman", Times, serif; + font-weight: 400; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: "Salvo Serif Cond", Georgia, "Times New Roman", Times, serif; + text-transform: none; + font-weight: 400; + font-size: 46px; + line-height: 46px; +} +.tl-timeline h2.tl-headline-title { + font-size: 58px; + line-height: 58px; +} +.tl-timeline p { + font-family: "Turnip RE", Georgia, "Times New Roman", Times, serif; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: "Turnip RE", Georgia, "Times New Roman", Times, serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: "Turnip RE", Georgia, "Times New Roman", Times, serif; + font-weight: 400; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: "Turnip RE", Georgia, "Times New Roman", Times, serif; +} +.tl-timeline .vcard { + font-family: "Apres RE", "Helvetica Neue", Helvetica, Arial, sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: "Apres RE", "Helvetica Neue", Helvetica, Arial, sans-serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: "Apres RE", "Helvetica Neue", Helvetica, Arial, sans-serif !important; + font-weight: normal !important; + text-transform: none !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: "Apres RE", "Helvetica Neue", Helvetica, Arial, sans-serif; + font-weight: 400; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: "Salvo Serif Cond", Georgia, "Times New Roman", Times, serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: "Apres RE", "Helvetica Neue", Helvetica, Arial, sans-serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-menubar { + font-family: "Apres RE", "Helvetica Neue", Helvetica, Arial, sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: "Turnip RE", Georgia, "Times New Roman", Times, serif; + font-style: italic; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: "Salvo Serif Cond", Georgia, "Times New Roman", Times, serif; + text-transform: none; + font-weight: 400; + font-size: 46px; + line-height: 46px; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.lustria-lato.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.lustria-lato.css new file mode 100644 index 00000000..ef70ee0f --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.lustria-lato.css @@ -0,0 +1,146 @@ +/* Font Lustria & Lato + +https://www.google.com/fonts/specimen/Lustria +https://www.google.com/fonts/specimen/Lato +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'Lato'; + font-style: italic; + font-weight: 400; + src: local('Lato Italic'), local('Lato-Italic'), url(https://fonts.gstatic.com/s/lato/v17/S6u8w4BMUTPHjxsAXC-v.ttf) format('truetype'); +} +@font-face { + font-family: 'Lato'; + font-style: normal; + font-weight: 400; + src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v17/S6uyw4BMUTPHjx4wWw.ttf) format('truetype'); +} +@font-face { + font-family: 'Lustria'; + font-style: normal; + font-weight: 400; + src: local('Lustria'), local('Lustria-Regular'), url(https://fonts.gstatic.com/s/lustria/v8/9oRONYodvDEyjuhOnC8zNg.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'Lato', sans-serif; + font-weight: 400; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'Lustria', serif; + text-transform: none; + font-weight: 400; + font-size: 46px; + line-height: 46px; +} +.tl-timeline h2.tl-headline-title { + font-size: 58px; + line-height: 58px; +} +.tl-timeline p { + font-family: 'Lato', sans-serif; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'Lato', sans-serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'Lato', sans-serif; + font-weight: 400; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'Lato', sans-serif; +} +.tl-timeline .vcard { + font-family: 'Lato', sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'Lato', sans-serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'Lato', sans-serif !important; + font-weight: normal !important; + text-transform: none !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'Lato', sans-serif; + font-weight: 400; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'Lustria', serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'Lato', sans-serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-menubar { + font-family: 'Lato', sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'Lato', sans-serif; + font-style: italic; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'Lustria', serif; + text-transform: none; + font-weight: 400; + font-size: 46px; + line-height: 46px; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + margin-bottom: 10px !important; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.medula-lato.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.medula-lato.css new file mode 100644 index 00000000..c9267dbc --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.medula-lato.css @@ -0,0 +1,148 @@ +/* Font Medula One & Lato + +https://www.google.com/fonts/specimen/Medula+One +https://www.google.com/fonts/specimen/Lato +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'Lato'; + font-style: italic; + font-weight: 300; + src: local('Lato Light Italic'), local('Lato-LightItalic'), url(https://fonts.gstatic.com/s/lato/v17/S6u_w4BMUTPHjxsI9w2_Gwfo.ttf) format('truetype'); +} +@font-face { + font-family: 'Lato'; + font-style: normal; + font-weight: 400; + src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v17/S6uyw4BMUTPHjx4wWw.ttf) format('truetype'); +} +@font-face { + font-family: 'Lato'; + font-style: normal; + font-weight: 700; + src: local('Lato Bold'), local('Lato-Bold'), url(https://fonts.gstatic.com/s/lato/v17/S6u9w4BMUTPHh6UVSwiPHA.ttf) format('truetype'); +} +@font-face { + font-family: 'Medula One'; + font-style: normal; + font-weight: 400; + src: local('Medula One'), local('MedulaOne-Regular'), url(https://fonts.gstatic.com/s/medulaone/v10/YA9Wr0qb5kjJM6l2V0yuoiYgtw.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'Lato', sans-serif; + font-weight: 400; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'Medula One', cursive; + text-transform: none; + font-weight: 700; + font-size: 58px; + line-height: 58px; +} +.tl-timeline h2.tl-headline-title { + font-size: 72px; + line-height: 72px; +} +.tl-timeline p { + font-family: 'Lato', sans-serif; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'Lato', sans-serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'Lato', sans-serif; + font-weight: 700; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'Lato', sans-serif; +} +.tl-timeline .vcard { + font-family: 'Lato', sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'Lato', sans-serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'Lato', sans-serif !important; + font-weight: normal !important; + text-transform: none !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'Lato', sans-serif; + font-weight: 700; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'Lato', sans-serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'Lato', sans-serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-menubar { + font-family: 'Lato', sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'Lato', sans-serif; + font-style: italic; + font-weight: 300; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'Medula One', cursive; + text-transform: none; + font-weight: 700; + font-size: 58px; + line-height: 58px; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.oldstandard.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.oldstandard.css new file mode 100644 index 00000000..8df937c2 --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.oldstandard.css @@ -0,0 +1,134 @@ +/* Font Old Standard +https://www.google.com/fonts/specimen/Old+Standard+TT +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'Old Standard TT'; + font-style: italic; + font-weight: 400; + src: local('Old Standard TT Italic'), local('OldStandardTT-Italic'), url(https://fonts.gstatic.com/s/oldstandardtt/v13/MwQsbh3o1vLImiwAVvYawgcf2eVer2q6bHY.ttf) format('truetype'); +} +@font-face { + font-family: 'Old Standard TT'; + font-style: normal; + font-weight: 400; + src: local('Old Standard TT Regular'), local('OldStandardTT-Regular'), url(https://fonts.gstatic.com/s/oldstandardtt/v13/MwQubh3o1vLImiwAVvYawgcf2eVeqlq9.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'Old Standard TT', serif; + font-weight: 400; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'Old Standard TT', serif; + text-transform: uppercase; + font-weight: 400; + font-size: 46px; + line-height: 46px; +} +.tl-timeline h2.tl-headline-title { + font-size: 52px; + line-height: 52px; +} +.tl-timeline p { + font-family: 'Old Standard TT', serif; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'Old Standard TT', serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'Old Standard TT', serif; + font-weight: 400; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'Old Standard TT', serif; +} +.tl-timeline .vcard { + font-family: 'Old Standard TT', serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'Old Standard TT', serif; + font-weight: 400; + text-transform: uppercase; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'Old Standard TT', serif !important; + font-weight: normal !important; + text-transform: uppercase !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'Old Standard TT', serif; + font-weight: 400; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'Old Standard TT', serif; + font-weight: 400; + text-transform: uppercase; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'Old Standard TT', serif; + font-weight: 400; + text-transform: uppercase; +} +.tl-timeline .tl-menubar { + font-family: 'Old Standard TT', serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'Old Standard TT', serif; + font-style: italic; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'Old Standard TT', serif; + text-transform: uppercase; + font-weight: 400; + font-size: 46px; + line-height: 46px; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.opensans-gentiumbook.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.opensans-gentiumbook.css new file mode 100644 index 00000000..f687c5bd --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.opensans-gentiumbook.css @@ -0,0 +1,152 @@ +/* Font Open Sans & Gentium Book Basic + +http://www.google.com/webfonts/specimen/Open+Sans +http://www.google.com/webfonts/specimen/Gentium+Book+Basic +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'Gentium Book Basic'; + font-style: italic; + font-weight: 400; + src: local('Gentium Book Basic Italic'), local('GentiumBookBasic-Italic'), url(https://fonts.gstatic.com/s/gentiumbookbasic/v11/pe0xMJCbPYBVokB1LHA9bbyaQb8ZGjc4VYF466c.ttf) format('truetype'); +} +@font-face { + font-family: 'Gentium Book Basic'; + font-style: normal; + font-weight: 400; + src: local('Gentium Book Basic'), local('GentiumBookBasic'), url(https://fonts.gstatic.com/s/gentiumbookbasic/v11/pe0zMJCbPYBVokB1LHA9bbyaQb8ZGjc4ULF_.ttf) format('truetype'); +} +@font-face { + font-family: 'Open Sans'; + font-style: normal; + font-weight: 400; + src: local('Open Sans Regular'), local('OpenSans-Regular'), url(https://fonts.gstatic.com/s/opensans/v18/mem8YaGs126MiZpBA-UFVZ0e.ttf) format('truetype'); +} +@font-face { + font-family: 'Open Sans'; + font-style: normal; + font-weight: 800; + src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'), url(https://fonts.gstatic.com/s/opensans/v18/mem5YaGs126MiZpBA-UN8rsOUuhs.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'Gentium Book Basic', serif; + font-weight: 400; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'Open Sans', sans-serif; + text-transform: none; + font-weight: 800; + font-size: 40px; + line-height: 40px; +} +.tl-timeline h2.tl-headline-title { + font-size: 58px; + line-height: 58px; +} +.tl-timeline p { + font-family: 'Gentium Book Basic', serif; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'Gentium Book Basic', serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'Gentium Book Basic', serif; + font-weight: 800; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'Gentium Book Basic', serif; +} +.tl-timeline .vcard { + font-family: 'Open Sans', sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'Open Sans', sans-serif; + font-weight: 800; + text-transform: none; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'Open Sans', sans-serif !important; + font-weight: normal !important; + text-transform: none !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'Open Sans', sans-serif; + font-weight: 800; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'Open Sans', sans-serif; + font-weight: 800; + text-transform: none; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'Open Sans', sans-serif; + font-weight: 800; + text-transform: none; +} +.tl-timeline .tl-menubar { + font-family: 'Open Sans', sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'Gentium Book Basic', serif; + font-style: italic; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'Open Sans', sans-serif; + text-transform: none; + font-weight: 800; + font-size: 40px; + line-height: 40px; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + margin-bottom: 5px !important; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.playfair-faunaone.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.playfair-faunaone.css new file mode 100644 index 00000000..760a60fd --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.playfair-faunaone.css @@ -0,0 +1,155 @@ +/* Font Playfair & Fauna One & Unica One + +https://www.google.com/fonts/specimen/Playfair+Display +https://www.google.com/fonts/specimen/Fauna+One +https://www.google.com/fonts/specimen/Unica+One +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'Playfair Display'; + font-style: normal; + font-weight: 400; + src: url(https://fonts.gstatic.com/s/playfairdisplay/v21/nuFvD-vYSZviVYUb_rj3ij__anPXJzDwcbmjWBN2PKdFvXDXbtY.ttf) format('truetype'); +} +@font-face { + font-family: 'Playfair Display'; + font-style: normal; + font-weight: 700; + src: url(https://fonts.gstatic.com/s/playfairdisplay/v21/nuFvD-vYSZviVYUb_rj3ij__anPXJzDwcbmjWBN2PKeiunDXbtY.ttf) format('truetype'); +} +@font-face { + font-family: 'Playfair Display SC'; + font-style: normal; + font-weight: 400; + src: local('Playfair Display SC Regular'), local('PlayfairDisplaySC-Regular'), url(https://fonts.gstatic.com/s/playfairdisplaysc/v10/ke85OhoaMkR6-hSn7kbHVoFf7ZfgMPr_lbkMFQ.ttf) format('truetype'); +} +@font-face { + font-family: 'Fauna One'; + font-style: normal; + font-weight: 400; + src: local('Fauna One'), local('FaunaOne-Regular'), url(https://fonts.gstatic.com/s/faunaone/v8/wlpzgwTPBVpjpCuwkuEB3kZP.ttf) format('truetype'); +} +@font-face { + font-family: 'Unica One'; + font-style: normal; + font-weight: 400; + src: local('Unica One'), local('UnicaOne-Regular'), url(https://fonts.gstatic.com/s/unicaone/v8/DPEuYwWHyAYGVTSmalsRcd3b.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'Fauna One', serif; + font-weight: 400; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'Playfair Display', Georgia, serif; + text-transform: uppercase; + font-weight: 400; + font-size: 46px; + line-height: 46px; +} +.tl-timeline h2.tl-headline-title { + font-size: 58px; + line-height: 58px; +} +.tl-timeline p { + font-family: 'Fauna One', serif; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'Fauna One', serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'Fauna One', serif; + font-weight: 400; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'Fauna One', serif; +} +.tl-timeline .vcard { + font-family: 'Unica One', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'Unica One', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 400; + text-transform: uppercase; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'Unica One', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif !important; + font-weight: normal !important; + text-transform: uppercase !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'Unica One', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 400; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'Playfair Display', Georgia, serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'Unica One', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 400; + text-transform: uppercase; +} +.tl-timeline .tl-menubar { + font-family: 'Unica One', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'Fauna One', serif; + font-style: italic; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'Playfair Display', Georgia, serif; + text-transform: uppercase; + font-weight: 400; + font-size: 46px; + line-height: 46px; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.playfair.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.playfair.css new file mode 100644 index 00000000..9f36621a --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.playfair.css @@ -0,0 +1,142 @@ +/* Font Playfair & Playfair SC + +https://www.google.com/fonts/specimen/Playfair+Display +https://www.google.com/fonts/specimen/Playfair+Display+SC +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'Playfair Display'; + font-style: normal; + font-weight: 400; + src: url(https://fonts.gstatic.com/s/playfairdisplay/v21/nuFvD-vYSZviVYUb_rj3ij__anPXJzDwcbmjWBN2PKdFvXDXbtY.ttf) format('truetype'); +} +@font-face { + font-family: 'Playfair Display'; + font-style: normal; + font-weight: 700; + src: url(https://fonts.gstatic.com/s/playfairdisplay/v21/nuFvD-vYSZviVYUb_rj3ij__anPXJzDwcbmjWBN2PKeiunDXbtY.ttf) format('truetype'); +} +@font-face { + font-family: 'Playfair Display SC'; + font-style: normal; + font-weight: 400; + src: local('Playfair Display SC Regular'), local('PlayfairDisplaySC-Regular'), url(https://fonts.gstatic.com/s/playfairdisplaysc/v10/ke85OhoaMkR6-hSn7kbHVoFf7ZfgMPr_lbkMFQ.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'Playfair Display', serif; + font-weight: 400; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'Playfair Display SC', serif; + text-transform: none; + font-weight: 400; + font-size: 46px; + line-height: 46px; +} +.tl-timeline h2.tl-headline-title { + font-size: 58px; + line-height: 58px; +} +.tl-timeline p { + font-family: 'Playfair Display', serif; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'Playfair Display', serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'Playfair Display', serif; + font-weight: 400; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'Playfair Display', serif; +} +.tl-timeline .vcard { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif !important; + font-weight: normal !important; + text-transform: none !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 400; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'Playfair Display SC', serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 400; + text-transform: none; +} +.tl-timeline .tl-menubar { + font-family: 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'Playfair Display', serif; + font-style: italic; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'Playfair Display SC', serif; + text-transform: none; + font-weight: 400; + font-size: 46px; + line-height: 46px; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.pt.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.pt.css new file mode 100644 index 00000000..2e290fa5 --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.pt.css @@ -0,0 +1,152 @@ +/* Font PT Sans & PT Serif & PT Sans Narrow + +http://www.google.com/webfonts/specimen/PT+Sans+Narrow +http://www.google.com/webfonts/specimen/PT+Sans +http://www.google.com/webfonts/specimen/PT+Serif +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'PT Sans'; + font-style: normal; + font-weight: 400; + src: local('PT Sans'), local('PTSans-Regular'), url(https://fonts.gstatic.com/s/ptsans/v12/jizaRExUiTo99u79D0KEwA.ttf) format('truetype'); +} +@font-face { + font-family: 'PT Sans Narrow'; + font-style: normal; + font-weight: 700; + src: local('PT Sans Narrow Bold'), local('PTSans-NarrowBold'), url(https://fonts.gstatic.com/s/ptsansnarrow/v12/BngSUXNadjH0qYEzV7ab-oWlsbg95AiFW_g.ttf) format('truetype'); +} +@font-face { + font-family: 'PT Serif'; + font-style: italic; + font-weight: 400; + src: local('PT Serif Italic'), local('PTSerif-Italic'), url(https://fonts.gstatic.com/s/ptserif/v12/EJRTQgYoZZY2vCFuvAFT_r21dw.ttf) format('truetype'); +} +@font-face { + font-family: 'PT Serif'; + font-style: normal; + font-weight: 400; + src: local('PT Serif'), local('PTSerif-Regular'), url(https://fonts.gstatic.com/s/ptserif/v12/EJRVQgYoZZY2vCFuvAFWzro.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'PT Serif', serif; + font-weight: 400; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'PT Sans Narrow', sans-serif; + text-transform: uppercase; + font-weight: 700; + font-size: 46px; + line-height: 46px; +} +.tl-timeline h2.tl-headline-title { + font-size: 58px; + line-height: 58px; +} +.tl-timeline p { + font-family: 'PT Serif', serif; + font-size: 16px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'PT Serif', serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'PT Serif', serif; + font-weight: 700; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'PT Serif', serif; +} +.tl-timeline .vcard { + font-family: 'PT Sans Narrow', sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'PT Sans Narrow', sans-serif; + font-weight: 700; + text-transform: uppercase; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'PT Sans Narrow', sans-serif !important; + font-weight: normal !important; + text-transform: uppercase !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'PT Sans Narrow', sans-serif; + font-weight: 700; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'PT Sans', sans-serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'PT Sans Narrow', sans-serif; + font-weight: 700; + text-transform: uppercase; +} +.tl-timeline .tl-menubar { + font-family: 'PT Sans Narrow', sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'PT Serif', serif; + font-style: italic; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'PT Sans Narrow', sans-serif; + text-transform: uppercase; + font-weight: 700; + font-size: 46px; + line-height: 46px; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-weight: normal; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.roboto-megrim.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.roboto-megrim.css new file mode 100644 index 00000000..c219b2a0 --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.roboto-megrim.css @@ -0,0 +1,142 @@ +/* Font Roboto Slab & Megrim + +https://www.google.com/fonts/specimen/Vollkorn +https://www.google.com/fonts/specimen/Megrim +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'Megrim'; + font-style: normal; + font-weight: 400; + src: local('Megrim'), url(https://fonts.gstatic.com/s/megrim/v11/46kulbz5WjvLqJZVam_k.ttf) format('truetype'); +} +@font-face { + font-family: 'Roboto Slab'; + font-style: normal; + font-weight: 300; + src: url(https://fonts.gstatic.com/s/robotoslab/v12/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjo0oSmb2Rm.ttf) format('truetype'); +} +@font-face { + font-family: 'Roboto Slab'; + font-style: normal; + font-weight: 400; + src: url(https://fonts.gstatic.com/s/robotoslab/v12/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjojISmb2Rm.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'Roboto Slab', Georgia, serif; + font-weight: 300; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'Megrim', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + text-transform: normal; + font-weight: 400; + font-size: 46px; + line-height: 46px; +} +.tl-timeline h2.tl-headline-title { + font-size: 58px; + line-height: 58px; +} +.tl-timeline p { + font-family: 'Roboto Slab', Georgia, serif; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'Roboto Slab', Georgia, serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'Roboto Slab', Georgia, serif; + font-weight: 400; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'Roboto Slab', Georgia, serif; +} +.tl-timeline .vcard { + font-family: 'Megrim', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'Megrim', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 400; + text-transform: normal; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'Roboto Slab', Georgia, serif !important; + font-weight: normal !important; + text-transform: normal !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'Megrim', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 400; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'Megrim', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 400; + text-transform: normal; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'Megrim', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 400; + text-transform: normal; +} +.tl-timeline .tl-menubar { + font-family: 'Megrim', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'Roboto Slab', Georgia, serif; + font-style: normal; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'Megrim', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + text-transform: normal; + font-weight: 400; + font-size: 46px; + line-height: 46px; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.rufina-sintony.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.rufina-sintony.css new file mode 100644 index 00000000..8c31181d --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.rufina-sintony.css @@ -0,0 +1,148 @@ +/* Font Rufina & Sintony + +https://www.google.com/fonts/specimen/Rufina +https://www.google.com/fonts/specimen/Sintony +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'Rufina'; + font-style: normal; + font-weight: 400; + src: local('Rufina'), local('Rufina-Regular'), url(https://fonts.gstatic.com/s/rufina/v8/Yq6V-LyURyLy-aKCpB5g.ttf) format('truetype'); +} +@font-face { + font-family: 'Rufina'; + font-style: normal; + font-weight: 700; + src: local('Rufina Bold'), local('Rufina-Bold'), url(https://fonts.gstatic.com/s/rufina/v8/Yq6W-LyURyLy-aKKHztwu8Za.ttf) format('truetype'); +} +@font-face { + font-family: 'Sintony'; + font-style: normal; + font-weight: 400; + src: local('Sintony'), url(https://fonts.gstatic.com/s/sintony/v8/XoHm2YDqR7-98cVUETMtvw.ttf) format('truetype'); +} +@font-face { + font-family: 'Sintony'; + font-style: normal; + font-weight: 700; + src: local('Sintony Bold'), local('Sintony-Bold'), url(https://fonts.gstatic.com/s/sintony/v8/XoHj2YDqR7-98cVUGYgIr9AJlg.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'Sintony', sans-serif; + font-weight: 400; + font-size: 15px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'Rufina', serif; + text-transform: none; + font-weight: 700; + font-size: 46px; + line-height: 46px; +} +.tl-timeline h2.tl-headline-title { + font-size: 58px; + line-height: 58px; +} +.tl-timeline p { + font-family: 'Sintony', sans-serif; + font-size: 15px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'Sintony', sans-serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'Sintony', sans-serif; + font-weight: 700; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'Sintony', sans-serif; +} +.tl-timeline .vcard { + font-family: 'Sintony', sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'Sintony', sans-serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'Sintony', sans-serif !important; + font-weight: normal !important; + text-transform: none !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'Sintony', sans-serif; + font-weight: 700; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'Sintony', sans-serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'Sintony', sans-serif; + font-weight: 700; + text-transform: none; +} +.tl-timeline .tl-menubar { + font-family: 'Sintony', sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'Sintony', sans-serif; + font-style: normal; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'Rufina', serif; + text-transform: none; + font-weight: 700; + font-size: 46px; + line-height: 46px; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.ubuntu.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.ubuntu.css new file mode 100644 index 00000000..2403ff13 --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.ubuntu.css @@ -0,0 +1,144 @@ +/* Font Ubuntu + +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'Ubuntu'; + font-style: italic; + font-weight: 300; + src: local('Ubuntu Light Italic'), local('Ubuntu-LightItalic'), url(https://fonts.gstatic.com/s/ubuntu/v15/4iCp6KVjbNBYlgoKejZftVyPN4Q.ttf) format('truetype'); +} +@font-face { + font-family: 'Ubuntu'; + font-style: normal; + font-weight: 300; + src: local('Ubuntu Light'), local('Ubuntu-Light'), url(https://fonts.gstatic.com/s/ubuntu/v15/4iCv6KVjbNBYlgoC1CzjsGyI.ttf) format('truetype'); +} +@font-face { + font-family: 'Ubuntu'; + font-style: normal; + font-weight: 500; + src: local('Ubuntu Medium'), local('Ubuntu-Medium'), url(https://fonts.gstatic.com/s/ubuntu/v15/4iCv6KVjbNBYlgoCjC3jsGyI.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 300; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + text-transform: none; + font-weight: 500; + font-size: 40px; + line-height: 40px; +} +.tl-timeline h2.tl-headline-title { + font-size: 58px; + line-height: 58px; +} +.tl-timeline p { + font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 500; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; +} +.tl-timeline .vcard { + font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 500; + text-transform: none; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif !important; + font-weight: normal !important; + text-transform: none !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 500; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 500; + text-transform: none; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 500; + text-transform: none; +} +.tl-timeline .tl-menubar { + font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-style: italic; + font-weight: 300; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'Ubuntu', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + text-transform: none; + font-weight: 500; + font-size: 40px; + line-height: 40px; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + margin-bottom: 5px !important; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.unicaone-vollkorn.css b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.unicaone-vollkorn.css new file mode 100644 index 00000000..a5d4868c --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/fonts/font.unicaone-vollkorn.css @@ -0,0 +1,142 @@ +/* Font Unica One & Vollkorn + +https://www.google.com/fonts/specimen/Vollkorn +https://www.google.com/fonts/specimen/Unica+One +----------------------------------------------------- */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +@font-face { + font-family: 'Vollkorn'; + font-style: italic; + font-weight: 400; + src: url(https://fonts.gstatic.com/s/vollkorn/v12/0ybuGDoxxrvAnPhYGxksckM2WMCpRjDj-DJGWlmeObE.ttf) format('truetype'); +} +@font-face { + font-family: 'Vollkorn'; + font-style: normal; + font-weight: 400; + src: url(https://fonts.gstatic.com/s/vollkorn/v12/0ybgGDoxxrvAnPhYGzMlQLzuMasz6Df2MHGeHmmZ.ttf) format('truetype'); +} +@font-face { + font-family: 'Unica One'; + font-style: normal; + font-weight: 400; + src: local('Unica One'), local('UnicaOne-Regular'), url(https://fonts.gstatic.com/s/unicaone/v8/DPEuYwWHyAYGVTSmalsRcd3b.ttf) format('truetype'); +} +/* Font Base +----------------------------------------------------- */ +.tl-timeline { + font-family: 'Vollkorn', Georgia, serif; + font-weight: 400; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-family: 'Unica One', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + text-transform: uppercase; + font-weight: 400; + font-size: 46px; + line-height: 46px; +} +.tl-timeline h2.tl-headline-title { + font-size: 58px; + line-height: 58px; +} +.tl-timeline p { + font-family: 'Vollkorn', Georgia, serif; + font-size: 17px; + line-height: 1.3em; +} +.tl-timeline ul { + font-family: 'Vollkorn', Georgia, serif; +} +.tl-timeline .tl-media .tl-media-wikipedia h4 a, +.tl-timeline .tl-media h4, +.tl-timeline .tl-media h4 a { + font-family: 'Vollkorn', Georgia, serif; + font-weight: 400; + font-size: 24px; + line-height: 24px; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit { + font-family: 'Vollkorn', Georgia, serif; +} +.tl-timeline .vcard { + font-family: 'Unica One', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif !important; + font-weight: normal !important; +} +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous, +.tl-timeline .tl-message, +.tl-timeline .tl-timegroup-message { + font-family: 'Unica One', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 400; + text-transform: uppercase; +} +.tl-timeline .tl-slidenav-next .tl-slidenav-title, +.tl-timeline .tl-slidenav-previous .tl-slidenav-title, +.tl-timeline .tl-message .tl-slidenav-title, +.tl-timeline .tl-timegroup-message .tl-slidenav-title { + line-height: 1.3em !important; +} +.tl-timeline .tl-headline-date, +.tl-timeline h3.tl-headline-date { + font-family: 'Unica One', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif !important; + font-weight: normal !important; + text-transform: uppercase !important; +} +.tl-timeline .tl-headline-date small, +.tl-timeline h3.tl-headline-date small { + font-weight: normal !important; +} +.tl-timeline .tl-timenav-slider { + font-family: 'Unica One', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 400; +} +.tl-timeline .tl-timenav-slider h2.tl-headline { + font-family: 'Unica One', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 400; + text-transform: uppercase; +} +.tl-timeline .tl-timenav-slider .tl-timeaxis { + font-family: 'Unica One', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + font-weight: 400; + text-transform: uppercase; +} +.tl-timeline .tl-menubar { + font-family: 'Unica One', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: 'Vollkorn', Georgia, serif; + font-style: italic; + font-weight: 400; + line-height: 1.3; +} +input[type="text"].editor-headline { + font-family: 'Unica One', 'Helvetica Neue', Helvetica, Arial, "MS Trebuchet", sans-serif; + text-transform: uppercase; + font-weight: 400; + font-size: 46px; + line-height: 46px; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/icons/tl-icons.eot b/helpdesk/static/helpdesk/vendor/timeline3/css/icons/tl-icons.eot new file mode 100644 index 00000000..179ed2d3 Binary files /dev/null and b/helpdesk/static/helpdesk/vendor/timeline3/css/icons/tl-icons.eot differ diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/icons/tl-icons.svg b/helpdesk/static/helpdesk/vendor/timeline3/css/icons/tl-icons.svg new file mode 100644 index 00000000..ff7e2e20 --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/icons/tl-icons.svg @@ -0,0 +1,63 @@ + + + \ No newline at end of file diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/icons/tl-icons.ttf b/helpdesk/static/helpdesk/vendor/timeline3/css/icons/tl-icons.ttf new file mode 100644 index 00000000..74eb8c4a Binary files /dev/null and b/helpdesk/static/helpdesk/vendor/timeline3/css/icons/tl-icons.ttf differ diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/icons/tl-icons.woff b/helpdesk/static/helpdesk/vendor/timeline3/css/icons/tl-icons.woff new file mode 100644 index 00000000..d065e98e Binary files /dev/null and b/helpdesk/static/helpdesk/vendor/timeline3/css/icons/tl-icons.woff differ diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/icons/tl-icons.woff2 b/helpdesk/static/helpdesk/vendor/timeline3/css/icons/tl-icons.woff2 new file mode 100644 index 00000000..978a2921 Binary files /dev/null and b/helpdesk/static/helpdesk/vendor/timeline3/css/icons/tl-icons.woff2 differ diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/themes/timeline.theme.dark.css b/helpdesk/static/helpdesk/vendor/timeline3/css/themes/timeline.theme.dark.css new file mode 100644 index 00000000..e18dab63 --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/themes/timeline.theme.dark.css @@ -0,0 +1,3129 @@ +/*! + Timeline JS 3 + + Designed and built by Zach Wise for the Northwestern University Knight Lab + + This Source Code Form is subject to the terms of the Mozilla Public + License, v. 2.0. If a copy of the MPL was not distributed with this + file, You can obtain one at https://mozilla.org/MPL/2.0/. + +*/ +/* Includes +================================================== */ +/* VARIABLES + THEME DARK +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +/*! + Timeline JS 3 + + Designed and built by Zach Wise for the Northwestern University Knight Lab + + This Source Code Form is subject to the terms of the Mozilla Public + License, v. 2.0. If a copy of the MPL was not distributed with this + file, You can obtain one at https://mozilla.org/MPL/2.0/. + +*/ +/* Includes +================================================== */ +/* Mixins.less + Snippets of reusable CSS to develop faster and keep code readable + * ----------------------------------------------------------------- */ +/* Reset +------------------------------------------------------------------------------------------- */ +.tl-storyjs { + /* Reset tags and common classes + Display in IE6-9 and FF3 + Based on: http://github.com/necolas/normalize.css + ------------------------------------------------------------------------------------------- */ + /* Prevents modern browsers from displaying 'audio' without controls + Based on: http://github.com/necolas/normalize.css + ------------------------------------------------------------------------------------------- */ + /* Prevents sub and sup affecting line-height in all browsers + Based on: http://github.com/necolas/normalize.css + ------------------------------------------------------------------------------------------- */ + /* Img border in a's and image quality + Based on: http://github.com/necolas/normalize.css + ------------------------------------------------------------------------------------------- */ + /* Forms + Based on: http://github.com/necolas/normalize.css + ------------------------------------------------------------------------------------------- */ +} +.tl-storyjs div * { + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; +} +.tl-storyjs h1, +.tl-storyjs h2, +.tl-storyjs h3, +.tl-storyjs h4, +.tl-storyjs h5, +.tl-storyjs h6, +.tl-storyjs p, +.tl-storyjs blockquote, +.tl-storyjs pre, +.tl-storyjs a, +.tl-storyjs abbr, +.tl-storyjs acronym, +.tl-storyjs address, +.tl-storyjs cite, +.tl-storyjs code, +.tl-storyjs del, +.tl-storyjs dfn, +.tl-storyjs em, +.tl-storyjs img, +.tl-storyjs q, +.tl-storyjs s, +.tl-storyjs samp, +.tl-storyjs small, +.tl-storyjs strike, +.tl-storyjs strong, +.tl-storyjs sub, +.tl-storyjs sup, +.tl-storyjs tt, +.tl-storyjs var, +.tl-storyjs dd, +.tl-storyjs dl, +.tl-storyjs dt, +.tl-storyjs li, +.tl-storyjs ol, +.tl-storyjs ul, +.tl-storyjs fieldset, +.tl-storyjs form, +.tl-storyjs label, +.tl-storyjs legend, +.tl-storyjs button, +.tl-storyjs table, +.tl-storyjs caption, +.tl-storyjs tbody, +.tl-storyjs tfoot, +.tl-storyjs thead, +.tl-storyjs tr, +.tl-storyjs th, +.tl-storyjs td, +.tl-storyjs .tl-container, +.tl-storyjs .content-container, +.tl-storyjs .media, +.tl-storyjs .text, +.tl-storyjs .tl-slider, +.tl-storyjs .slider, +.tl-storyjs .date, +.tl-storyjs .title, +.tl-storyjs .message, +.tl-storyjs .map, +.tl-storyjs .credit, +.tl-storyjs .caption, +.tl-storyjs .tl-feedback, +.tl-storyjs .tl-feature, +.tl-storyjs .toolbar, +.tl-storyjs .marker, +.tl-storyjs .dot, +.tl-storyjs .line, +.tl-storyjs .flag, +.tl-storyjs .time, +.tl-storyjs .era, +.tl-storyjs .major, +.tl-storyjs .minor, +.tl-storyjs .tl-navigation, +.tl-storyjs .start, +.tl-storyjs .active { + margin: 0; + padding: 0; + border: 0; + font-weight: normal; + font-style: normal; + font-size: 100%; + line-height: 1; + font-family: inherit; + width: auto; + float: none; +} +.tl-storyjs h1, +.tl-storyjs h2, +.tl-storyjs h3, +.tl-storyjs h4, +.tl-storyjs h5, +.tl-storyjs h6 { + clear: none; +} +.tl-storyjs table { + border-collapse: collapse; + border-spacing: 0; +} +.tl-storyjs ol, +.tl-storyjs ul { + list-style: none; +} +.tl-storyjs q:before, +.tl-storyjs q:after, +.tl-storyjs blockquote:before, +.tl-storyjs blockquote:after { + content: ""; +} +.tl-storyjs a:focus { + outline: thin dotted; +} +.tl-storyjs a:hover, +.tl-storyjs a:active { + outline: 0; +} +.tl-storyjs article, +.tl-storyjs aside, +.tl-storyjs details, +.tl-storyjs figcaption, +.tl-storyjs figure, +.tl-storyjs footer, +.tl-storyjs header, +.tl-storyjs hgroup, +.tl-storyjs nav, +.tl-storyjs section { + display: block; +} +.tl-storyjs audio, +.tl-storyjs canvas, +.tl-storyjs video { + display: inline-block; + *display: inline; + *zoom: 1; +} +.tl-storyjs audio:not([controls]) { + display: none; +} +.tl-storyjs div { + max-width: none; +} +.tl-storyjs sub, +.tl-storyjs sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} +.tl-storyjs sup { + top: -0.5em; +} +.tl-storyjs sub { + bottom: -0.25em; +} +.tl-storyjs img { + border: 0; + -ms-interpolation-mode: bicubic; +} +.tl-storyjs button, +.tl-storyjs input, +.tl-storyjs select, +.tl-storyjs textarea { + font-size: 100%; + margin: 0; + vertical-align: baseline; + *vertical-align: middle; +} +.tl-storyjs button, +.tl-storyjs input { + line-height: normal; + *overflow: visible; +} +.tl-storyjs button::-moz-focus-inner, +.tl-storyjs input::-moz-focus-inner { + border: 0; + padding: 0; +} +.tl-storyjs button, +.tl-storyjs input[type="button"], +.tl-storyjs input[type="reset"], +.tl-storyjs input[type="submit"] { + cursor: pointer; + -webkit-appearance: button; +} +.tl-storyjs input[type="search"] { + -webkit-appearance: textfield; + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; +} +.tl-storyjs input[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} +.tl-storyjs textarea { + overflow: auto; + vertical-align: top; +} +.tl-timeline { + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + /* VCard + ================================================== */ +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + color: #FFF; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3 { + font-size: 36px; + line-height: 36px; +} +.tl-timeline h1 small, +.tl-timeline h2 small, +.tl-timeline h3 small { + font-size: 24px; + line-height: 24px; +} +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-size: 24px; + line-height: 24px; + margin-bottom: 0px; +} +.tl-timeline h4 small, +.tl-timeline h5 small, +.tl-timeline h6 small { + font-size: 15px; + line-height: 15px; +} +.tl-timeline h2.tl-headline-title { + font-size: 46px; + line-height: 46px; +} +.tl-timeline h2.tl-headline-title small { + display: block; + margin-top: 5px; + font-size: 24px; + line-height: 24px; +} +.tl-timeline h2 { + margin-top: 20px; + margin-bottom: 5px; +} +.tl-timeline p { + margin-top: 5px; + margin-bottom: 10px; + font-size: 15px; + line-height: 1.42857143; + color: #ffffff; +} +.tl-timeline p.lead { + font-size: 24px; +} +.tl-timeline p a { + /* + color: lighten(@color-dark, 40%); + text-decoration: none; + background-image: -moz-linear-gradient(top, fade(lighten(@color-dark, 40%), 0%) 50%, fade(lighten(@color-dark, 40%), 60%) 50%); + background-image: -webkit-linear-gradient(top, fade(lighten(@color-dark, 40%), 0%) 50%, fade(lighten(@color-dark, 40%), 60%) 50%); + background-image: -o-linear-gradient(top, fade(lighten(@color-dark, 40%), 0%) 50%, fade(lighten(@color-dark, 40%), 60%) 50%); + background-image: linear-gradient(to bottom, fade(lighten(@color-dark, 40%), 0%) 50%, fade(lighten(@color-dark, 40%), 60%) 50%); + background-repeat: repeat-x; + background-size: 2px 2px; + background-position: 0 @base-font-size+2; + text-shadow: -2px -1px 0 white, 2px -1px 0 white, -2px 1px 0 white, 2px 1px 0 white; + &:hover, + &:focus { + color:@color-theme; + text-decoration: none; + } + */ + color: #ffffff; + text-decoration: underline; +} +.tl-timeline p a:hover, +.tl-timeline p a:focus { + color: #c34528; +} +@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) { + .tl-timeline p a { + text-decoration: underline; + background-image: none; + text-shadow: none; + } + .tl-timeline p a:hover, + .tl-timeline p a:focus { + color: #c34528; + text-decoration: underline; + } +} +.tl-timeline b, +.tl-timeline strong { + font-weight: bold; +} +.tl-timeline i, +.tl-timeline em { + font-style: italic; +} +.tl-timeline a { + text-decoration: none; + color: #c34528; +} +.tl-timeline a:hover { + text-decoration: underline; + color: #6e2717; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit, +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous { + font-size: 11px; + line-height: 11px; +} +.tl-timeline .tl-caption a, +.tl-timeline .tl-credit a, +.tl-timeline .tl-slidenav-next a, +.tl-timeline .tl-slidenav-previous a { + color: #FFF; +} +.tl-timeline .tl-makelink { + word-break: break-all; + word-break: break-word; + -webkit-hyphens: auto; + -moz-hyphens: auto; + hyphens: auto; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: "Georgia", Times New Roman, Times, serif; + color: #ffffff; + font-size: 24px; + line-height: 24px; + text-align: left; + background: transparent; + border: 0px; + padding: 0px; +} +.tl-timeline blockquote cite, +.tl-timeline blockquote p cite { + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-size: 11px; + color: #ffffff; + display: block; + text-align: right; + font-style: normal; +} +.tl-timeline blockquote cite:before, +.tl-timeline blockquote p cite:before { + content: "\2014"; +} +.tl-timeline blockquote p:before { + content: open-quote; + display: inline-block; + font-size: 36px; + position: relative; + top: 8px; + margin-right: 5px; +} +.tl-timeline blockquote p:after { + content: close-quote; + display: inline-block; + font-size: 36px; + position: relative; + top: 8px; + margin-left: 3px; +} +.tl-timeline blockquote { + margin: 10px; +} +.tl-timeline blockquote p { + margin: 0; +} +.tl-timeline .vcard { + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-size: 15px; + line-height: 15px; + *zoom: 1; + margin-bottom: 15px; + margin-top: 10px; +} +.tl-timeline .vcard:before, +.tl-timeline .vcard:after { + display: table; + content: ""; +} +.tl-timeline .vcard:after { + clear: both; +} +.tl-timeline .vcard .twitter-date { + text-align: left; + font-size: 11px; +} +.tl-timeline .vcard .author { + float: right; +} +.tl-timeline .vcard a { + color: #ffffff; + text-decoration: none; +} +.tl-timeline .vcard a:hover { + text-decoration: none; +} +.tl-timeline .vcard a:hover .fn, +.tl-timeline .vcard a:hover .nickname { + color: #c34528; +} +.tl-timeline .vcard .fn, +.tl-timeline .vcard .nickname { + padding-left: 42px; +} +.tl-timeline .vcard .fn { + display: block; + font-weight: bold; +} +.tl-timeline .vcard .nickname { + margin-top: 1px; + display: block; + color: #ffffff; +} +.tl-timeline .vcard .avatar { + float: left; + display: block; + width: 32px; + height: 32px; +} +.tl-timeline .vcard .avatar img { + -moz-border-radius: 5px; + -webkit-border-radius: 5px; + border-radius: 5px; +} +.tl-timeline .tl-text ul { + padding: 0px; + padding-left: 30px; + margin: 0; +} +.tl-timeline .tl-text ul li { + margin-bottom: 5px; +} +.tl-timeline .tl-button-calltoaction { + cursor: pointer; + font-weight: bold; + padding-top: 10px; + margin-bottom: 10px; + padding-bottom: 10px; +} +.tl-timeline .tl-button-calltoaction .tl-button-calltoaction-text { + display: inline-block; + background-color: #c34528; + color: #fff; + padding: 10px 15px 10px 15px; + border-radius: 7px; +} +.tl-timeline .tl-note { + display: block; + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-style: italic; + background-color: #ffffff; + font-size: 15px; + line-height: 17px; + padding: 10px; + -webkit-border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; + color: #8a6d3b; + background-color: #fcf8e3; + border: 1px solid #faebcc; + text-shadow: none; +} +@media only screen and (max-width: 800px), only screen and (max-device-width: 800px) { + .tl-timeline h1, + .tl-timeline h2, + .tl-timeline h3 { + font-size: 36px; + line-height: 36px; + } +} +@media only screen and (max-width: 500px), only screen and (max-device-width: 500px) { + .tl-timeline h1, + .tl-timeline h2, + .tl-timeline h3 { + font-size: 32px; + line-height: 32px; + } +} +.tl-skinny h2 { + margin-top: 0px; +} +/* Icons +================================================== */ +@font-face { + font-family: 'tl-icons'; + src: url('../icons/tl-icons.eot'); + src: url('../icons/tl-icons.eot?#iefix') format('embedded-opentype'), url('../icons/tl-icons.ttf') format('truetype'), url('../icons/tl-icons.woff2') format('woff2'), url('../icons/tl-icons.woff') format('woff'), url('../icons/tl-icons.svg#tl-icons') format('svg'); + font-weight: normal; + font-style: normal; +} +[class^="tl-icon-"], +[class*=" tl-icon-"] { + font-family: 'tl-icons'; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + /* Better Font Rendering =========== */ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} +.tl-icon-vine:after { + content: "\e64d"; +} +.tl-icon-wikipedia:after { + content: "\e64e"; +} +.tl-icon-chevron-right:after { + content: "\e64f"; +} +.tl-icon-chevron-left:after { + content: "\e650"; +} +.tl-icon-youtube-logo:after { + content: "\e651"; +} +.tl-icon-foursquare:after { + content: "\e652"; +} +.tl-icon-camera-retro:after { + content: "\e653"; +} +.tl-icon-doc:after { + content: "\e654"; +} +.tl-icon-weibo:after { + content: "\e655"; +} +.tl-icon-resize-horizontal:after { + content: "\e656"; +} +.tl-icon-resize-vertical:after { + content: "\e657"; +} +.tl-icon-resize-full:after { + content: "\e658"; +} +.tl-icon-resize-small:after { + content: "\e659"; +} +.tl-icon-twitter:after { + content: "\e62b"; +} +.tl-icon-google-plus:after { + content: "\e62c"; +} +.tl-icon-video:after { + content: "\e62d"; +} +.tl-icon-youtube:after { + content: "\e62d"; +} +.tl-icon-plaintext:after { + content: "\e62e"; +} +.tl-icon-storify:after { + content: "\e62e"; +} +.tl-icon-image-v2:after { + content: "\e62f"; +} +.tl-icon-quote-v2:after { + content: "\e630"; +} +.tl-icon-zoom-in:after { + content: "\e631"; +} +.tl-icon-zoom-out:after { + content: "\e632"; +} +.tl-icon-list:after { + content: "\e633"; +} +.tl-icon-music:after { + content: "\e634"; +} +.tl-icon-spotify:after { + content: "\e634"; +} +.tl-icon-location:after { + content: "\e635"; +} +.tl-icon-googlemaps:after { + content: "\e635"; +} +.tl-icon-web:after { + content: "\e636"; +} +.tl-icon-share-v2:after { + content: "\e637"; +} +.tl-icon-soundcloud:after { + content: "\e639"; +} +.tl-icon-video-v2:after { + content: "\e63a"; +} +.tl-icon-dailymotion:after { + content: "\e63a"; +} +.tl-icon-tumblr:after { + content: "\e63b"; +} +.tl-icon-lastfm:after { + content: "\e63c"; +} +.tl-icon-github:after { + content: "\e63d"; +} +.tl-icon-goback:after { + content: "\e63e"; +} +.tl-icon-doc-v2:after { + content: "\e63f"; +} +.tl-icon-googledrive:after { + content: "\e640"; +} +.tl-icon-facebook:after { + content: "\e641"; +} +.tl-icon-flickr:after { + content: "\e642"; +} +.tl-icon-dribbble:after { + content: "\e643"; +} +.tl-icon-image:after { + content: "\e605"; +} +.tl-icon-vimeo:after { + content: "\e606"; +} +.tl-icon-instagram:after { + content: "\e644"; +} +.tl-icon-pinterest:after { + content: "\e645"; +} +.tl-icon-arrow-left:after { + content: "\e646"; +} +.tl-icon-arrow-down:after { + content: "\e647"; +} +.tl-icon-arrow-up:after { + content: "\e648"; +} +.tl-icon-arrow-right:after { + content: "\e649"; +} +.tl-icon-share:after { + content: "\e64a"; +} +.tl-icon-blockquote:after { + content: "\e64b"; +} +.tl-icon-evernote:after { + content: "\e64c"; +} +.tl-icon-mappin:after { + content: "\e600"; +} +.tl-icon-swipe-right:after { + content: "\e601"; +} +.tl-icon-swipe-left:after { + content: "\e602"; +} +.tl-icon-touch-spread:after { + content: "\e603"; +} +.tl-icon-touch-pinch:after { + content: "\e604"; +} +/* Disable Text selection when dragging +================================================== */ +.tl-dragging { + -webkit-touch-callout: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + -o-user-select: none; + user-select: none; +} +/* MenuBar +================================================== */ +.tl-menubar { + position: absolute; + z-index: 11; + text-align: center; + color: #333; + overflow: hidden; + border-bottom-right-radius: 10px; + border-top-right-radius: 10px; + top: 100%; + left: 50%; + left: 0; +} +/* Skinny +================================================== */ +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +/* Color +================================================== */ +/* +.tl-sizebar.tl-sizebar-inverted { + border-bottom: 1px solid #FFF; + //background-color:#000; + color:#a5a5a5; + .tl-sizebar-button { + border-left: 1px solid darken(@color-background, 70); + //color:#a5a5a5; + } + .tl-sizebar-button:hover { + //background:@color-theme; + color:@color-background; + } +} +.tl-sizebar.tl-sizebar-inverted:before { + background-color:#000; + //.gradient-vertical (rgba(0,0,0,0.25), rgba(0,0,0,1)); + //.translucent-background(rgb(0,0,0), .5); + border-top: 2px solid #000; + animation: invertToBlack 1s; + -webkit-animation:invertToBlack 1s; +} +*/ +@keyframes invertToBlack { + from { + background-color: #FFF; + } + to { + background-color: #000; + } +} +@-webkit-keyframes invertToBlack { + from { + background: #FFF; + } + to { + background: #000; + } +} +@keyframes invertToWhite { + from { + background-color: #000; + } + to { + background-color: #FFF; + } +} +@-webkit-keyframes invertToWhite { + from { + background: #000; + } + to { + background: #FFF; + } +} +/* MenuBar Button +================================================== */ +.tl-menubar-button { + font-size: 18px; + line-height: 18px; + background-color: rgba(77, 77, 77, 0.9); + cursor: pointer; + padding: 6px 12px 6px 12px; + display: inline-block; + display: block; + color: #000000; +} +.tl-menubar-button.tl-menubar-button-inactive { + opacity: 0.33; +} +.tl-menubar-button:hover { + background: #CCC; + color: #333; +} +.tl-menubar-button:hover.tl-menubar-button-inactive { + color: #000000; + background-color: rgba(77, 77, 77, 0.9); +} +.tl-mobile .tl-menubar-button { + display: block; +} +.tl-mobile .tl-menubar-button:hover { + background-color: rgba(77, 77, 77, 0.67); + color: #808080; +} +.tl-mobile .tl-menubar-button:active { + background: #c34528; + color: #333; +} +@keyframes invertToBlack { + from { + background-color: #FFF; + } + to { + background-color: #000; + } +} +@-webkit-keyframes invertToBlack { + from { + background: #FFF; + } + to { + background: #000; + } +} +@keyframes invertToWhite { + from { + background-color: #000; + } + to { + background-color: #FFF; + } +} +@-webkit-keyframes invertToWhite { + from { + background: #000; + } + to { + background: #FFF; + } +} +/* MESSAGE +================================================== */ +.tl-message, +.tl-message-full { + width: 100%; + height: 100%; + position: absolute; + display: table; + overflow: hidden; + top: 0px; + left: 0px; + z-index: 99; + margin: auto; + text-align: center; +} +.tl-message .tl-message-container, +.tl-message-full .tl-message-container { + padding: 20px; + margin: 20px; + text-align: center; + vertical-align: middle; + display: table-cell; +} +.tl-message .tl-message-container .tl-message-content, +.tl-message-full .tl-message-container .tl-message-content { + color: #666; + text-align: center; + font-size: 11px; + line-height: 13px; + text-transform: uppercase; + margin-top: 7.5px; + margin-bottom: 7.5px; + text-shadow: 1px 1px 1px #FFF; +} +.tl-message .tl-message-container .tl-message-content strong, +.tl-message-full .tl-message-container .tl-message-content strong { + text-transform: uppercase; +} +.tl-message .tl-message-container .tl-loading-icon, +.tl-message-full .tl-message-container .tl-loading-icon { + width: 30px; + height: 30px; + background-color: #666; + vertical-align: middle; + -webkit-box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.1); + -moz-box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.1); + box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.1); + margin-left: auto; + margin-right: auto; + text-align: center; + -webkit-animation: rotateplane 1.2s infinite ease-in-out; + animation: rotateplane 1.2s infinite ease-in-out; +} +@-webkit-keyframes rotateplane { + 0% { + -webkit-transform: perspective(120px); + } + 50% { + -webkit-transform: perspective(120px) rotateY(180deg); + } + 100% { + -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg); + } +} +@keyframes rotateplane { + 0% { + transform: perspective(120px) rotateX(0deg) rotateY(0deg); + } + 50% { + transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); + } + 100% { + transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); + } +} +.tl-message-full { + background-color: hsla(0, 0%, 100%, 0.8); +} +.tl-message-full [class^="tl-icon-"], +.tl-message-full [class*=" tl-icon-"] { + color: #666; + font-size: 72px; +} +.tl-message-full .tl-message-container .tl-message-content { + font-size: 22px; + line-height: 22px; + text-shadow: none; + color: #666; + text-transform: none; + font-weight: normal; +} +.tl-message-full .tl-message-container .tl-message-content .tl-button { + display: inline-block; + cursor: pointer; + background-color: #FFF; + color: #333; + padding: 10px; + margin-top: 10px; + -webkit-border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; +} +/* TL.TimeNav +================================================== */ +.tl-timenav { + width: 100%; + background-color: #4d4d4d; + position: relative; + overflow: hidden; + border-top: 1px solid #404040; +} +.tl-timenav .tl-attribution { + cursor: pointer; + z-index: 9; + position: absolute; + bottom: 2px; + left: 0px; + font-size: 10px; + line-height: 10px; + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important; + background-color: rgba(51, 51, 51, 0.85); + padding: 3px; + /* + right:-26px; + top:30px; + transform: rotate(90deg); + -ms-transform: rotate(90deg); + -webkit-transform: rotate(90deg); + background-color: fadeout(@ui-background-color, 15%); + */ +} +.tl-timenav .tl-attribution a { + color: #737373; +} +.tl-timenav .tl-attribution a:hover { + color: #FFF; + text-decoration: none; +} +.tl-timenav .tl-attribution a:hover .tl-knightlab-logo { + background-color: #c34528; +} +.tl-timenav .tl-attribution .tl-knightlab-logo { + display: inline-block; + vertical-align: middle; + height: 8px; + width: 8px; + margin-right: 3px; + background-color: #c34528; + background-color: #737373; + transform: rotate(45deg); + -ms-transform: rotate(45deg); + -webkit-transform: rotate(45deg); +} +.tl-timenav .tl-timenav-line { + position: absolute; + top: 0; + left: 50%; + width: 1px; + height: 100%; + background-color: #333333; + z-index: 2; + display: none; +} +.tl-timenav .tl-timenav-line:before, +.tl-timenav .tl-timenav-line:after { + font-family: 'tl-icons'; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + /* Better Font Rendering =========== */ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + color: #c34528; + font-size: 32px; + line-height: 32px; + position: absolute; + left: -14px; +} +.tl-timenav .tl-timenav-line:before { + top: -10px; +} +.tl-timenav .tl-timenav-line:after { + content: "\e648"; + bottom: 24px; +} +.tl-timenav .tl-timenav-slider { + position: absolute; + height: 100%; + width: 100%; + top: 0; +} +.tl-timenav .tl-timenav-slider.tl-timenav-slider-animate { + -webkit-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timenav .tl-timenav-slider .tl-timenav-slider-background { + position: absolute; + height: 100%; + width: 100%; + cursor: move; + z-index: 6; +} +.tl-timenav .tl-timenav-slider .tl-timenav-container-mask { + position: absolute; + height: 100%; + top: 0; +} +.tl-timenav .tl-timenav-slider .tl-timenav-container-mask .tl-timenav-container { + position: absolute; + height: 100%; +} +.tl-timenav .tl-timenav-slider .tl-timenav-container-mask .tl-timenav-container .tl-timenav-item-container { + position: absolute; + height: 100%; +} +/* Skinny +================================================== */ +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +/* TL.TimeMarker +================================================== */ +.tl-timemarker { + height: 100%; + position: absolute; + top: 0; + left: 0; + cursor: pointer; + /* Animate Left Width and Top + ================================================== */ + -webkit-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + /* Timespan + ================================================== */ + /* Lines + ================================================== */ + /* Content + ================================================== */ + /* Hover State + ================================================== */ + /* Hover Active State + ================================================== */ + /* Active Markers + ================================================== */ + /* Markers with End Dates + ================================================== */ + /* Markers with End Dates and Hover + ================================================== */ + /* Markers with End Dates and Active + ================================================== */ + /* Markers with End Dates and Active and Hover + ================================================== */ +} +.tl-timemarker.tl-timemarker-fast { + -webkit-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timemarker.tl-timemarker-fast .tl-timemarker-content-container { + -webkit-transition: width 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: width 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: width 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1); + transition: width 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timemarker.tl-timemarker-fast .tl-timemarker-timespan { + -webkit-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timemarker .tl-timemarker-timespan { + pointer-events: none; + position: absolute; + margin: 0; + width: 100%; + height: 100%; + background-color: rgba(38, 38, 38, 0.15); + border-top-right-radius: 5px; + border-top-left-radius: 5px; + -webkit-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timemarker .tl-timemarker-timespan .tl-timemarker-timespan-content { + display: none; + position: absolute; + width: 100%; + background-color: #262626; + border-top-left-radius: 5px; + border-top-right-radius: 5px; + height: 100px; + box-sizing: border-box; +} +.tl-timemarker .tl-timemarker-line-right { + display: none; + right: 0px; +} +.tl-timemarker .tl-timemarker-line-left { + width: 1px; + left: 0px; +} +.tl-timemarker .tl-timemarker-line-left, +.tl-timemarker .tl-timemarker-line-right { + margin-top: 7px; + -webkit-box-sizing: border-box; + /* Safari/Chrome, other WebKit */ + -moz-box-sizing: border-box; + /* Firefox, other Gecko */ + box-sizing: border-box; + border-left: 1px solid #0d0d0d; + z-index: 5; + content: " "; + position: absolute; + height: 100%; + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + box-shadow: 1px 1px 1px #333; +} +.tl-timemarker .tl-timemarker-line-left:after, +.tl-timemarker .tl-timemarker-line-right:after { + display: block; + content: " "; + position: absolute; + left: -4px; + bottom: 0px; + height: 6px; + width: 6px; + background-color: #000000; + z-index: 8; + -webkit-border-radius: 50%; + -moz-border-radius: 50%; + border-radius: 50%; +} +.tl-timemarker .tl-timemarker-content-container { + position: absolute; + background-color: #262626; + border: 0; + border-top-left-radius: 5px; + border-top-right-radius: 5px; + border-bottom-right-radius: 5px; + height: 100%; + width: 100px; + overflow: hidden; + z-index: 6; + -webkit-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + box-sizing: border-box; + border: 1px solid #0d0d0d; + box-shadow: 1px 1px 1px #333; +} +.tl-timemarker .tl-timemarker-content-container:hover { + z-index: 9; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content { + position: relative; + overflow: hidden; + height: 100%; + z-index: 8; + padding: 5px; + -webkit-box-sizing: border-box; + /* Safari/Chrome, other WebKit */ + -moz-box-sizing: border-box; + /* Firefox, other Gecko */ + box-sizing: border-box; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text { + overflow: hidden; + position: relative; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline, +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline p { + display: -webkit-box; + line-clamp: 2; + -webkit-line-clamp: 2; + box-orient: vertical; + -webkit-box-orient: vertical; + text-overflow: ellipsis; + font-size: 12px; + line-height: 12px; + height: 100%; + overflow: hidden; + font-weight: normal; + margin: 0; + color: #4d4d4d; + position: relative; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline.tl-headline-fadeout:after, +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline p.tl-headline-fadeout:after { + content: ""; + text-align: right; + position: absolute; + bottom: 0; + right: 0; + width: 100%; + height: 50%; + background: -moz-linear-gradient(top, rgba(38, 38, 38, 0) 0%, #262626 50%); + /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(38, 38, 38, 0)), color-stop(50%, #262626)); + /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgba(38, 38, 38, 0) 0%, #262626 50%); + /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgba(38, 38, 38, 0) 0%, #262626 50%); + /* Opera 11.10+ */ + background: -ms-linear-gradient(top, rgba(38, 38, 38, 0) 0%, #262626 50%); + /* IE10+ */ + background: linear-gradient(to bottom, rgba(38, 38, 38, 0) 0%, #262626 50%); + /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@thecolor', endColorstr='@thecolor', GradientType=0); + /* IE6-9 */ +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container { + float: left; + max-width: 24px; + max-height: 24px; + overflow: hidden; + margin-right: 5px; + height: 100%; + -webkit-box-sizing: border-box; + /* Safari/Chrome, other WebKit */ + -moz-box-sizing: border-box; + /* Firefox, other Gecko */ + box-sizing: border-box; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container .tl-timemarker-media { + max-width: 24px; + max-height: 100%; + opacity: 0.25; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class^="tl-icon-"], +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class*=" tl-icon-"] { + display: block; + font-size: 24px; + color: #4d4d4d; + margin-top: 0px; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container .tl-icon-wikipedia { + font-size: 16px; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content.tl-timemarker-content-small .tl-timemarker-text h2.tl-headline { + display: block; + white-space: nowrap; + text-overflow: ellipsis; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content.tl-timemarker-content-small .tl-timemarker-media-container [class^="tl-icon-"], +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content.tl-timemarker-content-small .tl-timemarker-media-container [class*=" tl-icon-"] { + font-size: 12px; +} +.tl-timemarker:hover .tl-timemarker-timespan { + background-color: rgba(77, 77, 77, 0.15); +} +.tl-timemarker:hover .tl-timemarker-timespan .tl-timemarker-timespan-content { + background-color: #4d4d4d; +} +.tl-timemarker:hover .tl-timemarker-timespan .tl-timemarker-line-left, +.tl-timemarker:hover .tl-timemarker-timespan .tl-timemarker-line-right { + border-color: #000000; +} +.tl-timemarker:hover .tl-timemarker-timespan .tl-timemarker-line-left:after, +.tl-timemarker:hover .tl-timemarker-timespan .tl-timemarker-line-right:after { + background-color: #ffffff; +} +.tl-timemarker:hover .tl-timemarker-content-container { + background-color: #000000; + border-color: #000000; + -webkit-transition: height 250ms cubic-bezier(0.77, 0, 0.175, 1), width 250ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: height 250ms cubic-bezier(0.77, 0, 0.175, 1), width 250ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: height 250ms cubic-bezier(0.77, 0, 0.175, 1), width 250ms cubic-bezier(0.77, 0, 0.175, 1); + transition: height 250ms cubic-bezier(0.77, 0, 0.175, 1), width 250ms cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timemarker:hover .tl-timemarker-content-container.tl-timemarker-content-container-small { + width: 200px; +} +.tl-timemarker:hover .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline { + color: #FFF; +} +.tl-timemarker:hover .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline.tl-headline-fadeout:after { + background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, #000000 80%); + /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(80%, #000000)); + /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, #000000 80%); + /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, #000000 80%); + /* Opera 11.10+ */ + background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, #000000 80%); + /* IE10+ */ + background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, #000000 80%); + /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@thecolor', endColorstr='@thecolor', GradientType=0); + /* IE6-9 */ +} +.tl-timemarker:hover .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container .tl-timemarker-media { + opacity: 1; +} +.tl-timemarker:hover .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class^="tl-icon-"], +.tl-timemarker:hover .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class*=" tl-icon-"] { + color: #FFF; +} +.tl-timemarker:hover.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline.tl-headline-fadeout:after { + background: -moz-linear-gradient(top, rgba(51, 51, 51, 0) 0%, #333 80%); + /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(51, 51, 51, 0)), color-stop(80%, #333)); + /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgba(51, 51, 51, 0) 0%, #333 80%); + /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgba(51, 51, 51, 0) 0%, #333 80%); + /* Opera 11.10+ */ + background: -ms-linear-gradient(top, rgba(51, 51, 51, 0) 0%, #333 80%); + /* IE10+ */ + background: linear-gradient(to bottom, rgba(51, 51, 51, 0) 0%, #333 80%); + /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@thecolor', endColorstr='@thecolor', GradientType=0); + /* IE6-9 */ +} +.tl-timemarker:hover.tl-timemarker-active .tl-timemarker-line-left, +.tl-timemarker:hover.tl-timemarker-active .tl-timemarker-line-right { + border-color: #FFF; +} +.tl-timemarker:hover.tl-timemarker-active .tl-timemarker-line-left:after, +.tl-timemarker:hover.tl-timemarker-active .tl-timemarker-line-right:after { + background-color: #FFF; +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-timespan { + background-color: rgba(51, 51, 51, 0.5); + z-index: 8; +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-timespan .tl-timemarker-timespan-content { + background-color: #CCC; +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-line-left, +.tl-timemarker.tl-timemarker-active .tl-timemarker-line-right { + border-color: rgba(204, 204, 204, 0.5); + border-width: 1px; + z-index: 8; + box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5); +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-line-left:after, +.tl-timemarker.tl-timemarker-active .tl-timemarker-line-right:after { + background-color: #CCC; +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container { + background-color: #333; + color: #CCC; + z-index: 9; + border-color: rgba(204, 204, 204, 0.5); + box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5); +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline { + color: #CCC; +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline.tl-headline-fadeout:after { + background: -moz-linear-gradient(top, rgba(51, 51, 51, 0) 0%, #333 80%); + /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(51, 51, 51, 0)), color-stop(80%, #333)); + /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgba(51, 51, 51, 0) 0%, #333 80%); + /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgba(51, 51, 51, 0) 0%, #333 80%); + /* Opera 11.10+ */ + background: -ms-linear-gradient(top, rgba(51, 51, 51, 0) 0%, #333 80%); + /* IE10+ */ + background: linear-gradient(to bottom, rgba(51, 51, 51, 0) 0%, #333 80%); + /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@thecolor', endColorstr='@thecolor', GradientType=0); + /* IE6-9 */ +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container .tl-timemarker-media { + opacity: 1; +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class^="tl-icon-"], +.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class*=" tl-icon-"] { + color: #CCC; +} +.tl-timemarker.tl-timemarker-with-end .tl-timemarker-timespan .tl-timemarker-timespan-content { + display: block; +} +.tl-timemarker.tl-timemarker-with-end .tl-timemarker-timespan .tl-timemarker-line-left, +.tl-timemarker.tl-timemarker-with-end .tl-timemarker-timespan .tl-timemarker-line-right { + z-index: 5; +} +.tl-timemarker.tl-timemarker-with-end .tl-timemarker-timespan:after { + display: block; + content: " "; + position: absolute; + left: 0px; + bottom: -7px; + height: 6px; + width: 100%; + background-color: rgba(0, 0, 0, 0.15); + z-index: 6; + -webkit-border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; +} +.tl-timemarker.tl-timemarker-with-end .tl-timemarker-content-container.tl-timemarker-content-container-long { + box-shadow: none; +} +.tl-timemarker.tl-timemarker-with-end .tl-timemarker-line-right { + display: block; +} +.tl-timemarker.tl-timemarker-with-end .tl-timemarker-line-left { + box-shadow: none; +} +.tl-timemarker.tl-timemarker-with-end:hover .tl-timemarker-timespan:after { + background-color: rgba(0, 0, 0, 0.25); +} +.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-timespan:after { + background-color: rgba(204, 204, 204, 0.5); +} +.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-line-left, +.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-line-right { + border-width: 1px; +} +.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-line-left:after, +.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-line-right:after { + background-color: #CCC !important; +} +.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-line-left { + box-shadow: none; +} +.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active:hover .tl-timemarker-timespan:after { + background-color: rgba(204, 204, 204, 0.5); +} +/* Skinny +================================================== */ +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +/* TL.TimeMarker +================================================== */ +.tl-timeera { + height: 100%; + height: 40px; + position: absolute; + bottom: 0; + left: 0; + pointer-events: none; + z-index: 3; + /* Animate Left Width and Top + ================================================== */ + -webkit-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + /* Timespan + ================================================== */ + /* Content + ================================================== */ +} +.tl-timeera.tl-timeera-fast { + -webkit-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timeera .tl-timeera-background { + position: absolute; + background-color: #28a6c3; + width: 100%; + height: 100%; + opacity: 1; +} +.tl-timeera.tl-timeera-color0 .tl-timeera-background { + background-color: #c34528; +} +.tl-timeera.tl-timeera-color1 .tl-timeera-background { + background-color: #28a6c3; +} +.tl-timeera.tl-timeera-color2 .tl-timeera-background { + background-color: #2832c3; +} +.tl-timeera.tl-timeera-color3 .tl-timeera-background { + background-color: #28c36c; +} +.tl-timeera.tl-timeera-color4 .tl-timeera-background { + background-color: #286dc3; +} +.tl-timeera.tl-timeera-color5 .tl-timeera-background { + background-color: #28c3a7; +} +.tl-timeera .tl-timeera-content-container { + position: absolute; + border: 0; + border-top-left-radius: 5px; + border-top-right-radius: 5px; + border-bottom-right-radius: 5px; + height: 100%; + width: 100px; + overflow: hidden; + -webkit-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + box-sizing: border-box; + border: 1px solid #0d0d0d; +} +.tl-timeera .tl-timeera-content-container .tl-timeera-content { + position: relative; + overflow: hidden; + height: 100%; + padding: 5px; + -webkit-box-sizing: border-box; + /* Safari/Chrome, other WebKit */ + -moz-box-sizing: border-box; + /* Firefox, other Gecko */ + box-sizing: border-box; +} +.tl-timeera .tl-timeera-content-container .tl-timeera-content .tl-timeera-text { + overflow: hidden; + position: relative; + height: 100%; +} +.tl-timeera .tl-timeera-content-container .tl-timeera-content .tl-timeera-text h2.tl-headline { + bottom: 0px; + position: absolute; + display: -webkit-box; + line-clamp: 4; + -webkit-line-clamp: 4; + box-orient: vertical; + -webkit-box-orient: vertical; + text-overflow: ellipsis; + font-size: 10px; + line-height: 10px; + overflow: hidden; + font-weight: normal; + margin: 0; + color: #333; + margin-left: 10px; +} +.tl-timeera .tl-timeera-content-container .tl-timeera-content .tl-timeera-text h2.tl-headline.tl-headline-fadeout:after { + content: ""; + text-align: right; + position: absolute; + bottom: 0; + right: 0; + width: 100%; + height: 50%; + background: -moz-linear-gradient(top, rgba(38, 38, 38, 0) 0%, #262626 50%); + /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(38, 38, 38, 0)), color-stop(50%, #262626)); + /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgba(38, 38, 38, 0) 0%, #262626 50%); + /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgba(38, 38, 38, 0) 0%, #262626 50%); + /* Opera 11.10+ */ + background: -ms-linear-gradient(top, rgba(38, 38, 38, 0) 0%, #262626 50%); + /* IE10+ */ + background: linear-gradient(to bottom, rgba(38, 38, 38, 0) 0%, #262626 50%); + /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@thecolor', endColorstr='@thecolor', GradientType=0); + /* IE6-9 */ +} +/* Skinny +================================================== */ +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +/* TL.TimeMarker +================================================== */ +.tl-timegroup { + width: 100%; + position: absolute; + top: 0; + left: 0; + background-color: #4d4d4d; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + align-items: center; + -ms-flex-align: center; + -webkit-align-items: center; + -webkit-box-align: center; + /* Animate Left Width and Top + ================================================== */ + -webkit-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timegroup .tl-timegroup-message { + color: #000000; + text-shadow: #333 0px 2px 2px; + margin-left: 80px; +} +.tl-timegroup.tl-timegroup-alternate { + background-color: #545454; +} +.tl-timegroup.tl-timegroup-hidden { + display: none; +} +/* Skinny +================================================== */ +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +/* TL.TimeAxis +================================================== */ +.tl-timeaxis-background { + height: 38px; + width: 100%; + position: absolute; + bottom: 0; + left: 0; + background-color: #333; + border-top: 1px solid #404040; + z-index: 2; +} +.tl-timeaxis { + height: 38px; + width: 100%; + position: absolute; + bottom: 0; + left: 0; + z-index: 3; +} +.tl-timeaxis .tl-timeaxis-content-container { + position: relative; + bottom: 0; + height: 38px; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major, +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor { + opacity: 0; + position: absolute; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major .tl-timeaxis-tick, +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick { + position: absolute; + display: block; + top: 0; + left: 0; + text-align: center; + font-weight: normal; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major .tl-timeaxis-tick .tl-timeaxis-tick-text, +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick .tl-timeaxis-tick-text { + display: inline-block; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major .tl-timeaxis-tick:before, +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick:before { + content: "|"; + display: block; + color: #333; + width: 1px; + overflow: hidden; + border-left: 1px solid #575757; + text-align: center; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major.tl-timeaxis-animate .tl-timeaxis-tick, +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor.tl-timeaxis-animate .tl-timeaxis-tick { + -webkit-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major.tl-timeaxis-animate-opacity .tl-timeaxis-tick, +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor.tl-timeaxis-animate-opacity .tl-timeaxis-tick { + -webkit-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major { + z-index: 1; + background-color: #333; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major .tl-timeaxis-tick { + font-size: 12px; + line-height: 14px; + color: #8a8a8a; + width: 100px; + margin-left: -50px; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major .tl-timeaxis-tick:before { + border-color: #707070; + font-size: 18px; + line-height: 18px; + margin-bottom: 2px; + margin-left: 50px; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick { + font-size: 10px; + line-height: 12px; + color: #575757; + width: 50px; + margin-left: -25px; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick .tl-timeaxis-tick-text { + opacity: 0; + white-space: normal; + padding-left: 2px; + padding-right: 2px; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick .tl-timeaxis-tick-text span { + display: block; + font-size: 9px; + line-height: 9px; + margin-top: -2px; + color: #7d7d7d; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick:before { + font-size: 8px; + line-height: 8px; + margin-left: 25px; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick.tl-timeaxis-tick-hidden .tl-timeaxis-tick-text { + opacity: 0 !important; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick.tl-timeaxis-tick-hidden:before { + opacity: 0.33; +} +/* Skinny +================================================== */ +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +.tlanimate { + -webkit-transform: translateZ(0); + -webkit-perspective: 1000; + -webkit-backface-visibility: hidden; +} +.tl-animate { + -webkit-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-animate-opacity { + -webkit-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +/* SLIDE +================================================== */ +.tl-slide { + position: absolute; + width: 100%; + height: 100%; + padding: 0px; + margin: 0px; + overflow-x: hidden; + overflow-y: auto; +} +.tl-slide .tl-slide-background { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + z-index: -1; + overflow: hidden; + display: none; + filter: alpha(opacity=50); + -khtml-opacity: 0.5; + -moz-opacity: 0.5; + opacity: 0.5; + background: no-repeat center center; + -webkit-background-size: cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; +} +.tl-slide .tl-slide-scrollable-container { + display: table; + table-layout: fixed; + height: 100%; + z-index: 1; +} +.tl-slide .tl-slide-content-container { + display: table-cell; + vertical-align: middle; + position: relative; + width: 100%; + height: 100%; + z-index: 3; +} +.tl-slide .tl-slide-content-container .tl-slide-content { + display: table; + vertical-align: middle; + padding-left: 100px; + padding-right: 100px; + position: relative; + max-width: 100%; + user-select: text; +} +.tl-slide .tl-slide-content-container .tl-slide-content .tl-media { + position: relative; + width: 100%; + min-width: 50%; + float: left; + margin-top: auto; + margin-bottom: auto; +} +.tl-slide .tl-slide-content-container .tl-slide-content .tl-text { + width: 50%; + max-width: 50%; + min-width: 120px; + padding: 0 20px 0 20px; + display: table-cell; + vertical-align: middle; + text-align: left; +} +/* Only Media (no text) +================================================== */ +.tl-slide-media-only .tl-slide-content-container .tl-slide-content { + text-align: center; +} +.tl-slide-media-only .tl-slide-content-container .tl-slide-content .tl-media { + text-align: center; + position: relative; + width: 100%; + min-width: 50%; + max-width: 100%; + float: none; + margin-top: auto; + margin-bottom: auto; +} +.tl-slide-media-only .tl-slide-content-container .tl-slide-content .tl-text { + width: 100%; + max-width: 100%; + display: block; + margin-left: auto; + margin-right: auto; + text-align: center; +} +/* Only Text (no media) +================================================== */ +.tl-slide-text-only .tl-slide-content-container .tl-slide-content { + text-align: center; +} +.tl-slide-text-only .tl-slide-content-container .tl-slide-content .tl-text { + max-width: 80%; + width: 80%; + display: block; + margin-left: auto; + margin-right: auto; +} +/* Background +================================================== */ +.tl-slide.tl-full-image-background, +.tl-slide.tl-full-color-background { + color: #FFF !important; + text-shadow: 1px 1px 1px #000 !important; +} +.tl-slide.tl-full-image-background p, +.tl-slide.tl-full-color-background p, +.tl-slide.tl-full-image-background h1, +.tl-slide.tl-full-color-background h1, +.tl-slide.tl-full-image-background h2, +.tl-slide.tl-full-color-background h2, +.tl-slide.tl-full-image-background h3, +.tl-slide.tl-full-color-background h3, +.tl-slide.tl-full-image-background h4, +.tl-slide.tl-full-color-background h4, +.tl-slide.tl-full-image-background h5, +.tl-slide.tl-full-color-background h5, +.tl-slide.tl-full-image-background h6, +.tl-slide.tl-full-color-background h6 { + color: #FFF !important; + text-shadow: 1px 1px 1px #000 !important; +} +.tl-slide.tl-full-image-background a, +.tl-slide.tl-full-color-background a, +.tl-slide.tl-full-image-background b, +.tl-slide.tl-full-color-background b, +.tl-slide.tl-full-image-background i, +.tl-slide.tl-full-color-background i, +.tl-slide.tl-full-image-background blockquote, +.tl-slide.tl-full-color-background blockquote, +.tl-slide.tl-full-image-background blockquote p, +.tl-slide.tl-full-color-background blockquote p { + text-shadow: 1px 1px 1px #000; + color: #ffffff; +} +.tl-slide.tl-full-image-background a:hover, +.tl-slide.tl-full-color-background a:hover { + text-decoration: underline; + color: #c34528; +} +.tl-slide.tl-full-image-background .tl-caption, +.tl-slide.tl-full-color-background .tl-caption, +.tl-slide.tl-full-image-background .tl-credit, +.tl-slide.tl-full-color-background .tl-credit { + color: #FFF !important; + text-shadow: 1px 1px 1px #000 !important; +} +.tl-slide.tl-full-image-background .tl-media-twitter blockquote, +.tl-slide.tl-full-color-background .tl-media-twitter blockquote, +.tl-slide.tl-full-image-background .tl-media-blockquote blockquote, +.tl-slide.tl-full-color-background .tl-media-blockquote blockquote { + color: #FFF !important; + text-shadow: 1px 1px 1px #000 !important; +} +.tl-slide.tl-full-image-background .tl-media-twitter blockquote p, +.tl-slide.tl-full-color-background .tl-media-twitter blockquote p, +.tl-slide.tl-full-image-background .tl-media-blockquote blockquote p, +.tl-slide.tl-full-color-background .tl-media-blockquote blockquote p { + color: #FFF !important; + text-shadow: 1px 1px 1px #000 !important; +} +.tl-slide.tl-full-image-background .vcard a, +.tl-slide.tl-full-color-background .vcard a, +.tl-slide.tl-full-image-background .vcard .nickname, +.tl-slide.tl-full-color-background .vcard .nickname { + color: #FFF !important; + text-shadow: 1px 1px 1px #000 !important; +} +/* Full Image Background +================================================== */ +.tl-slide.tl-full-image-background { + background: no-repeat center center; + -webkit-background-size: cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; + background-position: center 25%; + text-shadow: 1px 1px 2px #000; +} +.tl-slide.tl-full-image-background p, +.tl-slide.tl-full-image-background h1, +.tl-slide.tl-full-image-background h2, +.tl-slide.tl-full-image-background h3, +.tl-slide.tl-full-image-background h4, +.tl-slide.tl-full-image-background h5, +.tl-slide.tl-full-image-background h6 { + text-shadow: 1px 1px 2px #000; +} +.tl-slide.tl-full-image-background .tl-caption, +.tl-slide.tl-full-image-background .tl-credit { + text-shadow: 1px 1px 2px #000; +} +.tl-slide.tl-full-image-background .tl-media-twitter blockquote, +.tl-slide.tl-full-image-background .tl-media-blockquote blockquote { + text-shadow: 1px 1px 2px #000 !important; +} +.tl-slide.tl-full-image-background .tl-media-twitter blockquote p, +.tl-slide.tl-full-image-background .tl-media-blockquote blockquote p { + text-shadow: 1px 1px 2px #000 !important; +} +/* Color Background +================================================== */ +/* Text Background +================================================== */ +.tl-slide.tl-text-background .tl-text .tl-text-content-container { + padding: 20px; + /* Fallback for web browsers that doesn't support RGBa */ + background: #000000 transparent; + /* RGBa with 0.6 opacity */ + background: rgba(0, 0, 0, 0.6); + -webkit-border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; +} +.tl-slide.tl-text-background .tl-text .tl-text-content-container h2 { + margin-top: 5px; +} +/* Skinny +================================================== */ +.tl-skinny .tl-slide { + display: block; + padding-top: 10px; +} +.tl-skinny .tl-slide .tl-slide-content-container { + display: block; + position: static; + height: auto; + height: 100%; + display: -webkit-flex; + /* Safari */ + display: flex; + align-items: center; + -webkit-align-items: center; + /* Safari 7.0+ */ +} +.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content { + display: block; + display: -webkit-flex; + /* Safari */ + display: flex; + flex-direction: column-reverse; + -webkit-flex-direction: column-reverse; + /* Safari */ + position: static; + height: auto; + padding-left: 50px; + padding-right: 50px; +} +.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media { + position: static; + width: 100%; + height: auto; + float: none; + display: block; + padding-top: 20px; + border-top: 1px solid #000000; +} +.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-text { + display: block; + height: auto; + vertical-align: initial; + position: static; + width: 100%; + max-width: 100%; + min-width: 0; + float: none; + padding: 0; +} +.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-text .tl-text-content-container { + padding-left: 10px; + padding-right: 10px; + padding-bottom: 10px; +} +.tl-skinny .tl-slide.tl-slide.tl-full-color-background .tl-slide-content-container .tl-slide-content .tl-media, +.tl-skinny .tl-slide.tl-full-image-background .tl-slide-content-container .tl-slide-content .tl-media { + border-color: rgba(0, 0, 0, 0.25); +} +.tl-skinny .tl-slide.tl-slide-media-only .tl-slide-content-container .tl-slide-content { + flex-direction: column; + -webkit-flex-direction: column; + /* Safari */ +} +.tl-skinny .tl-slide.tl-slide-media-only .tl-slide-content-container .tl-slide-content .tl-media { + border-top: none; + padding-top: 0px; +} +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +.tl-mobile.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media img, +.tl-mobile.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media embed, +.tl-mobile.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media object, +.tl-mobile.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media video, +.tl-mobile.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media iframe { + max-height: 175px; +} +/* SlideNav +================================================== */ +/* NAVIGATION +================================================== */ +.tl-slidenav-previous, +.tl-slidenav-next { + position: absolute; + top: 45%; + z-index: 10; + cursor: pointer; +} +.tl-slidenav-previous .tl-slidenav-content-container, +.tl-slidenav-next .tl-slidenav-content-container { + height: 200px; + width: 100px; + position: absolute; +} +.tl-slidenav-previous .tl-slidenav-title, +.tl-slidenav-next .tl-slidenav-title, +.tl-slidenav-previous .tl-slidenav-description, +.tl-slidenav-next .tl-slidenav-description { + width: 80px; + -webkit-line-clamp: 2; + line-clamp: 2; + text-overflow: ellipsis; + /* Non standard for webkit */ + /* + -webkit-hyphens: auto; + -moz-hyphens: auto; + -ms-hyphens: auto; + hyphens: auto; + */ + filter: alpha(opacity=15); + -khtml-opacity: 0.15; + -moz-opacity: 0.15; + opacity: 0.15; +} +.tl-slidenav-previous .tl-slidenav-title small, +.tl-slidenav-next .tl-slidenav-title small, +.tl-slidenav-previous .tl-slidenav-description small, +.tl-slidenav-next .tl-slidenav-description small { + display: block; +} +.tl-slidenav-previous .tl-slidenav-title, +.tl-slidenav-next .tl-slidenav-title { + margin-top: 10px; + font-size: 11px; + line-height: 11px; +} +.tl-slidenav-previous .tl-slidenav-description, +.tl-slidenav-next .tl-slidenav-description { + font-size: 11px; + margin-top: 5px; + filter: alpha(opacity=0); + -khtml-opacity: 0; + -moz-opacity: 0; + opacity: 0; +} +.tl-slidenav-previous .tl-slidenav-description small, +.tl-slidenav-next .tl-slidenav-description small { + display: none; +} +/* NAVIGATION COLOR +================================================== */ +.tl-slidenav-previous .tl-slidenav-content-container .tl-slidenav-icon, +.tl-slidenav-next .tl-slidenav-content-container .tl-slidenav-icon, +.tl-slidenav-previous .tl-slidenav-content-container .tl-slidenav-title, +.tl-slidenav-next .tl-slidenav-content-container .tl-slidenav-title, +.tl-slidenav-previous .tl-slidenav-content-container .tl-slidenav-description, +.tl-slidenav-next .tl-slidenav-content-container .tl-slidenav-description { + text-shadow: 1px 1px 1px #333; + color: #CCC; +} +.tl-slidenav-previous .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-icon, +.tl-slidenav-next .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-icon, +.tl-slidenav-previous .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-title, +.tl-slidenav-next .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-title, +.tl-slidenav-previous .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-description, +.tl-slidenav-next .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-description { + color: #bfbfbf; + text-shadow: 1px 1px 1px #CCC; +} +/* ICONS +================================================== */ +.tl-slidenav-next .tl-slidenav-icon, +.tl-slidenav-previous .tl-slidenav-icon { + font-family: 'tl-icons'; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + font-size: 32px; + margin-bottom: 5px; +} +.tl-slidenav-next { + text-align: right; + margin-right: 10px; + right: 100px; +} +.tl-slidenav-next .tl-slidenav-title, +.tl-slidenav-next .tl-slidenav-description { + margin-left: 20px; +} +.tl-slidenav-next .tl-slidenav-icon { + margin-left: 76px; +} +.tl-slidenav-next .tl-slidenav-icon:before { + content: "\e64f"; +} +.tl-slidenav-previous { + text-align: left; + margin-left: 10px; +} +.tl-slidenav-previous .tl-slidenav-icon { + margin-left: 0px; +} +.tl-slidenav-previous .tl-slidenav-icon:before { + content: "\e650"; +} +/* NAVIGATION HOVER +================================================== */ +.tl-slidenav-previous:hover .tl-slidenav-title, +.tl-slidenav-next:hover .tl-slidenav-title { + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; +} +.tl-slidenav-previous:hover .tl-slidenav-description, +.tl-slidenav-next:hover .tl-slidenav-description { + filter: alpha(opacity=50); + -khtml-opacity: 0.5; + -moz-opacity: 0.5; + opacity: 0.5; +} +.tl-slidenav-next:hover .tl-slidenav-icon { + margin-left: 80px; +} +.tl-slidenav-previous:hover .tl-slidenav-icon { + margin-left: -4px; +} +.tl-skinny .tl-slidenav-next { + right: 32px; +} +.tl-skinny .tl-slidenav-next .tl-slidenav-icon { + margin-left: 8px; +} +.tl-skinny .tl-slidenav-previous .tl-slidenav-content-container, +.tl-skinny .tl-slidenav-next .tl-slidenav-content-container { + width: 32px; + height: 32px; +} +.tl-skinny .tl-slidenav-previous .tl-slidenav-title, +.tl-skinny .tl-slidenav-next .tl-slidenav-title, +.tl-skinny .tl-slidenav-previous .tl-slidenav-description, +.tl-skinny .tl-slidenav-next .tl-slidenav-description { + display: none; +} +.tl-skinny .tl-slidenav-previous .tl-slidenav-icon, +.tl-skinny .tl-slidenav-next .tl-slidenav-icon { + filter: alpha(opacity=33); + -khtml-opacity: 0.33; + -moz-opacity: 0.33; + opacity: 0.33; +} +.tl-skinny .tl-slidenav-next:hover .tl-slidenav-icon { + margin-left: 12px; + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; +} +.tl-skinny .tl-slidenav-previous:hover .tl-slidenav-icon { + margin-left: -4px; + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; +} +.tl-layout-landscape.tl-mobile .tl-slidenav-next:hover { + right: 70px; +} +.tl-layout-landscape.tl-mobile .tl-slidenav-next:hover .tl-slidenav-icon { + margin-left: 8px; + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; +} +.tl-layout-landscape.tl-mobile .tl-slidenav-next:active .tl-slidenav-icon { + margin-left: 0px; + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; +} +.tl-layout-landscape.tl-mobile .tl-slidenav-previous:hover .tl-slidenav-icon { + margin-left: 80px; + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; +} +.tl-layout-landscape.tl-mobile .tl-slidenav-previous:active .tl-slidenav-icon { + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; + margin-left: -4px; +} +.tl-layout-portrait.tl-mobile .tl-slidenav-next:hover .tl-slidenav-icon { + filter: alpha(opacity=33); + -khtml-opacity: 0.33; + -moz-opacity: 0.33; + opacity: 0.33; +} +.tl-layout-portrait.tl-mobile .tl-slidenav-next:active .tl-slidenav-icon { + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; +} +.tl-layout-portrait.tl-mobile .tl-slidenav-previous:hover .tl-slidenav-icon { + filter: alpha(opacity=33); + -khtml-opacity: 0.33; + -moz-opacity: 0.33; + opacity: 0.33; +} +.tl-layout-portrait.tl-mobile .tl-slidenav-previous:active .tl-slidenav-icon { + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; +} +.tl-mobile .tl-slidenav-previous, +.tl-skinny.tl-mobile .tl-slidenav-previous, +.tl-skinny.tl-layout-landscape.tl-mobile .tl-slidenav-previous, +.tl-skinny.tl-layout-portrait.tl-mobile .tl-slidenav-previous, +.tl-mobile .tl-slidenav-next, +.tl-skinny.tl-mobile .tl-slidenav-next, +.tl-skinny.tl-layout-landscape.tl-mobile .tl-slidenav-next, +.tl-skinny.tl-layout-portrait.tl-mobile .tl-slidenav-next { + display: none; +} +/* StorySlider +================================================== */ +/* SLIDER CONTAINERS +================================================== */ +.tl-storyslider { + width: 100%; + height: 100%; + overflow: hidden; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + -o-user-select: none; + user-select: none; + position: relative; + box-sizing: content-box; + z-index: 8; +} +.tl-storyslider img, +.tl-storyslider embed, +.tl-storyslider object, +.tl-storyslider video, +.tl-storyslider iframe { + max-width: 100%; + position: relative; +} +.tl-storyslider .tl-slider-background { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: 1; +} +.tl-storyslider .tl-slider-touch-mask { + width: 100%; + height: 100%; + z-index: 25; + top: 0px; + left: 0px; + position: absolute; +} +.tl-storyslider .tl-slider-container-mask { + text-align: center; + width: 100%; + height: 100%; + position: relative; + z-index: 5; +} +.tl-storyslider .tl-slider-container-mask .tl-slider-container { + position: absolute; + top: 0px; + left: 0px; + width: 100%; + height: 100%; + text-align: center; +} +.tl-storyslider .tl-slider-container-mask .tl-slider-container .tl-slider-item-container { + width: 100%; + height: 100%; + display: table-cell; + vertical-align: middle; +} +/* Skinny +================================================== */ +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +/* Requires Variables.less +================================================== */ +.tl-media { + width: 100%; + min-width: 50%; + height: 100%; + float: left; + margin-top: auto; + margin-bottom: auto; + position: relative; +} +.tl-media .tl-media-content-container.tl-media-content-container-text { + border-right: 1px solid #000000; + padding-right: 20px; +} +.tl-media .tl-media-content-container .tl-media-content { + position: relative; + *zoom: 1; +} +.tl-media .tl-media-content-container .tl-media-content:before, +.tl-media .tl-media-content-container .tl-media-content:after { + display: table; + content: ""; +} +.tl-media .tl-media-content-container .tl-media-content:after { + clear: both; +} +.tl-media .tl-media-content-container .tl-media-content .tl-media-loaderror p { + color: #4d4d4d; + text-align: center; +} +.tl-media .tl-media-content-container .tl-media-content .tl-media-loaderror p span { + color: #4d4d4d; +} +.tl-media .tl-media-content-container .tl-media-content .tl-media-loaderror [class^="tl-icon-"], +.tl-media .tl-media-content-container .tl-media-content .tl-media-loaderror [class*=" tl-icon-"] { + font-size: 36px; + color: #4d4d4d; + text-align: center; +} +.tl-media .tl-media-content-container .tl-media-content img, +.tl-media .tl-media-content-container .tl-media-content embed, +.tl-media .tl-media-content-container .tl-media-content object, +.tl-media .tl-media-content-container .tl-media-content video { + max-width: 100%; + max-height: 100%; +} +/* Media Only Slides +================================================== */ +.tl-slide-media-only .tl-media .tl-media-content-container.tl-media-content-container-text { + border-right: none; + padding-right: 0; +} +/* Media Shodow +================================================== */ +.tl-media-shadow { + position: relative; + z-index: 1; + -webkit-box-shadow: 0 12px 10px -10px rgba(0, 0, 0, 0.6); + -moz-box-shadow: 0 12px 10px -10px rgba(0, 0, 0, 0.6); + box-shadow: 0 12px 10px -10px rgba(0, 0, 0, 0.6); +} +.tl-slide.tl-full-image-background a, +.tl-slide.tl-full-color-background a, +.tl-slide.tl-full-image-background .vcard a, +.tl-slide.tl-full-color-background .vcard a { + text-shadow: 1px 1px 1px #000; + color: #ffffff; +} +.tl-slide.tl-full-image-background a:hover, +.tl-slide.tl-full-color-background a:hover { + text-decoration: underline; + color: #c34528; +} +/* Credit +================================================== */ +.tl-credit { + color: #999999; + text-align: right; + display: block; + margin: 0 auto; + margin-top: 6px; + font-size: 10px; + line-height: 13px; +} +/* Caption +================================================== */ +.tl-caption { + text-align: left; + margin-right: auto; + margin-left: auto; + margin-top: 10px; + color: #666666; + font-size: 11px; + line-height: 14px; + text-rendering: optimizeLegibility; + word-wrap: break-word; +} +/* Full Image Background +================================================== */ +.tl-full-image-background .tl-media-shadow:before, +.tl-full-color-background .tl-media-shadow:before, +.tl-full-image-background .tl-media-shadow:after, +.tl-full-color-background .tl-media-shadow:after { + background: none; + -webkit-box-shadow: 0 0px 0px #000; + -moz-box-shadow: 0 0px 0px #000; + box-shadow: 0 0px 0px #000; +} +/* Skinny +================================================== */ +.tl-skinny .tl-media { + width: 100%; + height: auto; + float: none; + display: block; +} +.tl-skinny .tl-media .tl-media-content-container.tl-media-content-container-text { + border-right: 0; + padding-right: 0; +} +.tl-skinny .tl-media .tl-media-content-container .tl-credit, +.tl-skinny .tl-media .tl-media-content-container .tl-caption { + margin-top: 2px; + padding-left: 10px; + padding-right: 10px; + font-size: 8px; +} +.tl-skinny .tl-media .tl-media-content-container .tl-credit { + margin-top: 0px; +} +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +.tl-mobile.tl-skinny .tl-media { + width: 100%; + height: auto; + float: none; + display: block; +} +.tl-mobile.tl-skinny .tl-media .tl-media-content-container.tl-media-content-container-text { + border-right: 0; + padding-right: 0; +} +/* Requires Variables.less +================================================== */ +.tl-text { + width: 50%; + max-width: 50%; + min-width: 120px; + padding: 0 20px 0 20px; + display: table-cell; + vertical-align: middle; + text-align: left; + text-shadow: none; + color: #808080; +} +.tl-text p { + color: #808080; +} +.tl-text h2.tl-headline-title, +.tl-text h2.tl-headline { + margin-top: 0; +} +.tl-text .tl-headline-date, +.tl-text h3.tl-headline-date { + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-size: 15px; + line-height: 15px; + font-weight: normal; + margin: 0 0 3px 0; + color: #bfbfbf; +} +.tl-text .tl-headline-date small, +.tl-text h3.tl-headline-date small { + font-size: 15px; + line-height: 15px; + font-weight: normal; + color: #bfbfbf; +} +.tl-text .tl-text-date { + display: inline-block; + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-weight: normal; + margin-top: 10px; + font-size: 12px; + color: #bfbfbf; +} +.tl-full-image-background .tl-text, +.tl-full-color-background .tl-text, +.tl-full-image-background .tl-text p, +.tl-full-color-background .tl-text p { + color: #bfbfbf !important; + text-shadow: 1px 1px 2px #000; +} +.tl-full-image-background .tl-text .tl-headline-date, +.tl-full-color-background .tl-text .tl-headline-date, +.tl-full-image-background .tl-text p .tl-headline-date, +.tl-full-color-background .tl-text p .tl-headline-date, +.tl-full-image-background .tl-text h3.tl-headline-date, +.tl-full-color-background .tl-text h3.tl-headline-date, +.tl-full-image-background .tl-text p h3.tl-headline-date, +.tl-full-color-background .tl-text p h3.tl-headline-date { + color: #bfbfbf !important; +} +.tl-full-image-background .tl-text .tl-headline-date small, +.tl-full-color-background .tl-text .tl-headline-date small, +.tl-full-image-background .tl-text p .tl-headline-date small, +.tl-full-color-background .tl-text p .tl-headline-date small, +.tl-full-image-background .tl-text h3.tl-headline-date small, +.tl-full-color-background .tl-text h3.tl-headline-date small, +.tl-full-image-background .tl-text p h3.tl-headline-date small, +.tl-full-color-background .tl-text p h3.tl-headline-date small { + color: #bfbfbf !important; +} +.tl-full-image-background .tl-text a:hover, +.tl-full-color-background .tl-text a:hover, +.tl-full-image-background .tl-text p a:hover, +.tl-full-color-background .tl-text p a:hover { + text-decoration: underline; + color: #c34528; +} +/* Skinny +================================================== */ +.tl-skinny .tl-text { + width: 100%; + max-width: 100%; + min-width: auto; + float: none; + margin-top: 20px; +} +.tl-skinny .tl-text h2.tl-headline-title, +.tl-skinny .tl-text h2.tl-headline { + font-size: 32px; + line-height: 36px; +} +/* Medium +================================================== */ +.tl-medium .tl-text h2.tl-headline-title, +.tl-medium .tl-text h2.tl-headline { + font-size: 32px; + line-height: 36px; +} +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +.tl-mobile.tl-skinny .tl-media .tl-media-image { + max-height: 250px !important; +} +.tl-media .tl-media-twitter { + text-align: left; + clear: both; +} +.tl-media .tl-media-twitter blockquote { + margin: 0; + margin-right: 15px; + font-size: 15px; + line-height: 21px; + color: #CCC; +} +.tl-media .tl-media-twitter blockquote p { + font-size: 36px; + line-height: 39px; + color: #FFF; +} +.tl-media .tl-media-twitter blockquote p:before { + display: none; +} +.tl-media .tl-media-twitter blockquote p:after { + display: none; +} +.tl-media .tl-media-twitter .tl-icon-twitter { + color: #55ACEE; +} +.tl-media .tl-media-twitter .vcard a:hover, +.tl-media .tl-media-twitter .vcard a.tl-date:hover { + text-decoration: none; + color: #55ACEE; +} +.tl-media .tl-media-twitter .vcard a:hover .fn, +.tl-media .tl-media-twitter .vcard a.tl-date:hover .fn, +.tl-media .tl-media-twitter .vcard a:hover .nickname, +.tl-media .tl-media-twitter .vcard a.tl-date:hover .nickname { + color: #55ACEE; +} +.tl-slide-media-only .tl-media .tl-media-twitter { + width: 80%; + margin-left: auto; + margin-right: auto; +} +.tl-mobile.tl-skinny .tl-media .tl-media-twitter blockquote p { + font-size: 15px; + line-height: 21px; +} +.tl-skinny .tl-media .tl-media-twitter { + margin-left: 10px; + margin-right: 10px; +} +.tl-skinny .tl-media .tl-media-twitter blockquote p { + font-size: 24px; + line-height: 26px; +} +.tl-media .tl-media-blockquote { + text-align: left; + clear: both; +} +.tl-media .tl-media-blockquote blockquote { + margin: 0; + margin-right: 15px; + text-align: left; + font-size: 36px; + line-height: 39px; + color: #CCC; +} +.tl-media .tl-media-blockquote blockquote p { + font-size: 36px; + line-height: 39px; + color: #CCC; +} +.tl-media .tl-media-blockquote blockquote p:before, +.tl-media .tl-media-blockquote blockquote p:after { + display: inline-block; + font-size: 46px; +} +.tl-media .tl-media-blockquote blockquote p:before { + content: open-quote; + margin-right: 5px; +} +.tl-media .tl-media-blockquote blockquote p:after { + content: close-quote; + margin-left: 3px; +} +.tl-media .tl-media-blockquote blockquote cite { + font-size: 15px; + line-height: 21px; + color: #ffffff; + text-align: right; + margin-top: 15px; +} +.tl-slide-media-only .tl-media .tl-media-blockquote { + border-right: 0; + width: 80%; + margin-left: auto; + margin-right: auto; +} +@media only screen and (max-width: 800px), only screen and (max-device-width: 800px) { + .tl-media .tl-media-blockquote blockquote p { + font-size: 24px; + line-height: 26px; + } +} +@media only screen and (max-width: 500px), only screen and (max-device-width: 500px) { + .tl-media .tl-media-blockquote blockquote p { + font-size: 15px; + line-height: 21px; + } +} +.tl-mobile.tl-skinny .tl-media .tl-media-instagram { + max-height: 250px !important; +} +.tl-media .tl-media-profile { + border-radius: 50%; +} +.tl-media .tl-media-iframe { + width: 100%; + height: 100%; +} +.tl-media .tl-media-iframe iframe { + width: 100%; + height: 100%; +} +.tl-media .tl-media-wikipedia { + text-align: left; + margin-left: auto; + margin-right: auto; + clear: both; +} +.tl-media .tl-media-wikipedia .tl-icon-wikipedia { + font-size: 32px; + margin-right: 10px; + float: left; + padding-top: 3px; +} +.tl-media .tl-media-wikipedia .tl-wikipedia-pageimage { + float: left; + margin-right: 10px; + margin-bottom: 5px; + margin-top: 5px; +} +.tl-media .tl-media-wikipedia .tl-wikipedia-title { + margin-left: 60px; + padding-left: 10px; + border-left: 1px solid #000000; + margin-bottom: 10px; +} +.tl-media .tl-media-wikipedia .tl-wikipedia-source { + font-size: 13px; + line-height: 15px; + font-style: italic; + margin-top: 3px; + display: block; + color: rgba(255, 255, 255, 0.5); +} +.tl-media .tl-media-wikipedia h4 { + margin-top: 0px; + margin-bottom: 0px; +} +.tl-media .tl-media-wikipedia h4 a { + color: #FFF; + text-decoration: none; +} +.tl-media .tl-media-wikipedia p { + font-size: 13px; + line-height: 19px; +} +.tl-slide-media-only .tl-media .tl-media-wikipedia { + border-right: 0; + border-top: 1px solid #000000; + width: 80%; + margin-left: auto; + margin-right: auto; + margin-top: 25px; + padding-top: 25px; +} +.tl-slide.tl-full-image-background .tl-media .tl-media-wikipedia, +.tl-slide.tl-full-color-background .tl-media .tl-media-wikipedia { + padding: 20px; + /* Fallback for web browsers that doesn't support RGBa */ + background: #000000 transparent; + /* RGBa with 0.6 opacity */ + background: rgba(0, 0, 0, 0.6); + -webkit-border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; +} +.tl-slide.tl-full-image-background .tl-media .tl-media-wikipedia h4 a, +.tl-slide.tl-full-color-background .tl-media .tl-media-wikipedia h4 a { + color: #FFF !important; + text-shadow: 1px 1px 1px #000 !important; +} +.tl-slide.tl-full-image-background .tl-media .tl-media-wikipedia a:hover, +.tl-slide.tl-full-color-background .tl-media .tl-media-wikipedia a:hover { + text-decoration: underline; + color: #c34528; +} +.tl-slide.tl-full-image-background .tl-media .tl-media-wikipedia .tl-wikipedia-title, +.tl-slide.tl-full-color-background .tl-media .tl-media-wikipedia .tl-wikipedia-title { + border-color: rgba(0, 0, 0, 0.25); +} +.tl-slide.tl-full-image-background .tl-media .tl-media-wikipedia .tl-wikipedia-source, +.tl-slide.tl-full-color-background .tl-media .tl-media-wikipedia .tl-wikipedia-source { + color: rgba(0, 0, 0, 0.85); +} +.tl-mobile.tl-skinny .tl-media .tl-media-wikipedia, +.tl-skinny .tl-media .tl-media-wikipedia { + margin-left: 10px; + margin-right: 10px; +} +.tl-media .tl-media-website { + text-align: left; + margin-left: auto; + margin-right: auto; + clear: both; +} +.tl-media .tl-media-website .tl-media-website-description { + font-size: 16px; + line-height: 19px; + font-style: italic; + margin-bottom: 10px; + text-transform: uppercase; +} +.tl-media .tl-media-website h4 { + margin-top: 0px; + margin-bottom: 0px; + line-height: 1; +} +.tl-media .tl-media-website h4 a { + color: #FFF; + text-decoration: none; +} +.tl-media .tl-media-website p { + font-size: 13px; + line-height: 19px; +} +.tl-media .tl-media-content-container .tl-media-content .tl-media-website img { + float: right; + max-width: 120px; + max-height: 120px; + margin: 4px 0 0 15px; +} +.tl-media .tl-media-content-container .tl-media-content .tl-media-website img.tl-media-website-icon { + max-width: 16px; + max-height: 16px; + float: none; + margin: 0; + margin-right: 3px; +} +.tl-slide.tl-full-image-background .tl-media .tl-media-website, +.tl-slide.tl-full-color-background .tl-media .tl-media-website { + padding: 20px; + /* Fallback for web browsers that doesn't support RGBa */ + background: #000000 transparent; + /* RGBa with 0.6 opacity */ + background: rgba(0, 0, 0, 0.6); + -webkit-border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; +} +.tl-slide.tl-full-image-background .tl-media .tl-media-website h4 a, +.tl-slide.tl-full-color-background .tl-media .tl-media-website h4 a { + color: #FFF !important; + text-shadow: 1px 1px 1px #000 !important; +} +.tl-slide.tl-full-image-background .tl-media .tl-media-website a:hover, +.tl-slide.tl-full-color-background .tl-media .tl-media-website a:hover { + text-decoration: underline; + color: #c34528; +} +.tl-mobile.tl-skinny .tl-media .tl-media-website { + margin-left: 10px; + margin-right: 10px; +} +/* Timeline +================================================== */ +.tl-timeline { + width: 100%; + height: 100%; + font-size: 16px; + line-height: normal; + overflow: hidden; + position: relative; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + -o-user-select: none; + user-select: none; + background-color: #333; + color: #808080; + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; +} +.tl-timeline.tl-timeline-embed { + box-sizing: border-box; + border-top: 1px solid #000000; + border-bottom: 1px solid #000000; + border-radius: 0; +} +.tl-timeline.tl-timeline-full-embed { + box-sizing: border-box; + border: 1px solid #000000; + border-radius: 8px; +} +/* Portrait +================================================== */ +.tl-layout-portrait .tl-storyslider { + -webkit-box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.2); + -moz-box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.2); + box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.2); +} +.tl-rtl .tl-text-content, +.tl-rtl .tl-headline, +.tl-rtl .tl-media-blockquote, +.tl-rtl .tl-headline-date, +.tl-rtl .tl-timeline blockquote p, +.tl-rtl .tl-media-website, +.tl-rtl .tl-media-wikipedia, +.tl-rtl .tl-media .tl-media-blockquote blockquote, +.tl-rtl .blockquote, +.tl-rtl blockquote p, +.tl-rtl .tl-text-content p { + text-align: right; + direction: rtl; +} +.tl-rtl .tl-slide-media-only .tl-headline, +.tl-rtl .tl-slide-media-only .tl-headline-date { + text-align: center; +} +.tl-rtl .tl-timemarker-text { + margin-right: 35px; +} +.tl-rtl .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container { + float: right; +} +.tl-rtl .tl-caption { + text-align: right; +} +.tl-rtl .tl-credit { + text-align: left; +} diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/timeline.css b/helpdesk/static/helpdesk/vendor/timeline3/css/timeline.css new file mode 100644 index 00000000..5832a7eb --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/timeline.css @@ -0,0 +1,3131 @@ +/*! + Timeline JS 3 + + Designed and built by Zach Wise for the Northwestern University Knight Lab + + This Source Code Form is subject to the terms of the Mozilla Public + License, v. 2.0. If a copy of the MPL was not distributed with this + file, You can obtain one at https://mozilla.org/MPL/2.0/. + +*/ +/* Includes +================================================== */ +/* VARIABLES +----------------------------------------------------- */ +/* ICON PATH +================================================== */ +/* TYPEFACE +================================================== */ +/* COLOR SCHEME +================================================== */ +/* UI COLOR +================================================== */ +/* UI +================================================== */ +/* Animation +================================================== */ +/* GFX +================================================== */ +/*! + Timeline JS 3 + + Designed and built by Zach Wise for the Northwestern University Knight Lab + + This Source Code Form is subject to the terms of the Mozilla Public + License, v. 2.0. If a copy of the MPL was not distributed with this + file, You can obtain one at https://mozilla.org/MPL/2.0/. + +*/ +/* Includes +================================================== */ +/* Mixins.less + Snippets of reusable CSS to develop faster and keep code readable + * ----------------------------------------------------------------- */ +/* Reset +------------------------------------------------------------------------------------------- */ +.tl-storyjs { + /* Reset tags and common classes + Display in IE6-9 and FF3 + Based on: http://github.com/necolas/normalize.css + ------------------------------------------------------------------------------------------- */ + /* Prevents modern browsers from displaying 'audio' without controls + Based on: http://github.com/necolas/normalize.css + ------------------------------------------------------------------------------------------- */ + /* Prevents sub and sup affecting line-height in all browsers + Based on: http://github.com/necolas/normalize.css + ------------------------------------------------------------------------------------------- */ + /* Img border in a's and image quality + Based on: http://github.com/necolas/normalize.css + ------------------------------------------------------------------------------------------- */ + /* Forms + Based on: http://github.com/necolas/normalize.css + ------------------------------------------------------------------------------------------- */ +} +.tl-storyjs div * { + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; +} +.tl-storyjs h1, +.tl-storyjs h2, +.tl-storyjs h3, +.tl-storyjs h4, +.tl-storyjs h5, +.tl-storyjs h6, +.tl-storyjs p, +.tl-storyjs blockquote, +.tl-storyjs pre, +.tl-storyjs a, +.tl-storyjs abbr, +.tl-storyjs acronym, +.tl-storyjs address, +.tl-storyjs cite, +.tl-storyjs code, +.tl-storyjs del, +.tl-storyjs dfn, +.tl-storyjs em, +.tl-storyjs img, +.tl-storyjs q, +.tl-storyjs s, +.tl-storyjs samp, +.tl-storyjs small, +.tl-storyjs strike, +.tl-storyjs strong, +.tl-storyjs sub, +.tl-storyjs sup, +.tl-storyjs tt, +.tl-storyjs var, +.tl-storyjs dd, +.tl-storyjs dl, +.tl-storyjs dt, +.tl-storyjs li, +.tl-storyjs ol, +.tl-storyjs ul, +.tl-storyjs fieldset, +.tl-storyjs form, +.tl-storyjs label, +.tl-storyjs legend, +.tl-storyjs button, +.tl-storyjs table, +.tl-storyjs caption, +.tl-storyjs tbody, +.tl-storyjs tfoot, +.tl-storyjs thead, +.tl-storyjs tr, +.tl-storyjs th, +.tl-storyjs td, +.tl-storyjs .tl-container, +.tl-storyjs .content-container, +.tl-storyjs .media, +.tl-storyjs .text, +.tl-storyjs .tl-slider, +.tl-storyjs .slider, +.tl-storyjs .date, +.tl-storyjs .title, +.tl-storyjs .message, +.tl-storyjs .map, +.tl-storyjs .credit, +.tl-storyjs .caption, +.tl-storyjs .tl-feedback, +.tl-storyjs .tl-feature, +.tl-storyjs .toolbar, +.tl-storyjs .marker, +.tl-storyjs .dot, +.tl-storyjs .line, +.tl-storyjs .flag, +.tl-storyjs .time, +.tl-storyjs .era, +.tl-storyjs .major, +.tl-storyjs .minor, +.tl-storyjs .tl-navigation, +.tl-storyjs .start, +.tl-storyjs .active { + margin: 0; + padding: 0; + border: 0; + font-weight: normal; + font-style: normal; + font-size: 100%; + line-height: 1; + font-family: inherit; + width: auto; + float: none; +} +.tl-storyjs h1, +.tl-storyjs h2, +.tl-storyjs h3, +.tl-storyjs h4, +.tl-storyjs h5, +.tl-storyjs h6 { + clear: none; +} +.tl-storyjs table { + border-collapse: collapse; + border-spacing: 0; +} +.tl-storyjs ol, +.tl-storyjs ul { + list-style: none; +} +.tl-storyjs q:before, +.tl-storyjs q:after, +.tl-storyjs blockquote:before, +.tl-storyjs blockquote:after { + content: ""; +} +.tl-storyjs a:focus { + outline: thin dotted; +} +.tl-storyjs a:hover, +.tl-storyjs a:active { + outline: 0; +} +.tl-storyjs article, +.tl-storyjs aside, +.tl-storyjs details, +.tl-storyjs figcaption, +.tl-storyjs figure, +.tl-storyjs footer, +.tl-storyjs header, +.tl-storyjs hgroup, +.tl-storyjs nav, +.tl-storyjs section { + display: block; +} +.tl-storyjs audio, +.tl-storyjs canvas, +.tl-storyjs video { + display: inline-block; + *display: inline; + *zoom: 1; +} +.tl-storyjs audio:not([controls]) { + display: none; +} +.tl-storyjs div { + max-width: none; +} +.tl-storyjs sub, +.tl-storyjs sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} +.tl-storyjs sup { + top: -0.5em; +} +.tl-storyjs sub { + bottom: -0.25em; +} +.tl-storyjs img { + border: 0; + -ms-interpolation-mode: bicubic; +} +.tl-storyjs button, +.tl-storyjs input, +.tl-storyjs select, +.tl-storyjs textarea { + font-size: 100%; + margin: 0; + vertical-align: baseline; + *vertical-align: middle; +} +.tl-storyjs button, +.tl-storyjs input { + line-height: normal; + *overflow: visible; +} +.tl-storyjs button::-moz-focus-inner, +.tl-storyjs input::-moz-focus-inner { + border: 0; + padding: 0; +} +.tl-storyjs button, +.tl-storyjs input[type="button"], +.tl-storyjs input[type="reset"], +.tl-storyjs input[type="submit"] { + cursor: pointer; + -webkit-appearance: button; +} +.tl-storyjs input[type="search"] { + -webkit-appearance: textfield; + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; +} +.tl-storyjs input[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} +.tl-storyjs textarea { + overflow: auto; + vertical-align: top; +} +.tl-timeline { + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + /* VCard + ================================================== */ +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3, +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + color: #000; +} +.tl-timeline h1, +.tl-timeline h2, +.tl-timeline h3 { + font-size: 28px; + line-height: 28px; +} +.tl-timeline h1 small, +.tl-timeline h2 small, +.tl-timeline h3 small { + font-size: 24px; + line-height: 24px; +} +.tl-timeline h4, +.tl-timeline h5, +.tl-timeline h6 { + font-size: 24px; + line-height: 24px; + margin-bottom: 0px; +} +.tl-timeline h4 small, +.tl-timeline h5 small, +.tl-timeline h6 small { + font-size: 15px; + line-height: 15px; +} +.tl-timeline h2.tl-headline-title { + font-size: 38px; + line-height: 38px; +} +.tl-timeline h2.tl-headline-title small { + display: block; + margin-top: 5px; + font-size: 24px; + line-height: 24px; +} +.tl-timeline h2 { + margin-top: 20px; + margin-bottom: 5px; +} +.tl-timeline p { + margin-top: 5px; + margin-bottom: 10px; + font-size: 15px; + line-height: 1.42857143; + color: #666666; +} +.tl-timeline p.lead { + font-size: 24px; +} +.tl-timeline p a { + /* + color: lighten(@color-dark, 40%); + text-decoration: none; + background-image: -moz-linear-gradient(top, fade(lighten(@color-dark, 40%), 0%) 50%, fade(lighten(@color-dark, 40%), 60%) 50%); + background-image: -webkit-linear-gradient(top, fade(lighten(@color-dark, 40%), 0%) 50%, fade(lighten(@color-dark, 40%), 60%) 50%); + background-image: -o-linear-gradient(top, fade(lighten(@color-dark, 40%), 0%) 50%, fade(lighten(@color-dark, 40%), 60%) 50%); + background-image: linear-gradient(to bottom, fade(lighten(@color-dark, 40%), 0%) 50%, fade(lighten(@color-dark, 40%), 60%) 50%); + background-repeat: repeat-x; + background-size: 2px 2px; + background-position: 0 @base-font-size+2; + text-shadow: -2px -1px 0 white, 2px -1px 0 white, -2px 1px 0 white, 2px 1px 0 white; + &:hover, + &:focus { + color:@color-theme; + text-decoration: none; + } + */ + color: #666666; + text-decoration: underline; +} +.tl-timeline p a:hover, +.tl-timeline p a:focus { + color: #c34528; +} +@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) { + .tl-timeline p a { + text-decoration: underline; + background-image: none; + text-shadow: none; + } + .tl-timeline p a:hover, + .tl-timeline p a:focus { + color: #c34528; + text-decoration: underline; + } +} +.tl-timeline b, +.tl-timeline strong { + font-weight: bold; +} +.tl-timeline i, +.tl-timeline em { + font-style: italic; +} +.tl-timeline a { + text-decoration: none; + color: #c34528; +} +.tl-timeline a:hover { + text-decoration: underline; + color: #6e2717; +} +.tl-timeline .tl-caption, +.tl-timeline .tl-credit, +.tl-timeline .tl-slidenav-next, +.tl-timeline .tl-slidenav-previous { + font-size: 11px; + line-height: 11px; +} +.tl-timeline .tl-caption a, +.tl-timeline .tl-credit a, +.tl-timeline .tl-slidenav-next a, +.tl-timeline .tl-slidenav-previous a { + color: #000; +} +.tl-timeline .tl-makelink { + word-break: break-all; + word-break: break-word; + -webkit-hyphens: auto; + -moz-hyphens: auto; + hyphens: auto; +} +.tl-timeline blockquote, +.tl-timeline blockquote p { + font-family: "Georgia", "Times New Roman", Times, serif; + color: #999999; + font-size: 24px; + line-height: 24px; + text-align: left; + background: transparent; + border: 0px; + padding: 0px; +} +.tl-timeline blockquote cite, +.tl-timeline blockquote p cite { + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-size: 11px; + color: #666666; + display: block; + text-align: right; + font-style: normal; +} +.tl-timeline blockquote cite:before, +.tl-timeline blockquote p cite:before { + content: "\2014"; +} +.tl-timeline blockquote p:before { + content: open-quote; + display: inline-block; + font-size: 28px; + position: relative; + top: 8px; + margin-right: 5px; +} +.tl-timeline blockquote p:after { + content: close-quote; + display: inline-block; + font-size: 28px; + position: relative; + top: 8px; + margin-left: 3px; +} +.tl-timeline blockquote { + margin: 10px; +} +.tl-timeline blockquote p { + margin: 0; +} +.tl-timeline .vcard { + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-size: 15px; + line-height: 15px; + *zoom: 1; + margin-bottom: 15px; + margin-top: 10px; +} +.tl-timeline .vcard:before, +.tl-timeline .vcard:after { + display: table; + content: ""; +} +.tl-timeline .vcard:after { + clear: both; +} +.tl-timeline .vcard .twitter-date { + text-align: left; + font-size: 11px; +} +.tl-timeline .vcard .author { + float: right; +} +.tl-timeline .vcard a { + color: #333333; + text-decoration: none; +} +.tl-timeline .vcard a:hover { + text-decoration: none; +} +.tl-timeline .vcard a:hover .fn, +.tl-timeline .vcard a:hover .nickname { + color: #c34528; +} +.tl-timeline .vcard .fn, +.tl-timeline .vcard .nickname { + padding-left: 42px; +} +.tl-timeline .vcard .fn { + display: block; + font-weight: bold; +} +.tl-timeline .vcard .nickname { + margin-top: 1px; + display: block; + color: #666666; +} +.tl-timeline .vcard .avatar { + float: left; + display: block; + width: 32px; + height: 32px; +} +.tl-timeline .vcard .avatar img { + -moz-border-radius: 5px; + -webkit-border-radius: 5px; + border-radius: 5px; +} +.tl-timeline .tl-text ul { + padding: 0px; + padding-left: 30px; + margin: 0; +} +.tl-timeline .tl-text ul li { + margin-bottom: 5px; +} +.tl-timeline .tl-button-calltoaction { + cursor: pointer; + font-weight: bold; + padding-top: 10px; + margin-bottom: 10px; + padding-bottom: 10px; +} +.tl-timeline .tl-button-calltoaction .tl-button-calltoaction-text { + display: inline-block; + background-color: #c34528; + color: #fff; + padding: 10px 15px 10px 15px; + border-radius: 7px; +} +.tl-timeline .tl-note { + display: block; + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-style: italic; + background-color: #e6e6e6; + font-size: 15px; + line-height: 17px; + padding: 10px; + -webkit-border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; + color: #8a6d3b; + background-color: #fcf8e3; + border: 1px solid #faebcc; + text-shadow: none; +} +@media only screen and (max-width: 800px), only screen and (max-device-width: 800px) { + .tl-timeline h1, + .tl-timeline h2, + .tl-timeline h3 { + font-size: 28px; + line-height: 28px; + } +} +@media only screen and (max-width: 500px), only screen and (max-device-width: 500px) { + .tl-timeline h1, + .tl-timeline h2, + .tl-timeline h3 { + font-size: 24px; + line-height: 24px; + } +} +.tl-skinny h2 { + margin-top: 0px; +} +/* Icons +================================================== */ +@font-face { + font-family: 'tl-icons'; + src: url(../css/icons/tl-icons.eot); + src: url(../css/icons/tl-icons.eot?#iefix) format('embedded-opentype'), url(../css/icons/tl-icons.ttf) format('truetype'), url(../css/icons/tl-icons.woff2) format('woff2'), url(../css/icons/tl-icons.woff) format('woff'), url(../css/icons/tl-icons.svg#tl-icons) format('svg'); + font-weight: normal; + font-style: normal; +} +[class^="tl-icon-"], +[class*=" tl-icon-"] { + font-family: 'tl-icons'; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + /* Better Font Rendering =========== */ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} +.tl-icon-vine:after { + content: "\e64d"; +} +.tl-icon-wikipedia:after { + content: "\e64e"; +} +.tl-icon-chevron-right:after { + content: "\e64f"; +} +.tl-icon-chevron-left:after { + content: "\e650"; +} +.tl-icon-youtube-logo:after { + content: "\e651"; +} +.tl-icon-foursquare:after { + content: "\e652"; +} +.tl-icon-camera-retro:after { + content: "\e653"; +} +.tl-icon-doc:after { + content: "\e654"; +} +.tl-icon-weibo:after { + content: "\e655"; +} +.tl-icon-resize-horizontal:after { + content: "\e656"; +} +.tl-icon-resize-vertical:after { + content: "\e657"; +} +.tl-icon-resize-full:after { + content: "\e658"; +} +.tl-icon-resize-small:after { + content: "\e659"; +} +.tl-icon-twitter:after { + content: "\e62b"; +} +.tl-icon-google-plus:after { + content: "\e62c"; +} +.tl-icon-video:after { + content: "\e62d"; +} +.tl-icon-youtube:after { + content: "\e62d"; +} +.tl-icon-plaintext:after { + content: "\e62e"; +} +.tl-icon-storify:after { + content: "\e62e"; +} +.tl-icon-image-v2:after { + content: "\e62f"; +} +.tl-icon-quote-v2:after { + content: "\e630"; +} +.tl-icon-zoom-in:after { + content: "\e631"; +} +.tl-icon-zoom-out:after { + content: "\e632"; +} +.tl-icon-list:after { + content: "\e633"; +} +.tl-icon-music:after { + content: "\e634"; +} +.tl-icon-spotify:after { + content: "\e634"; +} +.tl-icon-location:after { + content: "\e635"; +} +.tl-icon-googlemaps:after { + content: "\e635"; +} +.tl-icon-web:after { + content: "\e636"; +} +.tl-icon-share-v2:after { + content: "\e637"; +} +.tl-icon-soundcloud:after { + content: "\e639"; +} +.tl-icon-video-v2:after { + content: "\e63a"; +} +.tl-icon-dailymotion:after { + content: "\e63a"; +} +.tl-icon-tumblr:after { + content: "\e63b"; +} +.tl-icon-lastfm:after { + content: "\e63c"; +} +.tl-icon-github:after { + content: "\e63d"; +} +.tl-icon-goback:after { + content: "\e63e"; +} +.tl-icon-doc-v2:after { + content: "\e63f"; +} +.tl-icon-googledrive:after { + content: "\e640"; +} +.tl-icon-facebook:after { + content: "\e641"; +} +.tl-icon-flickr:after { + content: "\e642"; +} +.tl-icon-dribbble:after { + content: "\e643"; +} +.tl-icon-image:after { + content: "\e605"; +} +.tl-icon-vimeo:after { + content: "\e606"; +} +.tl-icon-instagram:after { + content: "\e644"; +} +.tl-icon-pinterest:after { + content: "\e645"; +} +.tl-icon-arrow-left:after { + content: "\e646"; +} +.tl-icon-arrow-down:after { + content: "\e647"; +} +.tl-icon-arrow-up:after { + content: "\e648"; +} +.tl-icon-arrow-right:after { + content: "\e649"; +} +.tl-icon-share:after { + content: "\e64a"; +} +.tl-icon-blockquote:after { + content: "\e64b"; +} +.tl-icon-evernote:after { + content: "\e64c"; +} +.tl-icon-mappin:after { + content: "\e600"; +} +.tl-icon-swipe-right:after { + content: "\e601"; +} +.tl-icon-swipe-left:after { + content: "\e602"; +} +.tl-icon-touch-spread:after { + content: "\e603"; +} +.tl-icon-touch-pinch:after { + content: "\e604"; +} +/* Disable Text selection when dragging +================================================== */ +.tl-dragging { + -webkit-touch-callout: none; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + -o-user-select: none; + user-select: none; +} +/* MenuBar +================================================== */ +.tl-menubar { + position: absolute; + z-index: 11; + text-align: center; + color: #333; + overflow: hidden; + border-bottom-right-radius: 10px; + border-top-right-radius: 10px; + top: 100%; + left: 50%; + left: 0; +} +/* Skinny +================================================== */ +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +/* Color +================================================== */ +/* +.tl-sizebar.tl-sizebar-inverted { + border-bottom: 1px solid #FFF; + //background-color:#000; + color:#a5a5a5; + .tl-sizebar-button { + border-left: 1px solid darken(@color-background, 70); + //color:#a5a5a5; + } + .tl-sizebar-button:hover { + //background:@color-theme; + color:@color-background; + } +} +.tl-sizebar.tl-sizebar-inverted:before { + background-color:#000; + //.gradient-vertical (rgba(0,0,0,0.25), rgba(0,0,0,1)); + //.translucent-background(rgb(0,0,0), .5); + border-top: 2px solid #000; + animation: invertToBlack 1s; + -webkit-animation:invertToBlack 1s; +} +*/ +@keyframes invertToBlack { + from { + background-color: #FFF; + } + to { + background-color: #000; + } +} +@-webkit-keyframes invertToBlack { + from { + background: #FFF; + } + to { + background: #000; + } +} +@keyframes invertToWhite { + from { + background-color: #000; + } + to { + background-color: #FFF; + } +} +@-webkit-keyframes invertToWhite { + from { + background: #000; + } + to { + background: #FFF; + } +} +/* MenuBar Button +================================================== */ +.tl-menubar-button { + font-size: 18px; + line-height: 18px; + background-color: rgba(242, 242, 242, 0.9); + cursor: pointer; + padding: 6px 12px 6px 12px; + display: inline-block; + display: block; + color: #bfbfbf; +} +.tl-menubar-button.tl-menubar-button-inactive { + opacity: 0.33; +} +.tl-menubar-button:hover { + background: #333; + color: #FFF; +} +.tl-menubar-button:hover.tl-menubar-button-inactive { + color: #bfbfbf; + background-color: rgba(242, 242, 242, 0.9); +} +.tl-mobile .tl-menubar-button { + display: block; +} +.tl-mobile .tl-menubar-button:hover { + background-color: rgba(242, 242, 242, 0.67); + color: #737373; +} +.tl-mobile .tl-menubar-button:active { + background: #c34528; + color: #FFF; +} +@keyframes invertToBlack { + from { + background-color: #FFF; + } + to { + background-color: #000; + } +} +@-webkit-keyframes invertToBlack { + from { + background: #FFF; + } + to { + background: #000; + } +} +@keyframes invertToWhite { + from { + background-color: #000; + } + to { + background-color: #FFF; + } +} +@-webkit-keyframes invertToWhite { + from { + background: #000; + } + to { + background: #FFF; + } +} +/* MESSAGE +================================================== */ +.tl-message, +.tl-message-full { + width: 100%; + height: 100%; + position: absolute; + display: table; + overflow: hidden; + top: 0px; + left: 0px; + z-index: 99; + margin: auto; + text-align: center; +} +.tl-message .tl-message-container, +.tl-message-full .tl-message-container { + padding: 20px; + margin: 20px; + text-align: center; + vertical-align: middle; + display: table-cell; +} +.tl-message .tl-message-container .tl-message-content, +.tl-message-full .tl-message-container .tl-message-content { + color: #666; + text-align: center; + font-size: 11px; + line-height: 13px; + text-transform: uppercase; + margin-top: 7.5px; + margin-bottom: 7.5px; + text-shadow: 1px 1px 1px #FFF; +} +.tl-message .tl-message-container .tl-message-content strong, +.tl-message-full .tl-message-container .tl-message-content strong { + text-transform: uppercase; +} +.tl-message .tl-message-container .tl-loading-icon, +.tl-message-full .tl-message-container .tl-loading-icon { + width: 30px; + height: 30px; + background-color: #666; + vertical-align: middle; + -webkit-box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.1); + -moz-box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.1); + box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.1); + margin-left: auto; + margin-right: auto; + text-align: center; + -webkit-animation: rotateplane 1.2s infinite ease-in-out; + animation: rotateplane 1.2s infinite ease-in-out; +} +@-webkit-keyframes rotateplane { + 0% { + -webkit-transform: perspective(120px); + } + 50% { + -webkit-transform: perspective(120px) rotateY(180deg); + } + 100% { + -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg); + } +} +@keyframes rotateplane { + 0% { + transform: perspective(120px) rotateX(0deg) rotateY(0deg); + } + 50% { + transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); + } + 100% { + transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); + } +} +.tl-message-full { + background-color: hsla(0, 0%, 100%, 0.8); +} +.tl-message-full [class^="tl-icon-"], +.tl-message-full [class*=" tl-icon-"] { + color: #666; + font-size: 72px; +} +.tl-message-full .tl-message-container .tl-message-content { + font-size: 22px; + line-height: 22px; + text-shadow: none; + color: #666; + text-transform: none; + font-weight: normal; +} +.tl-message-full .tl-message-container .tl-message-content .tl-button { + display: inline-block; + cursor: pointer; + background-color: #FFF; + color: #333; + padding: 10px; + margin-top: 10px; + -webkit-border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; +} +/* TL.TimeNav +================================================== */ +.tl-timenav { + width: 100%; + background-color: #f2f2f2; + position: relative; + overflow: hidden; + border-top: 1px solid #e5e5e5; +} +.tl-timenav .tl-attribution { + cursor: pointer; + z-index: 9; + position: absolute; + bottom: 2px; + left: 0px; + font-size: 10px; + line-height: 10px; + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important; + background-color: rgba(255, 255, 255, 0.85); + padding: 3px; + /* + right:-26px; + top:30px; + transform: rotate(90deg); + -ms-transform: rotate(90deg); + -webkit-transform: rotate(90deg); + background-color: fadeout(@ui-background-color, 15%); + */ +} +.tl-timenav .tl-attribution a { + color: #cccccc; +} +.tl-timenav .tl-attribution a:hover { + color: #000; + text-decoration: none; +} +.tl-timenav .tl-attribution a:hover .tl-knightlab-logo { + background-color: #c34528; +} +.tl-timenav .tl-attribution .tl-knightlab-logo { + display: inline-block; + vertical-align: middle; + height: 8px; + width: 8px; + margin-right: 3px; + background-color: #c34528; + background-color: #cccccc; + transform: rotate(45deg); + -ms-transform: rotate(45deg); + -webkit-transform: rotate(45deg); +} +.tl-timenav .tl-timenav-line { + position: absolute; + top: 0; + left: 50%; + width: 1px; + height: 100%; + background-color: #d9d9d9; + z-index: 2; + display: none; +} +.tl-timenav .tl-timenav-line:before, +.tl-timenav .tl-timenav-line:after { + font-family: 'tl-icons'; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + /* Better Font Rendering =========== */ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + color: #c34528; + font-size: 32px; + line-height: 32px; + position: absolute; + left: -14px; +} +.tl-timenav .tl-timenav-line:before { + top: -10px; +} +.tl-timenav .tl-timenav-line:after { + content: "\e648"; + bottom: 24px; +} +.tl-timenav .tl-timenav-slider { + position: absolute; + height: 100%; + width: 100%; + top: 0; +} +.tl-timenav .tl-timenav-slider.tl-timenav-slider-animate { + -webkit-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timenav .tl-timenav-slider .tl-timenav-slider-background { + position: absolute; + height: 100%; + width: 100%; + cursor: move; + z-index: 6; +} +.tl-timenav .tl-timenav-slider .tl-timenav-container-mask { + position: absolute; + height: 100%; + top: 0; +} +.tl-timenav .tl-timenav-slider .tl-timenav-container-mask .tl-timenav-container { + position: absolute; + height: 100%; +} +.tl-timenav .tl-timenav-slider .tl-timenav-container-mask .tl-timenav-container .tl-timenav-item-container { + position: absolute; + height: 100%; +} +/* Skinny +================================================== */ +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +/* TL.TimeMarker +================================================== */ +.tl-timemarker { + height: 100%; + position: absolute; + top: 0; + left: 0; + cursor: pointer; + /* Animate Left Width and Top + ================================================== */ + -webkit-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + /* Timespan + ================================================== */ + /* Lines + ================================================== */ + /* Content + ================================================== */ + /* Hover State + ================================================== */ + /* Hover Active State + ================================================== */ + /* Active Markers + ================================================== */ + /* Markers with End Dates + ================================================== */ + /* Markers with End Dates and Hover + ================================================== */ + /* Markers with End Dates and Active + ================================================== */ + /* Markers with End Dates and Active and Hover + ================================================== */ +} +.tl-timemarker.tl-timemarker-fast { + -webkit-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timemarker.tl-timemarker-fast .tl-timemarker-content-container { + -webkit-transition: width 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: width 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: width 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1); + transition: width 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timemarker.tl-timemarker-fast .tl-timemarker-timespan { + -webkit-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timemarker .tl-timemarker-timespan { + pointer-events: none; + position: absolute; + margin: 0; + width: 100%; + height: 100%; + background-color: rgba(229, 229, 229, 0.15); + border-top-right-radius: 4px; + border-top-left-radius: 4px; + -webkit-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timemarker .tl-timemarker-timespan .tl-timemarker-timespan-content { + display: none; + position: absolute; + width: 100%; + background-color: #e5e5e5; + border-top-left-radius: 4px; + border-top-right-radius: 4px; + height: 100px; + box-sizing: border-box; +} +.tl-timemarker .tl-timemarker-line-right { + display: none; + right: 0px; +} +.tl-timemarker .tl-timemarker-line-left { + width: 1px; + left: 0px; +} +.tl-timemarker .tl-timemarker-line-left, +.tl-timemarker .tl-timemarker-line-right { + margin-top: 7px; + -webkit-box-sizing: border-box; + /* Safari/Chrome, other WebKit */ + -moz-box-sizing: border-box; + /* Firefox, other Gecko */ + box-sizing: border-box; + border-left: 1px solid #d9d9d9; + z-index: 5; + content: " "; + position: absolute; + height: 100%; + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + box-shadow: 1px 1px 1px #FFF; +} +.tl-timemarker .tl-timemarker-line-left:after, +.tl-timemarker .tl-timemarker-line-right:after { + display: block; + content: " "; + position: absolute; + left: -4px; + bottom: 0px; + height: 6px; + width: 6px; + background-color: #919191; + z-index: 8; + -webkit-border-radius: 50%; + -moz-border-radius: 50%; + border-radius: 50%; +} +.tl-timemarker .tl-timemarker-content-container { + position: absolute; + background-color: #e5e5e5; + border: 0; + border-top-left-radius: 4px; + border-top-right-radius: 4px; + border-bottom-right-radius: 4px; + height: 100%; + width: 100px; + overflow: hidden; + z-index: 6; + -webkit-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + box-sizing: border-box; + border: 1px solid #d9d9d9; + box-shadow: 1px 1px 1px #FFF; +} +.tl-timemarker .tl-timemarker-content-container:hover { + z-index: 9; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content { + position: relative; + overflow: hidden; + height: 100%; + z-index: 8; + padding: 5px; + -webkit-box-sizing: border-box; + /* Safari/Chrome, other WebKit */ + -moz-box-sizing: border-box; + /* Firefox, other Gecko */ + box-sizing: border-box; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text { + overflow: hidden; + position: relative; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline, +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline p { + display: -webkit-box; + line-clamp: 2; + -webkit-line-clamp: 2; + box-orient: vertical; + -webkit-box-orient: vertical; + text-overflow: ellipsis; + font-size: 12px; + line-height: 12px; + height: 100%; + overflow: hidden; + font-weight: normal; + margin: 0; + color: #bfbfbf; + position: relative; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline.tl-headline-fadeout:after, +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline p.tl-headline-fadeout:after { + content: ""; + text-align: right; + position: absolute; + bottom: 0; + right: 0; + width: 100%; + height: 50%; + background: -moz-linear-gradient(top, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%); + /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(229, 229, 229, 0)), color-stop(50%, #e5e5e5)); + /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%); + /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%); + /* Opera 11.10+ */ + background: -ms-linear-gradient(top, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%); + /* IE10+ */ + background: linear-gradient(to bottom, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%); + /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@thecolor', endColorstr='@thecolor', GradientType=0); + /* IE6-9 */ +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container { + float: left; + max-width: 24px; + max-height: 24px; + overflow: hidden; + margin-right: 5px; + height: 100%; + -webkit-box-sizing: border-box; + /* Safari/Chrome, other WebKit */ + -moz-box-sizing: border-box; + /* Firefox, other Gecko */ + box-sizing: border-box; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container .tl-timemarker-media { + max-width: 24px; + max-height: 100%; + opacity: 0.25; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class^="tl-icon-"], +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class*=" tl-icon-"] { + display: block; + font-size: 24px; + color: #bfbfbf; + margin-top: 0px; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container .tl-icon-wikipedia { + font-size: 16px; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content.tl-timemarker-content-small .tl-timemarker-text h2.tl-headline { + display: block; + white-space: nowrap; + text-overflow: ellipsis; +} +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content.tl-timemarker-content-small .tl-timemarker-media-container [class^="tl-icon-"], +.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content.tl-timemarker-content-small .tl-timemarker-media-container [class*=" tl-icon-"] { + font-size: 12px; +} +.tl-timemarker:hover .tl-timemarker-timespan { + background-color: rgba(191, 191, 191, 0.15); +} +.tl-timemarker:hover .tl-timemarker-timespan .tl-timemarker-timespan-content { + background-color: #bfbfbf; +} +.tl-timemarker:hover .tl-timemarker-timespan .tl-timemarker-line-left, +.tl-timemarker:hover .tl-timemarker-timespan .tl-timemarker-line-right { + border-color: #a6a6a6; +} +.tl-timemarker:hover .tl-timemarker-timespan .tl-timemarker-line-left:after, +.tl-timemarker:hover .tl-timemarker-timespan .tl-timemarker-line-right:after { + background-color: #3d3d3d; +} +.tl-timemarker:hover .tl-timemarker-content-container { + background-color: #bfbfbf; + border-color: #a6a6a6; + -webkit-transition: height 250ms cubic-bezier(0.77, 0, 0.175, 1), width 250ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: height 250ms cubic-bezier(0.77, 0, 0.175, 1), width 250ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: height 250ms cubic-bezier(0.77, 0, 0.175, 1), width 250ms cubic-bezier(0.77, 0, 0.175, 1); + transition: height 250ms cubic-bezier(0.77, 0, 0.175, 1), width 250ms cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timemarker:hover .tl-timemarker-content-container.tl-timemarker-content-container-small { + width: 200px; +} +.tl-timemarker:hover .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline { + color: #FFF; +} +.tl-timemarker:hover .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline.tl-headline-fadeout:after { + background: -moz-linear-gradient(top, rgba(191, 191, 191, 0) 0%, #bfbfbf 80%); + /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(191, 191, 191, 0)), color-stop(80%, #bfbfbf)); + /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgba(191, 191, 191, 0) 0%, #bfbfbf 80%); + /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgba(191, 191, 191, 0) 0%, #bfbfbf 80%); + /* Opera 11.10+ */ + background: -ms-linear-gradient(top, rgba(191, 191, 191, 0) 0%, #bfbfbf 80%); + /* IE10+ */ + background: linear-gradient(to bottom, rgba(191, 191, 191, 0) 0%, #bfbfbf 80%); + /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@thecolor', endColorstr='@thecolor', GradientType=0); + /* IE6-9 */ +} +.tl-timemarker:hover .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container .tl-timemarker-media { + opacity: 1; +} +.tl-timemarker:hover .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class^="tl-icon-"], +.tl-timemarker:hover .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class*=" tl-icon-"] { + color: #FFF; +} +.tl-timemarker:hover.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline.tl-headline-fadeout:after { + background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFF 80%); + /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(80%, #FFF)); + /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFF 80%); + /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFF 80%); + /* Opera 11.10+ */ + background: -ms-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFF 80%); + /* IE10+ */ + background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #FFF 80%); + /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@thecolor', endColorstr='@thecolor', GradientType=0); + /* IE6-9 */ +} +.tl-timemarker:hover.tl-timemarker-active .tl-timemarker-line-left, +.tl-timemarker:hover.tl-timemarker-active .tl-timemarker-line-right { + border-color: #000; +} +.tl-timemarker:hover.tl-timemarker-active .tl-timemarker-line-left:after, +.tl-timemarker:hover.tl-timemarker-active .tl-timemarker-line-right:after { + background-color: #000; +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-timespan { + background-color: rgba(255, 255, 255, 0.5); + z-index: 8; +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-timespan .tl-timemarker-timespan-content { + background-color: #333; +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-line-left, +.tl-timemarker.tl-timemarker-active .tl-timemarker-line-right { + border-color: rgba(51, 51, 51, 0.5); + border-width: 1px; + z-index: 8; + box-shadow: 0px 1px 3px rgba(145, 145, 145, 0.5); +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-line-left:after, +.tl-timemarker.tl-timemarker-active .tl-timemarker-line-right:after { + background-color: #333; +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container { + background-color: #FFF; + color: #333; + z-index: 9; + border-color: rgba(51, 51, 51, 0.5); + box-shadow: 1px 1px 3px rgba(145, 145, 145, 0.5); +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline { + color: #333; +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline.tl-headline-fadeout:after { + background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFF 80%); + /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(80%, #FFF)); + /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFF 80%); + /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFF 80%); + /* Opera 11.10+ */ + background: -ms-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFF 80%); + /* IE10+ */ + background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #FFF 80%); + /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@thecolor', endColorstr='@thecolor', GradientType=0); + /* IE6-9 */ +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container .tl-timemarker-media { + opacity: 1; +} +.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class^="tl-icon-"], +.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class*=" tl-icon-"] { + color: #333; +} +.tl-timemarker.tl-timemarker-with-end .tl-timemarker-timespan .tl-timemarker-timespan-content { + display: block; +} +.tl-timemarker.tl-timemarker-with-end .tl-timemarker-timespan .tl-timemarker-line-left, +.tl-timemarker.tl-timemarker-with-end .tl-timemarker-timespan .tl-timemarker-line-right { + z-index: 5; +} +.tl-timemarker.tl-timemarker-with-end .tl-timemarker-timespan:after { + display: block; + content: " "; + position: absolute; + left: 0px; + bottom: -7px; + height: 6px; + width: 100%; + background-color: rgba(115, 115, 115, 0.15); + z-index: 6; + -webkit-border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; +} +.tl-timemarker.tl-timemarker-with-end .tl-timemarker-content-container.tl-timemarker-content-container-long { + box-shadow: none; +} +.tl-timemarker.tl-timemarker-with-end .tl-timemarker-line-right { + display: block; +} +.tl-timemarker.tl-timemarker-with-end .tl-timemarker-line-left { + box-shadow: none; +} +.tl-timemarker.tl-timemarker-with-end:hover .tl-timemarker-timespan:after { + background-color: rgba(0, 0, 0, 0.25); +} +.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-timespan:after { + background-color: rgba(51, 51, 51, 0.5); +} +.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-line-left, +.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-line-right { + border-width: 1px; +} +.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-line-left:after, +.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-line-right:after { + background-color: #333 !important; +} +.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-line-left { + box-shadow: none; +} +.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active:hover .tl-timemarker-timespan:after { + background-color: rgba(51, 51, 51, 0.5); +} +/* Skinny +================================================== */ +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +/* TL.TimeMarker +================================================== */ +.tl-timeera { + height: 100%; + height: 40px; + position: absolute; + bottom: 0; + left: 0; + pointer-events: none; + z-index: 3; + /* Animate Left Width and Top + ================================================== */ + -webkit-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + /* Timespan + ================================================== */ + /* Content + ================================================== */ +} +.tl-timeera.tl-timeera-fast { + -webkit-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timeera .tl-timeera-background { + position: absolute; + background-color: #28a6c3; + width: 100%; + height: 100%; + opacity: 1; +} +.tl-timeera.tl-timeera-color0 .tl-timeera-background { + background-color: #c34528; +} +.tl-timeera.tl-timeera-color1 .tl-timeera-background { + background-color: #28a6c3; +} +.tl-timeera.tl-timeera-color2 .tl-timeera-background { + background-color: #2832c3; +} +.tl-timeera.tl-timeera-color3 .tl-timeera-background { + background-color: #28c36c; +} +.tl-timeera.tl-timeera-color4 .tl-timeera-background { + background-color: #286dc3; +} +.tl-timeera.tl-timeera-color5 .tl-timeera-background { + background-color: #28c3a7; +} +.tl-timeera .tl-timeera-content-container { + position: absolute; + border: 0; + border-top-left-radius: 4px; + border-top-right-radius: 4px; + border-bottom-right-radius: 4px; + height: 100%; + width: 100px; + overflow: hidden; + -webkit-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + box-sizing: border-box; + border: 1px solid #d9d9d9; +} +.tl-timeera .tl-timeera-content-container .tl-timeera-content { + position: relative; + overflow: hidden; + height: 100%; + padding: 5px; + -webkit-box-sizing: border-box; + /* Safari/Chrome, other WebKit */ + -moz-box-sizing: border-box; + /* Firefox, other Gecko */ + box-sizing: border-box; +} +.tl-timeera .tl-timeera-content-container .tl-timeera-content .tl-timeera-text { + overflow: hidden; + position: relative; + height: 100%; +} +.tl-timeera .tl-timeera-content-container .tl-timeera-content .tl-timeera-text h2.tl-headline { + bottom: 0px; + position: absolute; + display: -webkit-box; + line-clamp: 4; + -webkit-line-clamp: 4; + box-orient: vertical; + -webkit-box-orient: vertical; + text-overflow: ellipsis; + font-size: 10px; + line-height: 10px; + overflow: hidden; + font-weight: normal; + margin: 0; + color: #FFF; + margin-left: 10px; +} +.tl-timeera .tl-timeera-content-container .tl-timeera-content .tl-timeera-text h2.tl-headline.tl-headline-fadeout:after { + content: ""; + text-align: right; + position: absolute; + bottom: 0; + right: 0; + width: 100%; + height: 50%; + background: -moz-linear-gradient(top, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%); + /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(229, 229, 229, 0)), color-stop(50%, #e5e5e5)); + /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%); + /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%); + /* Opera 11.10+ */ + background: -ms-linear-gradient(top, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%); + /* IE10+ */ + background: linear-gradient(to bottom, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%); + /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@thecolor', endColorstr='@thecolor', GradientType=0); + /* IE6-9 */ +} +/* Skinny +================================================== */ +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +/* TL.TimeMarker +================================================== */ +.tl-timegroup { + width: 100%; + position: absolute; + top: 0; + left: 0; + background-color: #f2f2f2; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; + align-items: center; + -ms-flex-align: center; + -webkit-align-items: center; + -webkit-box-align: center; + /* Animate Left Width and Top + ================================================== */ + -webkit-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timegroup .tl-timegroup-message { + color: #e0e0e0; + text-shadow: #FFF 0px 2px 2px; + margin-left: 80px; +} +.tl-timegroup.tl-timegroup-alternate { + background-color: #fafafa; +} +.tl-timegroup.tl-timegroup-hidden { + display: none; +} +/* Skinny +================================================== */ +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +/* TL.TimeAxis +================================================== */ +.tl-timeaxis-background { + height: 39px; + width: 100%; + position: absolute; + bottom: 0; + left: 0; + background-color: #FFF; + border-top: 1px solid #e5e5e5; + z-index: 2; +} +.tl-timeaxis { + height: 39px; + width: 100%; + position: absolute; + bottom: 0; + left: 0; + z-index: 3; +} +.tl-timeaxis .tl-timeaxis-content-container { + position: relative; + bottom: 0; + height: 39px; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major, +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor { + opacity: 0; + position: absolute; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major .tl-timeaxis-tick, +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick { + position: absolute; + display: block; + top: 0; + left: 0; + text-align: center; + font-weight: normal; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major .tl-timeaxis-tick .tl-timeaxis-tick-text, +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick .tl-timeaxis-tick-text { + display: inline-block; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major .tl-timeaxis-tick:before, +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick:before { + content: "|"; + display: block; + color: #FFF; + width: 1px; + overflow: hidden; + border-left: 1px solid #bfbfbf; + text-align: center; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major.tl-timeaxis-animate .tl-timeaxis-tick, +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor.tl-timeaxis-animate .tl-timeaxis-tick { + -webkit-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major.tl-timeaxis-animate-opacity .tl-timeaxis-tick, +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor.tl-timeaxis-animate-opacity .tl-timeaxis-tick { + -webkit-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major { + z-index: 1; + background-color: #FFF; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major .tl-timeaxis-tick { + font-size: 12px; + line-height: 14px; + color: #737373; + width: 100px; + margin-left: -50px; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major .tl-timeaxis-tick:before { + border-color: #a6a6a6; + font-size: 18px; + line-height: 18px; + margin-bottom: 2px; + margin-left: 50px; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick { + font-size: 11px; + line-height: 13px; + color: #bfbfbf; + width: 50px; + margin-left: -25px; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick .tl-timeaxis-tick-text { + opacity: 0; + white-space: normal; + padding-left: 2px; + padding-right: 2px; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick .tl-timeaxis-tick-text span { + display: block; + font-size: 9px; + line-height: 9px; + margin-top: -2px; + color: #e6e6e6; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick:before { + font-size: 9px; + line-height: 9px; + margin-left: 25px; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick.tl-timeaxis-tick-hidden .tl-timeaxis-tick-text { + opacity: 0 !important; +} +.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick.tl-timeaxis-tick-hidden:before { + opacity: 0.33; +} +/* Skinny +================================================== */ +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +.tlanimate { + -webkit-transform: translateZ(0); + -webkit-perspective: 1000; + -webkit-backface-visibility: hidden; +} +.tl-animate { + -webkit-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +.tl-animate-opacity { + -webkit-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -o-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1); + transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1); + -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); + transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1); +} +/* SLIDE +================================================== */ +.tl-slide { + position: absolute; + width: 100%; + height: 100%; + padding: 0px; + margin: 0px; + overflow-x: hidden; + overflow-y: auto; +} +.tl-slide .tl-slide-background { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + z-index: -1; + overflow: hidden; + display: none; + filter: alpha(opacity=50); + -khtml-opacity: 0.5; + -moz-opacity: 0.5; + opacity: 0.5; + background: no-repeat center center; + -webkit-background-size: cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; +} +.tl-slide .tl-slide-scrollable-container { + display: table; + table-layout: fixed; + height: 100%; + z-index: 1; +} +.tl-slide .tl-slide-content-container { + display: table-cell; + vertical-align: middle; + position: relative; + width: 100%; + height: 100%; + z-index: 3; +} +.tl-slide .tl-slide-content-container .tl-slide-content { + display: table; + vertical-align: middle; + padding-left: 100px; + padding-right: 100px; + position: relative; + max-width: 100%; + user-select: text; +} +.tl-slide .tl-slide-content-container .tl-slide-content .tl-media { + position: relative; + width: 100%; + min-width: 50%; + float: left; + margin-top: auto; + margin-bottom: auto; +} +.tl-slide .tl-slide-content-container .tl-slide-content .tl-text { + width: 50%; + max-width: 50%; + min-width: 120px; + padding: 0 20px 0 20px; + display: table-cell; + vertical-align: middle; + text-align: left; +} +/* Only Media (no text) +================================================== */ +.tl-slide-media-only .tl-slide-content-container .tl-slide-content { + text-align: center; +} +.tl-slide-media-only .tl-slide-content-container .tl-slide-content .tl-media { + text-align: center; + position: relative; + width: 100%; + min-width: 50%; + max-width: 100%; + float: none; + margin-top: auto; + margin-bottom: auto; +} +.tl-slide-media-only .tl-slide-content-container .tl-slide-content .tl-text { + width: 100%; + max-width: 100%; + display: block; + margin-left: auto; + margin-right: auto; + text-align: center; +} +/* Only Text (no media) +================================================== */ +.tl-slide-text-only .tl-slide-content-container .tl-slide-content { + text-align: center; +} +.tl-slide-text-only .tl-slide-content-container .tl-slide-content .tl-text { + max-width: 80%; + width: 80%; + display: block; + margin-left: auto; + margin-right: auto; +} +/* Background +================================================== */ +.tl-slide.tl-full-image-background, +.tl-slide.tl-full-color-background { + color: #FFF !important; + text-shadow: 1px 1px 1px #000 !important; +} +.tl-slide.tl-full-image-background p, +.tl-slide.tl-full-color-background p, +.tl-slide.tl-full-image-background h1, +.tl-slide.tl-full-color-background h1, +.tl-slide.tl-full-image-background h2, +.tl-slide.tl-full-color-background h2, +.tl-slide.tl-full-image-background h3, +.tl-slide.tl-full-color-background h3, +.tl-slide.tl-full-image-background h4, +.tl-slide.tl-full-color-background h4, +.tl-slide.tl-full-image-background h5, +.tl-slide.tl-full-color-background h5, +.tl-slide.tl-full-image-background h6, +.tl-slide.tl-full-color-background h6 { + color: #FFF !important; + text-shadow: 1px 1px 1px #000 !important; +} +.tl-slide.tl-full-image-background a, +.tl-slide.tl-full-color-background a, +.tl-slide.tl-full-image-background b, +.tl-slide.tl-full-color-background b, +.tl-slide.tl-full-image-background i, +.tl-slide.tl-full-color-background i, +.tl-slide.tl-full-image-background blockquote, +.tl-slide.tl-full-color-background blockquote, +.tl-slide.tl-full-image-background blockquote p, +.tl-slide.tl-full-color-background blockquote p { + text-shadow: 1px 1px 1px #000; + color: #ffffff; +} +.tl-slide.tl-full-image-background a:hover, +.tl-slide.tl-full-color-background a:hover { + text-decoration: underline; + color: #c34528; +} +.tl-slide.tl-full-image-background .tl-caption, +.tl-slide.tl-full-color-background .tl-caption, +.tl-slide.tl-full-image-background .tl-credit, +.tl-slide.tl-full-color-background .tl-credit { + color: #FFF !important; + text-shadow: 1px 1px 1px #000 !important; +} +.tl-slide.tl-full-image-background .tl-media-twitter blockquote, +.tl-slide.tl-full-color-background .tl-media-twitter blockquote, +.tl-slide.tl-full-image-background .tl-media-blockquote blockquote, +.tl-slide.tl-full-color-background .tl-media-blockquote blockquote { + color: #FFF !important; + text-shadow: 1px 1px 1px #000 !important; +} +.tl-slide.tl-full-image-background .tl-media-twitter blockquote p, +.tl-slide.tl-full-color-background .tl-media-twitter blockquote p, +.tl-slide.tl-full-image-background .tl-media-blockquote blockquote p, +.tl-slide.tl-full-color-background .tl-media-blockquote blockquote p { + color: #FFF !important; + text-shadow: 1px 1px 1px #000 !important; +} +.tl-slide.tl-full-image-background .vcard a, +.tl-slide.tl-full-color-background .vcard a, +.tl-slide.tl-full-image-background .vcard .nickname, +.tl-slide.tl-full-color-background .vcard .nickname { + color: #FFF !important; + text-shadow: 1px 1px 1px #000 !important; +} +/* Full Image Background +================================================== */ +.tl-slide.tl-full-image-background { + background: no-repeat center center; + -webkit-background-size: cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; + background-position: center 25%; + text-shadow: 1px 1px 2px #000; +} +.tl-slide.tl-full-image-background p, +.tl-slide.tl-full-image-background h1, +.tl-slide.tl-full-image-background h2, +.tl-slide.tl-full-image-background h3, +.tl-slide.tl-full-image-background h4, +.tl-slide.tl-full-image-background h5, +.tl-slide.tl-full-image-background h6 { + text-shadow: 1px 1px 2px #000; +} +.tl-slide.tl-full-image-background .tl-caption, +.tl-slide.tl-full-image-background .tl-credit { + text-shadow: 1px 1px 2px #000; +} +.tl-slide.tl-full-image-background .tl-media-twitter blockquote, +.tl-slide.tl-full-image-background .tl-media-blockquote blockquote { + text-shadow: 1px 1px 2px #000 !important; +} +.tl-slide.tl-full-image-background .tl-media-twitter blockquote p, +.tl-slide.tl-full-image-background .tl-media-blockquote blockquote p { + text-shadow: 1px 1px 2px #000 !important; +} +/* Color Background +================================================== */ +/* Text Background +================================================== */ +.tl-slide.tl-text-background .tl-text .tl-text-content-container { + padding: 20px; + /* Fallback for web browsers that doesn't support RGBa */ + background: #000000 transparent; + /* RGBa with 0.6 opacity */ + background: rgba(0, 0, 0, 0.6); + -webkit-border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; +} +.tl-slide.tl-text-background .tl-text .tl-text-content-container h2 { + margin-top: 5px; +} +/* Skinny +================================================== */ +.tl-skinny .tl-slide { + display: block; + padding-top: 10px; +} +.tl-skinny .tl-slide .tl-slide-content-container { + display: block; + position: static; + height: auto; + height: 100%; + display: -webkit-flex; + /* Safari */ + display: flex; + align-items: center; + -webkit-align-items: center; + /* Safari 7.0+ */ +} +.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content { + display: block; + display: -webkit-flex; + /* Safari */ + display: flex; + flex-direction: column-reverse; + -webkit-flex-direction: column-reverse; + /* Safari */ + position: static; + height: auto; + padding-left: 50px; + padding-right: 50px; +} +.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media { + position: static; + width: 100%; + height: auto; + float: none; + display: block; + padding-top: 20px; + border-top: 1px solid #e6e6e6; +} +.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-text { + display: block; + height: auto; + vertical-align: initial; + position: static; + width: 100%; + max-width: 100%; + min-width: 0; + float: none; + padding: 0; +} +.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-text .tl-text-content-container { + padding-left: 10px; + padding-right: 10px; + padding-bottom: 10px; +} +.tl-skinny .tl-slide.tl-slide.tl-full-color-background .tl-slide-content-container .tl-slide-content .tl-media, +.tl-skinny .tl-slide.tl-full-image-background .tl-slide-content-container .tl-slide-content .tl-media { + border-color: rgba(230, 230, 230, 0.25); +} +.tl-skinny .tl-slide.tl-slide-media-only .tl-slide-content-container .tl-slide-content { + flex-direction: column; + -webkit-flex-direction: column; + /* Safari */ +} +.tl-skinny .tl-slide.tl-slide-media-only .tl-slide-content-container .tl-slide-content .tl-media { + border-top: none; + padding-top: 0px; +} +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +.tl-mobile.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media img, +.tl-mobile.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media embed, +.tl-mobile.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media object, +.tl-mobile.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media video, +.tl-mobile.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media iframe { + max-height: 175px; +} +/* SlideNav +================================================== */ +/* NAVIGATION +================================================== */ +.tl-slidenav-previous, +.tl-slidenav-next { + position: absolute; + top: 45%; + z-index: 10; + cursor: pointer; +} +.tl-slidenav-previous .tl-slidenav-content-container, +.tl-slidenav-next .tl-slidenav-content-container { + height: 200px; + width: 100px; + position: absolute; +} +.tl-slidenav-previous .tl-slidenav-title, +.tl-slidenav-next .tl-slidenav-title, +.tl-slidenav-previous .tl-slidenav-description, +.tl-slidenav-next .tl-slidenav-description { + width: 80px; + -webkit-line-clamp: 2; + line-clamp: 2; + text-overflow: ellipsis; + /* Non standard for webkit */ + /* + -webkit-hyphens: auto; + -moz-hyphens: auto; + -ms-hyphens: auto; + hyphens: auto; + */ + filter: alpha(opacity=15); + -khtml-opacity: 0.15; + -moz-opacity: 0.15; + opacity: 0.15; +} +.tl-slidenav-previous .tl-slidenav-title small, +.tl-slidenav-next .tl-slidenav-title small, +.tl-slidenav-previous .tl-slidenav-description small, +.tl-slidenav-next .tl-slidenav-description small { + display: block; +} +.tl-slidenav-previous .tl-slidenav-title, +.tl-slidenav-next .tl-slidenav-title { + margin-top: 10px; + font-size: 11px; + line-height: 11px; +} +.tl-slidenav-previous .tl-slidenav-description, +.tl-slidenav-next .tl-slidenav-description { + font-size: 11px; + margin-top: 5px; + filter: alpha(opacity=0); + -khtml-opacity: 0; + -moz-opacity: 0; + opacity: 0; +} +.tl-slidenav-previous .tl-slidenav-description small, +.tl-slidenav-next .tl-slidenav-description small { + display: none; +} +/* NAVIGATION COLOR +================================================== */ +.tl-slidenav-previous .tl-slidenav-content-container .tl-slidenav-icon, +.tl-slidenav-next .tl-slidenav-content-container .tl-slidenav-icon, +.tl-slidenav-previous .tl-slidenav-content-container .tl-slidenav-title, +.tl-slidenav-next .tl-slidenav-content-container .tl-slidenav-title, +.tl-slidenav-previous .tl-slidenav-content-container .tl-slidenav-description, +.tl-slidenav-next .tl-slidenav-content-container .tl-slidenav-description { + text-shadow: 1px 1px 1px #FFF; + color: #333; +} +.tl-slidenav-previous .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-icon, +.tl-slidenav-next .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-icon, +.tl-slidenav-previous .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-title, +.tl-slidenav-next .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-title, +.tl-slidenav-previous .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-description, +.tl-slidenav-next .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-description { + color: #f2f2f2; + text-shadow: 1px 1px 1px #333; +} +/* ICONS +================================================== */ +.tl-slidenav-next .tl-slidenav-icon, +.tl-slidenav-previous .tl-slidenav-icon { + font-family: 'tl-icons'; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + font-size: 32px; + margin-bottom: 5px; +} +.tl-slidenav-next { + text-align: right; + margin-right: 10px; + right: 100px; +} +.tl-slidenav-next .tl-slidenav-title, +.tl-slidenav-next .tl-slidenav-description { + margin-left: 20px; +} +.tl-slidenav-next .tl-slidenav-icon { + margin-left: 76px; +} +.tl-slidenav-next .tl-slidenav-icon:before { + content: "\e64f"; +} +.tl-slidenav-previous { + text-align: left; + margin-left: 10px; +} +.tl-slidenav-previous .tl-slidenav-icon { + margin-left: 0px; +} +.tl-slidenav-previous .tl-slidenav-icon:before { + content: "\e650"; +} +/* NAVIGATION HOVER +================================================== */ +.tl-slidenav-previous:hover .tl-slidenav-title, +.tl-slidenav-next:hover .tl-slidenav-title { + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; +} +.tl-slidenav-previous:hover .tl-slidenav-description, +.tl-slidenav-next:hover .tl-slidenav-description { + filter: alpha(opacity=50); + -khtml-opacity: 0.5; + -moz-opacity: 0.5; + opacity: 0.5; +} +.tl-slidenav-next:hover .tl-slidenav-icon { + margin-left: 80px; +} +.tl-slidenav-previous:hover .tl-slidenav-icon { + margin-left: -4px; +} +.tl-skinny .tl-slidenav-next { + right: 32px; +} +.tl-skinny .tl-slidenav-next .tl-slidenav-icon { + margin-left: 8px; +} +.tl-skinny .tl-slidenav-previous .tl-slidenav-content-container, +.tl-skinny .tl-slidenav-next .tl-slidenav-content-container { + width: 32px; + height: 32px; +} +.tl-skinny .tl-slidenav-previous .tl-slidenav-title, +.tl-skinny .tl-slidenav-next .tl-slidenav-title, +.tl-skinny .tl-slidenav-previous .tl-slidenav-description, +.tl-skinny .tl-slidenav-next .tl-slidenav-description { + display: none; +} +.tl-skinny .tl-slidenav-previous .tl-slidenav-icon, +.tl-skinny .tl-slidenav-next .tl-slidenav-icon { + filter: alpha(opacity=33); + -khtml-opacity: 0.33; + -moz-opacity: 0.33; + opacity: 0.33; +} +.tl-skinny .tl-slidenav-next:hover .tl-slidenav-icon { + margin-left: 12px; + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; +} +.tl-skinny .tl-slidenav-previous:hover .tl-slidenav-icon { + margin-left: -4px; + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; +} +.tl-layout-landscape.tl-mobile .tl-slidenav-next:hover { + right: 70px; +} +.tl-layout-landscape.tl-mobile .tl-slidenav-next:hover .tl-slidenav-icon { + margin-left: 8px; + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; +} +.tl-layout-landscape.tl-mobile .tl-slidenav-next:active .tl-slidenav-icon { + margin-left: 0px; + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; +} +.tl-layout-landscape.tl-mobile .tl-slidenav-previous:hover .tl-slidenav-icon { + margin-left: 80px; + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; +} +.tl-layout-landscape.tl-mobile .tl-slidenav-previous:active .tl-slidenav-icon { + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; + margin-left: -4px; +} +.tl-layout-portrait.tl-mobile .tl-slidenav-next:hover .tl-slidenav-icon { + filter: alpha(opacity=33); + -khtml-opacity: 0.33; + -moz-opacity: 0.33; + opacity: 0.33; +} +.tl-layout-portrait.tl-mobile .tl-slidenav-next:active .tl-slidenav-icon { + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; +} +.tl-layout-portrait.tl-mobile .tl-slidenav-previous:hover .tl-slidenav-icon { + filter: alpha(opacity=33); + -khtml-opacity: 0.33; + -moz-opacity: 0.33; + opacity: 0.33; +} +.tl-layout-portrait.tl-mobile .tl-slidenav-previous:active .tl-slidenav-icon { + filter: alpha(opacity=100); + -khtml-opacity: 1; + -moz-opacity: 1; + opacity: 1; +} +.tl-mobile .tl-slidenav-previous, +.tl-skinny.tl-mobile .tl-slidenav-previous, +.tl-skinny.tl-layout-landscape.tl-mobile .tl-slidenav-previous, +.tl-skinny.tl-layout-portrait.tl-mobile .tl-slidenav-previous, +.tl-mobile .tl-slidenav-next, +.tl-skinny.tl-mobile .tl-slidenav-next, +.tl-skinny.tl-layout-landscape.tl-mobile .tl-slidenav-next, +.tl-skinny.tl-layout-portrait.tl-mobile .tl-slidenav-next { + display: none; +} +/* StorySlider +================================================== */ +/* SLIDER CONTAINERS +================================================== */ +.tl-storyslider { + width: 100%; + height: 100%; + overflow: hidden; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + -o-user-select: none; + user-select: none; + position: relative; + box-sizing: content-box; + z-index: 8; +} +.tl-storyslider img, +.tl-storyslider embed, +.tl-storyslider object, +.tl-storyslider video, +.tl-storyslider iframe { + max-width: 100%; + position: relative; +} +.tl-storyslider .tl-slider-background { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: 1; +} +.tl-storyslider .tl-slider-touch-mask { + width: 100%; + height: 100%; + z-index: 25; + top: 0px; + left: 0px; + position: absolute; +} +.tl-storyslider .tl-slider-container-mask { + text-align: center; + width: 100%; + height: 100%; + position: relative; + z-index: 5; +} +.tl-storyslider .tl-slider-container-mask .tl-slider-container { + position: absolute; + top: 0px; + left: 0px; + width: 100%; + height: 100%; + text-align: center; +} +.tl-storyslider .tl-slider-container-mask .tl-slider-container .tl-slider-item-container { + width: 100%; + height: 100%; + display: table-cell; + vertical-align: middle; +} +/* Skinny +================================================== */ +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +/* Requires Variables.less +================================================== */ +.tl-media { + width: 100%; + min-width: 50%; + height: 100%; + float: left; + margin-top: auto; + margin-bottom: auto; + position: relative; +} +.tl-media .tl-media-content-container.tl-media-content-container-text { + border-right: 1px solid #e6e6e6; + padding-right: 20px; +} +.tl-media .tl-media-content-container .tl-media-content { + position: relative; + *zoom: 1; +} +.tl-media .tl-media-content-container .tl-media-content:before, +.tl-media .tl-media-content-container .tl-media-content:after { + display: table; + content: ""; +} +.tl-media .tl-media-content-container .tl-media-content:after { + clear: both; +} +.tl-media .tl-media-content-container .tl-media-content .tl-media-loaderror p { + color: #f2f2f2; + text-align: center; +} +.tl-media .tl-media-content-container .tl-media-content .tl-media-loaderror p span { + color: #f2f2f2; +} +.tl-media .tl-media-content-container .tl-media-content .tl-media-loaderror [class^="tl-icon-"], +.tl-media .tl-media-content-container .tl-media-content .tl-media-loaderror [class*=" tl-icon-"] { + font-size: 28px; + color: #f2f2f2; + text-align: center; +} +.tl-media .tl-media-content-container .tl-media-content img, +.tl-media .tl-media-content-container .tl-media-content embed, +.tl-media .tl-media-content-container .tl-media-content object, +.tl-media .tl-media-content-container .tl-media-content video { + max-width: 100%; + max-height: 100%; +} +/* Media Only Slides +================================================== */ +.tl-slide-media-only .tl-media .tl-media-content-container.tl-media-content-container-text { + border-right: none; + padding-right: 0; +} +/* Media Shodow +================================================== */ +.tl-media-shadow { + position: relative; + z-index: 1; + -webkit-box-shadow: 0 12px 10px -10px rgba(0, 0, 0, 0.6); + -moz-box-shadow: 0 12px 10px -10px rgba(0, 0, 0, 0.6); + box-shadow: 0 12px 10px -10px rgba(0, 0, 0, 0.6); +} +.tl-slide.tl-full-image-background a, +.tl-slide.tl-full-color-background a, +.tl-slide.tl-full-image-background .vcard a, +.tl-slide.tl-full-color-background .vcard a { + text-shadow: 1px 1px 1px #000; + color: #ffffff; +} +.tl-slide.tl-full-image-background a:hover, +.tl-slide.tl-full-color-background a:hover { + text-decoration: underline; + color: #c34528; +} +/* Credit +================================================== */ +.tl-credit { + color: #999999; + text-align: right; + display: block; + margin: 0 auto; + margin-top: 6px; + font-size: 10px; + line-height: 13px; +} +/* Caption +================================================== */ +.tl-caption { + text-align: left; + margin-right: auto; + margin-left: auto; + margin-top: 10px; + color: #666666; + font-size: 11px; + line-height: 14px; + text-rendering: optimizeLegibility; + word-wrap: break-word; +} +/* Full Image Background +================================================== */ +.tl-full-image-background .tl-media-shadow:before, +.tl-full-color-background .tl-media-shadow:before, +.tl-full-image-background .tl-media-shadow:after, +.tl-full-color-background .tl-media-shadow:after { + background: none; + -webkit-box-shadow: 0 0px 0px #000; + -moz-box-shadow: 0 0px 0px #000; + box-shadow: 0 0px 0px #000; +} +/* Skinny +================================================== */ +.tl-skinny .tl-media { + width: 100%; + height: auto; + float: none; + display: block; +} +.tl-skinny .tl-media .tl-media-content-container.tl-media-content-container-text { + border-right: 0; + padding-right: 0; +} +.tl-skinny .tl-media .tl-media-content-container .tl-credit, +.tl-skinny .tl-media .tl-media-content-container .tl-caption { + margin-top: 2px; + padding-left: 10px; + padding-right: 10px; + font-size: 8px; +} +.tl-skinny .tl-media .tl-media-content-container .tl-credit { + margin-top: 0px; +} +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +.tl-mobile.tl-skinny .tl-media { + width: 100%; + height: auto; + float: none; + display: block; +} +.tl-mobile.tl-skinny .tl-media .tl-media-content-container.tl-media-content-container-text { + border-right: 0; + padding-right: 0; +} +/* Requires Variables.less +================================================== */ +.tl-text { + width: 50%; + max-width: 50%; + min-width: 120px; + padding: 0 20px 0 20px; + display: table-cell; + vertical-align: middle; + text-align: left; + text-shadow: none; + color: #737373; +} +.tl-text p { + color: #737373; +} +.tl-text h2.tl-headline-title, +.tl-text h2.tl-headline { + margin-top: 0; +} +.tl-text .tl-headline-date, +.tl-text h3.tl-headline-date { + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-size: 15px; + line-height: 15px; + font-weight: normal; + margin: 0 0 3px 0; + color: #b3b3b3; +} +.tl-text .tl-headline-date small, +.tl-text h3.tl-headline-date small { + font-size: 15px; + line-height: 15px; + font-weight: normal; + color: #b3b3b3; +} +.tl-text .tl-text-date { + display: inline-block; + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-weight: normal; + margin-top: 10px; + font-size: 12px; + color: #b3b3b3; +} +.tl-full-image-background .tl-text, +.tl-full-color-background .tl-text, +.tl-full-image-background .tl-text p, +.tl-full-color-background .tl-text p { + color: #f2f2f2 !important; + text-shadow: 1px 1px 2px #000; +} +.tl-full-image-background .tl-text .tl-headline-date, +.tl-full-color-background .tl-text .tl-headline-date, +.tl-full-image-background .tl-text p .tl-headline-date, +.tl-full-color-background .tl-text p .tl-headline-date, +.tl-full-image-background .tl-text h3.tl-headline-date, +.tl-full-color-background .tl-text h3.tl-headline-date, +.tl-full-image-background .tl-text p h3.tl-headline-date, +.tl-full-color-background .tl-text p h3.tl-headline-date { + color: #f2f2f2 !important; +} +.tl-full-image-background .tl-text .tl-headline-date small, +.tl-full-color-background .tl-text .tl-headline-date small, +.tl-full-image-background .tl-text p .tl-headline-date small, +.tl-full-color-background .tl-text p .tl-headline-date small, +.tl-full-image-background .tl-text h3.tl-headline-date small, +.tl-full-color-background .tl-text h3.tl-headline-date small, +.tl-full-image-background .tl-text p h3.tl-headline-date small, +.tl-full-color-background .tl-text p h3.tl-headline-date small { + color: #f2f2f2 !important; +} +.tl-full-image-background .tl-text a:hover, +.tl-full-color-background .tl-text a:hover, +.tl-full-image-background .tl-text p a:hover, +.tl-full-color-background .tl-text p a:hover { + text-decoration: underline; + color: #c34528; +} +/* Skinny +================================================== */ +.tl-skinny .tl-text { + width: 100%; + max-width: 100%; + min-width: auto; + float: none; + margin-top: 20px; +} +.tl-skinny .tl-text h2.tl-headline-title, +.tl-skinny .tl-text h2.tl-headline { + font-size: 32px; + line-height: 36px; +} +/* Medium +================================================== */ +.tl-medium .tl-text h2.tl-headline-title, +.tl-medium .tl-text h2.tl-headline { + font-size: 32px; + line-height: 36px; +} +/* Mobile, iPhone +================================================== */ +/* Mobile, iPhone and skinny +================================================== */ +.tl-mobile.tl-skinny .tl-media .tl-media-image { + max-height: 250px !important; +} +.tl-media .tl-media-twitter { + text-align: left; + clear: both; +} +.tl-media .tl-media-twitter blockquote { + margin: 0; + margin-right: 15px; + font-size: 15px; + line-height: 21px; + color: #333; +} +.tl-media .tl-media-twitter blockquote p { + font-size: 28px; + line-height: 30px; + color: #000; +} +.tl-media .tl-media-twitter blockquote p:before { + display: none; +} +.tl-media .tl-media-twitter blockquote p:after { + display: none; +} +.tl-media .tl-media-twitter .tl-icon-twitter { + color: #55ACEE; +} +.tl-media .tl-media-twitter .vcard a:hover, +.tl-media .tl-media-twitter .vcard a.tl-date:hover { + text-decoration: none; + color: #55ACEE; +} +.tl-media .tl-media-twitter .vcard a:hover .fn, +.tl-media .tl-media-twitter .vcard a.tl-date:hover .fn, +.tl-media .tl-media-twitter .vcard a:hover .nickname, +.tl-media .tl-media-twitter .vcard a.tl-date:hover .nickname { + color: #55ACEE; +} +.tl-slide-media-only .tl-media .tl-media-twitter { + width: 80%; + margin-left: auto; + margin-right: auto; +} +.tl-mobile.tl-skinny .tl-media .tl-media-twitter blockquote p { + font-size: 15px; + line-height: 21px; +} +.tl-skinny .tl-media .tl-media-twitter { + margin-left: 10px; + margin-right: 10px; +} +.tl-skinny .tl-media .tl-media-twitter blockquote p { + font-size: 24px; + line-height: 26px; +} +.tl-media .tl-media-blockquote { + text-align: left; + clear: both; +} +.tl-media .tl-media-blockquote blockquote { + margin: 0; + margin-right: 15px; + text-align: left; + font-size: 28px; + line-height: 30px; + color: #333; +} +.tl-media .tl-media-blockquote blockquote p { + font-size: 28px; + line-height: 30px; + color: #333; +} +.tl-media .tl-media-blockquote blockquote p:before, +.tl-media .tl-media-blockquote blockquote p:after { + display: inline-block; + font-size: 36px; +} +.tl-media .tl-media-blockquote blockquote p:before { + content: open-quote; + margin-right: 5px; +} +.tl-media .tl-media-blockquote blockquote p:after { + content: close-quote; + margin-left: 3px; +} +.tl-media .tl-media-blockquote blockquote cite { + font-size: 15px; + line-height: 21px; + color: #999999; + text-align: right; + margin-top: 15px; +} +.tl-slide-media-only .tl-media .tl-media-blockquote { + border-right: 0; + width: 80%; + margin-left: auto; + margin-right: auto; +} +@media only screen and (max-width: 800px), only screen and (max-device-width: 800px) { + .tl-media .tl-media-blockquote blockquote p { + font-size: 24px; + line-height: 26px; + } +} +@media only screen and (max-width: 500px), only screen and (max-device-width: 500px) { + .tl-media .tl-media-blockquote blockquote p { + font-size: 15px; + line-height: 21px; + } +} +.tl-mobile.tl-skinny .tl-media .tl-media-instagram { + max-height: 250px !important; +} +.tl-media .tl-media-profile { + border-radius: 50%; +} +.tl-media .tl-media-iframe { + width: 100%; + height: 100%; +} +.tl-media .tl-media-iframe iframe { + width: 100%; + height: 100%; +} +.tl-media .tl-media-wikipedia { + text-align: left; + margin-left: auto; + margin-right: auto; + clear: both; +} +.tl-media .tl-media-wikipedia .tl-icon-wikipedia { + font-size: 32px; + margin-right: 10px; + float: left; + padding-top: 3px; +} +.tl-media .tl-media-wikipedia .tl-wikipedia-pageimage { + float: left; + margin-right: 10px; + margin-bottom: 5px; + margin-top: 5px; +} +.tl-media .tl-media-wikipedia .tl-wikipedia-title { + margin-left: 60px; + padding-left: 10px; + border-left: 1px solid #e6e6e6; + margin-bottom: 10px; +} +.tl-media .tl-media-wikipedia .tl-wikipedia-source { + font-size: 13px; + line-height: 15px; + font-style: italic; + margin-top: 3px; + display: block; + color: rgba(0, 0, 0, 0.5); +} +.tl-media .tl-media-wikipedia h4 { + margin-top: 0px; + margin-bottom: 0px; +} +.tl-media .tl-media-wikipedia h4 a { + color: #000; + text-decoration: none; +} +.tl-media .tl-media-wikipedia p { + font-size: 13px; + line-height: 19px; +} +.tl-slide-media-only .tl-media .tl-media-wikipedia { + border-right: 0; + border-top: 1px solid #e6e6e6; + width: 80%; + margin-left: auto; + margin-right: auto; + margin-top: 25px; + padding-top: 25px; +} +.tl-slide.tl-full-image-background .tl-media .tl-media-wikipedia, +.tl-slide.tl-full-color-background .tl-media .tl-media-wikipedia { + padding: 20px; + /* Fallback for web browsers that doesn't support RGBa */ + background: #000000 transparent; + /* RGBa with 0.6 opacity */ + background: rgba(0, 0, 0, 0.6); + -webkit-border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; +} +.tl-slide.tl-full-image-background .tl-media .tl-media-wikipedia h4 a, +.tl-slide.tl-full-color-background .tl-media .tl-media-wikipedia h4 a { + color: #FFF !important; + text-shadow: 1px 1px 1px #000 !important; +} +.tl-slide.tl-full-image-background .tl-media .tl-media-wikipedia a:hover, +.tl-slide.tl-full-color-background .tl-media .tl-media-wikipedia a:hover { + text-decoration: underline; + color: #c34528; +} +.tl-slide.tl-full-image-background .tl-media .tl-media-wikipedia .tl-wikipedia-title, +.tl-slide.tl-full-color-background .tl-media .tl-media-wikipedia .tl-wikipedia-title { + border-color: rgba(230, 230, 230, 0.25); +} +.tl-slide.tl-full-image-background .tl-media .tl-media-wikipedia .tl-wikipedia-source, +.tl-slide.tl-full-color-background .tl-media .tl-media-wikipedia .tl-wikipedia-source { + color: rgba(230, 230, 230, 0.85); +} +.tl-mobile.tl-skinny .tl-media .tl-media-wikipedia, +.tl-skinny .tl-media .tl-media-wikipedia { + margin-left: 10px; + margin-right: 10px; +} +.tl-media .tl-media-website { + text-align: left; + margin-left: auto; + margin-right: auto; + clear: both; +} +.tl-media .tl-media-website .tl-media-website-description { + font-size: 16px; + line-height: 19px; + font-style: italic; + margin-bottom: 10px; + text-transform: uppercase; +} +.tl-media .tl-media-website h4 { + margin-top: 0px; + margin-bottom: 0px; + line-height: 1; +} +.tl-media .tl-media-website h4 a { + color: #000; + text-decoration: none; +} +.tl-media .tl-media-website p { + font-size: 13px; + line-height: 19px; +} +.tl-media .tl-media-content-container .tl-media-content .tl-media-website img { + float: right; + max-width: 120px; + max-height: 120px; + margin: 4px 0 0 15px; +} +.tl-media .tl-media-content-container .tl-media-content .tl-media-website img.tl-media-website-icon { + max-width: 16px; + max-height: 16px; + float: none; + margin: 0; + margin-right: 3px; +} +.tl-slide.tl-full-image-background .tl-media .tl-media-website, +.tl-slide.tl-full-color-background .tl-media .tl-media-website { + padding: 20px; + /* Fallback for web browsers that doesn't support RGBa */ + background: #000000 transparent; + /* RGBa with 0.6 opacity */ + background: rgba(0, 0, 0, 0.6); + -webkit-border-radius: 7px; + -moz-border-radius: 7px; + border-radius: 7px; +} +.tl-slide.tl-full-image-background .tl-media .tl-media-website h4 a, +.tl-slide.tl-full-color-background .tl-media .tl-media-website h4 a { + color: #FFF !important; + text-shadow: 1px 1px 1px #000 !important; +} +.tl-slide.tl-full-image-background .tl-media .tl-media-website a:hover, +.tl-slide.tl-full-color-background .tl-media .tl-media-website a:hover { + text-decoration: underline; + color: #c34528; +} +.tl-mobile.tl-skinny .tl-media .tl-media-website { + margin-left: 10px; + margin-right: 10px; +} +/* Timeline +================================================== */ +.tl-timeline { + width: 100%; + height: 100%; + font-size: 16px; + line-height: normal; + overflow: hidden; + position: relative; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + -o-user-select: none; + user-select: none; + background-color: #FFF; + color: #737373; + -webkit-box-sizing: content-box; + -moz-box-sizing: content-box; + box-sizing: content-box; +} +.tl-timeline.tl-timeline-embed { + box-sizing: border-box; + border-top: 1px solid #cccccc; + border-bottom: 1px solid #cccccc; + border-radius: 0; +} +.tl-timeline.tl-timeline-full-embed { + box-sizing: border-box; + border: 1px solid #cccccc; + border-radius: 8px; +} +/* Portrait +================================================== */ +.tl-layout-portrait .tl-storyslider { + -webkit-box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.2); + -moz-box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.2); + box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.2); +} +.tl-rtl .tl-text-content, +.tl-rtl .tl-headline, +.tl-rtl .tl-media-blockquote, +.tl-rtl .tl-headline-date, +.tl-rtl .tl-timeline blockquote p, +.tl-rtl .tl-media-website, +.tl-rtl .tl-media-wikipedia, +.tl-rtl .tl-media .tl-media-blockquote blockquote, +.tl-rtl .blockquote, +.tl-rtl blockquote p, +.tl-rtl .tl-text-content p { + text-align: right; + direction: rtl; +} +.tl-rtl .tl-slide-media-only .tl-headline, +.tl-rtl .tl-slide-media-only .tl-headline-date { + text-align: center; +} +.tl-rtl .tl-timemarker-text { + margin-right: 35px; +} +.tl-rtl .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container { + float: right; +} +.tl-rtl .tl-caption { + text-align: right; +} +.tl-rtl .tl-credit { + text-align: left; +} + + +/*# sourceMappingURL=timeline.css.map*/ \ No newline at end of file diff --git a/helpdesk/static/helpdesk/vendor/timeline3/css/timeline.css.map b/helpdesk/static/helpdesk/vendor/timeline3/css/timeline.css.map new file mode 100644 index 00000000..500ff07c --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/css/timeline.css.map @@ -0,0 +1 @@ +{"version":3,"sources":["webpack://TL/TL.Timeline.less","webpack://TL/./src/less/core/Reset.less","webpack://TL/./src/less/Typography.less","webpack://TL/./src/less/core/Mixins.less","webpack://TL/./src/less/icons/Icons.less","webpack://TL/./src/less/core/TL.less","webpack://TL/./src/less/ui/TL.MenuBar.less","webpack://TL/./src/less/ui/TL.MenuBar.Button.less","webpack://TL/./src/less/ui/TL.Message.less","webpack://TL/./src/less/timenav/TL.TimeNav.less","webpack://TL/./src/less/timenav/TL.TimeMarker.less","webpack://TL/./src/less/timenav/TL.TimeEra.less","webpack://TL/./src/less/timenav/TL.TimeGroup.less","webpack://TL/./src/less/timenav/TL.TimeAxis.less","webpack://TL/./src/less/animation/TL.Animate.less","webpack://TL/./src/less/slider/TL.Slide.less","webpack://TL/./src/less/slider/TL.SlideNav.less","webpack://TL/./src/less/slider/TL.StorySlider.less","webpack://TL/./src/less/media/TL.Media.less","webpack://TL/./src/less/media/types/TL.Media.Text.less","webpack://TL/./src/less/media/types/TL.Media.Image.less","webpack://TL/./src/less/media/types/TL.Media.Twitter.less","webpack://TL/./src/less/media/types/TL.Media.Blockquote.less","webpack://TL/./src/less/media/types/TL.Media.Instagram.less","webpack://TL/./src/less/media/types/TL.Media.Profile.less","webpack://TL/./src/less/media/types/TL.Media.IFrame.less","webpack://TL/./src/less/media/types/TL.Media.Wikipedia.less","webpack://TL/./src/less/media/types/TL.Media.Website.less","webpack://TL/./src/less/TL.Timeline.Base.less"],"names":[],"mappings":"AAAA;;;;;;;;;CASC;AACD;oDACoD;AACpD;uDACuD;AACvD;oDACoD;AACpD;oDACoD;AACpD;oDACoD;AACpD;oDACoD;AACpD;oDACoD;AACpD;oDACoD;AACpD;oDACoD;AACpD;;;;;;;;;CASC;AACD;oDACoD;AACpD;;sEAEsE;AACtE;6FAC6F;ACzC7F;ED2CE;;;8FAG4F;EAC5F;;8FAE4F;EAC5F;;8FAE4F;EAC5F;;8FAE4F;EAC5F;;8FAE4F;AAC9F;AC3DA;EAQE;EACG;EACK;ADsDV;AChEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiBE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AD2HF;ACrJA;;;;;;EA6BE;ADgIF;AC7JA;EA+BS;EAA2B;ADkIpC;ACjKA;;EAgCU;ADqIV;ACrKA;;;;EAiC0D;AD0I1D;AC3KA;EAkCW;AD4IX;AC9KA;;EAmCqB;AD+IrB;AClLA;;;;;;;;;;EAqCE;ADyJF;AC9LA;;;EAwCE;GACA;GACA;AD2JF;ACrMA;EAiDE;ADuJF;ACxMA;EAoDE;ADuJF;AC3MA;;EA2DE;EACA;EACA;EACA;ADoJF;AClNA;EAiEE;ADoJF;ACrNA;EAoEE;ADoJF;ACxNA;EA2EE;EACA;ADgJF;AC5NA;;;;EAmFG;EACA;EACA;GACA;AD+IH;ACrOA;;EAyFG;GACA;ADgJH;AC1OA;;EA6FG;EACA;ADiJH;AC/OA;;;;EAiGG;EACA;ADoJH;ACtPA;EAqGG;EACA;EACG;EACK;ADoJX;AC5PA;EA2GG;ADoJH;AC/PA;EA8GG;EACA;ADoJH;AEtQA;EACC;EFwQC;qDACmD;AACrD;AE3QA;;;;;;EAIE;AF+QF;AEnRA;;;EAQE;EACA;AFgRF;AEzRA;;;EAWG;EACA;AFmRH;AE/RA;;;EAgBE;EACA;EACA;AFoRF;AEtSA;;;EAoBG;EACA;AFuRH;AE5SA;EAyBE;EACA;AFsRF;AEhTA;EA4BG;EACA;EACA;EACA;AFuRH;AEtTA;EAoCE;EACA;AFqRF;AE1TA;EAyCE;EACA;EACA;EACA;EAEA;AFmRF;AElRE;EACC;AFoRH;AEpUA;EFsUE;;;;;;;;;;;;;;;;IAgBE;EElRD;EACA;AFoRH;AEnRG;;EAEC;AFqRJ;AE/QE;EAAA;IAEE;IACA;IACA;EFiRF;EEhRE;;IAEC;IACA;EFkRH;AACF;AEzWA;;EA+FE;AF8QF;AE7WA;;EAmGE;AF8QF;AEjXA;EAsGE;EACA;AF8QF;AErXA;EA0GE;EACA;AF8QF;AEzXA;;;;EA+GE;EACA;AFgRF;AEhYA;;;;EAkHG;AFoRH;AEtYA;EAuHE;EACA;EACA;EACG;EACK;AFkRV;AE7YA;;EA8HE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AFmRF;AExZA;;EAuIG;EACA;EACA;EACA;EACA;EACA;AFqRH;AEjaA;;EAgJG;AFqRH;AEraA;EAoJE;EACA;EACA;EACA;EACA;EACA;AFoRF;AE7aA;EA6JE;EACA;EACA;EACA;EACA;EACA;AFmRF;AErbA;EAsKE;AFkRF;AExbA;EAwKG;AFmRH;AE3bA;EAiLE;EACA;EACA;GCpCD;EDuCC;EACA;AF4QF;AGnTC;;EAEC;EACA;AHqTF;AGnTC;EACC;AHqTF;AE3cA;EAyLG;EACA;AFqRH;AE/cA;EA6LG;AFqRH;AEldA;EAiMG;EACA;AFoRH;AEtdA;EAqMG;AFoRH;AEzdA;;EAuMI;AFsRJ;AE7dA;;EA6MG;AFoRH;AEjeA;EAgNG;EACA;AFoRH;AEreA;EAqNG;EACA;EACA;AFmRH;AE1eA;EA2NG;EACA;EACA;EACA;AFkRH;AEhfA;EAgOI;EACA;EACA;AFmRJ;AErfA;EAwOG;EACA;EACA;AFgRH;AE1fA;EA4OI;AFiRJ;AE7fA;EAmPE;EACA;EACA;EACA;EACA;AF6QF;AEpgBA;EA0PG;EACA;EACA;EACA;EACA;AF6QH;AE3gBA;EAmQE;EACA;EACA;EACA;EACA;EACA;EACA;ECzLA;EACG;EACK;EDyLR;EACA;EACA;EACA;AF6QF;AErQA;EACC;;;IAEE;IACA;EFwQD;AACF;AEjQA;EACC;;;IAEE;IACA;EFoQD;AACF;AE9PA;EAEE;AF+PF;AACA;oDACoD;AI7iBpD;EACC;EACA;EACA;EAKA;EACA;AJ2iBD;AIxiBA;;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EJ2iBC,sCAAsC;EIxiBvC;EACA;AJ0iBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AItiBA;EACC;AJwiBD;AACA;oDACoD;AKlvBpD;EACC;EFoIA;EACG;EACC;EACC;EACG;AHinBT;AACA;oDACoD;AM3vBpD;EACC;EAGA;EACA;EACA;EAIA;EAOA;EACA;EACA;EACA;EACA;ANkvBD;AACA;oDACoD;AACpD;oDACoD;AACpD;oDACoD;AACpD;oDACoD;AACpD;;;;;;;;;;;;;;;;;;;;;;CAsBC;AMxtBD;EACC;IACC;EN0tBA;EMxtBD;IACC;EN0tBA;AACF;AMxtBA;EACC;IAAM;EN2tBL;EM1tBD;IAAI;EN6tBH;AACF;AM5tBA;EACC;IAAM;EN+tBL;EM9tBD;IAAI;ENiuBH;AACF;AMhuBA;EACC;IAAM;ENmuBL;EMluBD;IAAI;ENquBH;AACF;AACA;oDACoD;AOx0BpD;EAEC;EACA;EAGA;EACA;EACA;EACA;EACA;EAEA;APs0BD;AOj0BC;EACC;APm0BF;AOj0BC;EACC;EACA;APm0BF;AOl0BE;EACC;EACA;APo0BH;AO/zBA;EAEE;APg0BF;AO/zBE;EAEC;EACA;APg0BH;AO9zBE;EACC;EACA;APg0BH;AO1zBA;EACC;IACC;EP4zBA;EO1zBD;IACC;EP4zBA;AACF;AO1zBA;EACC;IAAM;EP6zBL;EO5zBD;IAAI;EP+zBH;AACF;AO9zBA;EACC;IAAM;EPi0BL;EOh0BD;IAAI;EPm0BH;AACF;AOl0BA;EACC;IAAM;EPq0BL;EOp0BD;IAAI;EPu0BH;AACF;AACA;oDACoD;AQ34BpD;;EACC;EAEA;EACA;EAGA;EACA;EACA;EACA;EACA;EACA;EACA;AR24BD;AQx5BA;;EAeE;EACA;EACA;EACA;EACA;AR64BF;AQh6BA;;EAsBG;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AR84BH;AQ36BA;;EAgCI;AR+4BJ;AQ/6BA;;EAoCG;EACA;EACA;EACA;ELgEF;EACG;EACK;EKhEN;EACA;EACA;EAEA;EACA;ARg5BH;AQ74BE;EACC;IAAK;ERg5BN;EQ/4BC;IAAM;ERk5BP;EQj5BC;IAAO;ERo5BR;AACF;AQl5BE;EACC;IAAK;ERq5BN;EQp5BC;IAAM;ERu5BP;EQt5BC;IAAO;ERy5BR;AACF;AQt5BA;EL0FC;AH+zBD;AQz5BA;;EAKE;EACA;ARw5BF;AQ95BA;EAUG;EACA;EACA;EACA;EACA;EACA;ARu5BH;AQt6BA;EAiBI;EACA;EACA;EACA;EACA;EACA;ELNF;EACG;EACK;AH+5BV;AACA;oDACoD;ASh/BpD;EAEC;EACA;EACA;EACA;EAEA;ATg/BD;ASv/BA;EAaE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;EACA;ET2+BA;;;;;;;GAOC;AACH;AS3gCA;EAoCG;AT0+BH;ASx+BG;EACC;EACA;AT0+BJ;AS5+BG;EAIE;AT2+BL;ASrhCA;EA+CG;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;ATy+BH;ASjiCA;EA6DE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;ATu+BF;ASr+BE;;EACC;EACA;EACA;EACA;EACA;EACA;EACA;ETw+BD,sCAAsC;ESr+BrC;EACA;EAEA;EACA;EACA;EACA;EACA;ATs+BH;ASp+BE;EAEC;ATq+BH;ASn+BE;EACC;EACA;ATq+BH;ASpkCA;EAmGE;EACA;EACA;EACA;ATo+BF;ASl+BE;ENlFD;EACG;EACE;EACG;EAXR;EACG;EACE;EACG;AHmkCT;ASplCA;EA8GG;EACA;EACA;EACA;EACA;ATy+BH;AS3lCA;EAqHG;EACA;EACA;ATy+BH;AShmCA;EAyHI;EACA;AT0+BJ;ASpmCA;EA+HK;EACA;ATw+BL;AACA;oDACoD;AACpD;oDACoD;AACpD;oDACoD;AACpD;oDACoD;AUhnCpD;EACC;EACA;EACA;EACA;EACA;EVknCC;qDACmD;EGlmCpD;EACG;EACE;EACG;EAXR;EACG;EACE;EACG;EHgnCP;qDACmD;EACnD;qDACmD;EACnD;qDACmD;EACnD;qDACmD;EACnD;qDACmD;EACnD;qDACmD;EACnD;qDACmD;EACnD;qDACmD;EACnD;qDACmD;EACnD;qDACmD;AACrD;AUroCC;EPMA;EACG;EACE;EACG;EAXR;EACG;EACE;EACG;AH8oCT;AU/oCC;EPMA;EACG;EACE;EACG;AH4oCT;AUrpCC;EPMA;EACG;EACE;EACG;AHkpCT;AU3qCA;EAkCE;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EPpBD;EACG;EACE;EACG;EAXR;EACG;EACE;EACG;AH4qCT;AU7rCA;EAkDG;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AV8oCH;AUvsCA;EAmEE;EACA;AVuoCF;AU3sCA;EAyEE;EACA;AVqoCF;AU/sCA;;EA8EE;EPtCD;EH4qCC,gCAAgC;EG3qC9B;EH6qCF,yBAAyB;EG5qCrB;EO4CJ;EAEA;EAEA;EACA;EAEA;EP/DD;EACE;EACC;EACE;EACC;EACI;EO6DT;AVooCF;AUloCE;;EAEC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EP/BD;EACG;EACK;AHoqCV;AUnvCA;EAoHE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EPvGD;EACG;EACE;EACG;EAXR;EACG;EACE;EACG;EOmHP;EACA;EACA;AVooCF;AU5oCE;EACC;AV8oCH;AU7wCA;EAyIG;EACA;EACA;EACA;EACA;EPrGF;EH6uCC,gCAAgC;EG5uC9B;EH8uCF,yBAAyB;EG7uCrB;AH+uCN;AUzxCA;EAiJI;EACA;AV2oCJ;AU7xCA;;EAqJK;EAEA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AV0oCL;AUxoCM;;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EP3KN;EHuzCC,WAAW;EGtzCZ;EHwzCC,oBAAoB;EGvzCrB;EHyzCC,yBAAyB;EGxzC1B;EH0zCC,iBAAiB;EGzzClB;EH2zCC,UAAU;EG1zCX;EH4zCC,QAAQ;EG3zCT;EH6zCC,UAAU;AACZ;AUt0CA;EAuLI;EACA;EACA;EACA;EACA;EACA;EPpJH;EHuyCC,gCAAgC;EGtyC9B;EHwyCF,yBAAyB;EGvyCrB;AHyyCN;AUn1CA;EAgMK;EACA;EACA;AVspCL;AUx1CA;;EAsMK;EACA;EACA;EACA;AVspCL;AU/1CA;EA6MK;AVqpCL;AUhpCG;EAGG;EACA;EACA;AVgpCN;AUrpCG;;EAUG;AV+oCN;AUjoCC;EAGE;AVioCH;AUpoCC;EAMG;AVioCJ;AUvoCC;;EAUG;AVioCJ;AUhoCI;;EACC;AVmoCL;AU/oCC;EAqBE;EACA;EP1OF;EACG;EACE;EACG;AHw2CT;AU9nCG;EAEC;AV+nCJ;AU1pCC;EA6CK;AVgnCN;AU9mCO;EPvRN;EHw4CC,WAAW;EGv4CZ;EHy4CC,oBAAoB;EGx4CrB;EH04CC,yBAAyB;EGz4C1B;EH24CC,iBAAiB;EG14ClB;EH44CC,UAAU;EG34CX;EH64CC,QAAQ;EG54CT;EH84CC,UAAU;AACZ;AU7qCC;EAyDK;AVunCN;AUhrCC;;EA4DK;AVwnCN;AUvmCQ;EPrTP;EH+5CC,WAAW;EG95CZ;EHg6CC,oBAAoB;EG/5CrB;EHi6CC,yBAAyB;EGh6C1B;EHk6CC,iBAAiB;EGj6ClB;EHm6CC,UAAU;EGl6CX;EHo6CC,QAAQ;EGn6CT;EHq6CC,UAAU;AACZ;AU7nCE;;EAkBE;AV+mCJ;AU7mCI;;EAGC;AV8mCL;AUtmCC;EAKE;EACA;AVomCH;AU1mCC;EASG;AVomCJ;AU7mCC;;EAgBE;EACA;EACA;EACA;AVimCH;AUhmCG;;EAGC;AVimCJ;AUxnCC;EA6BE;EAEA;EACA;EAEA;EAGA;AV0lCH;AU/nCC;EA0CK;AVwlCN;AUtlCO;EP1XN;EHm9CC,WAAW;EGl9CZ;EHo9CC,oBAAoB;EGn9CrB;EHq9CC,yBAAyB;EGp9C1B;EHs9CC,iBAAiB;EGr9ClB;EHu9CC,UAAU;EGt9CX;EHw9CC,QAAQ;EGv9CT;EHy9CC,UAAU;AACZ;AUlpCC;EAuDK;AV8lCN;AUrpCC;;EA2DK;AV8lCN;AUrlCC;EAIG;AVolCJ;AUxlCC;;EAQG;AVolCJ;AU9kCG;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EP9VF;EACG;EACK;AH+6CV;AU3kCG;EACC;AV6kCJ;AU7mCC;EAwCE;AVwkCH;AUhnCC;EA2CE;AVwkCH;AU1jCI;EACC;AV4jCL;AU3iCI;EAEC;AV4iCL;AUhjCE;;EASE;AV2iCJ;AU1iCI;;EAEC;AV4iCL;AUxjCE;EAgBE;AV2iCJ;AUhiCK;EAEC;AViiCN;AACA;oDACoD;AACpD;oDACoD;AACpD;oDACoD;AACpD;oDACoD;AWniDpD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EXqiDC;qDACmD;EGvhDpD;EACG;EACE;EACG;EAXR;EACG;EACE;EACG;EHqiDP;qDACmD;EACnD;qDACmD;AACrD;AWziDC;ERKA;EACG;EACE;EACG;EAXR;EACG;EACE;EACG;AHmjDT;AWpkDA;EA2BE;EACA;EACA;EACA;EACA;AX4iDF;AWziDC;EAEE;AX0iDH;AWviDC;EAEE;AXwiDH;AWriDC;EAEE;AXsiDH;AWniDC;EAEE;AXoiDH;AWjiDC;EAEE;AXkiDH;AW/hDC;EAEE;AXgiDH;AW7lDA;EAmEE;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;ERrDD;EACG;EACE;EACG;EAXR;EACG;EACE;EACG;EQgEP;EACA;AX+hDF;AWjnDA;EAsFG;EACA;EACA;EAEA;ERlDF;EHglDC,gCAAgC;EG/kD9B;EHilDF,yBAAyB;EGhlDrB;AHklDN;AW5nDA;EA8FI;EACA;EAEA;AXgiDJ;AWjoDA;EAoGK;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;EACA;EACA;EACA;EACA;AX6hDL;AW1hDM;EACC;EACA;EACA;EACA;EACA;EACA;EACA;ER7HN;EH0pDC,WAAW;EGzpDZ;EH2pDC,oBAAoB;EG1pDrB;EH4pDC,yBAAyB;EG3pD1B;EH6pDC,iBAAiB;EG5pDlB;EH8pDC,UAAU;EG7pDX;EH+pDC,QAAQ;EG9pDT;EHgqDC,UAAU;AACZ;AACA;oDACoD;AACpD;oDACoD;AACpD;oDACoD;AACpD;oDACoD;AYjrDpD;EAEC;EACA;EACA;EACA;EAEA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EZgrDC;qDACmD;EG1qDpD;EACG;EACE;EACG;EAXR;EACG;EACE;EACG;AHwrDT;AYzsDA;EAqBE;EACA;EACA;AZurDF;AYlrDC;EACC;AZorDF;AY/qDC;EACC;AZirDF;AACA;oDACoD;AACpD;oDACoD;AACpD;oDACoD;AACpD;oDACoD;Aa7tDpD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;Ab+tDD;Aa7tDA;EACC;EACA;EACA;EACA;EACA;EACA;Ab+tDD;AaruDA;EASE;EACA;EACA;Ab+tDF;Aa1uDA;;EAaG;EACA;AbiuDH;Aa/uDA;;EAiBI;EACA;EACA;EACA;EACA;EACA;AbkuDJ;AaxvDA;;EA0BK;EAEA;EAEA;EACA;AbguDL;Aa9tDI;;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AbiuDL;Aa7tDG;;EV/BF;EACG;EACE;EACG;EAXR;EACG;EACE;EACG;AH4wDT;AajuDG;;EVtCF;EACG;EACE;EACG;EAXR;EACG;EACE;EACG;AHuxDT;Aa/xDA;EA4DG;EACA;AbsuDH;AanyDA;EA+DI;EACA;EACA;EACA;EACA;AbuuDJ;AaruDI;EACC;EAEA;EACA;EACA;EACA;AbsuDL;AajzDA;EAuFI;EACA;EACA;EACA;EACA;Ab6tDJ;AaxzDA;EA6FK;EACA;EACA;EACA;Ab8tDL;Aa9zDA;EAmGM;EACA;EACA;EACA;EACA;Ab8tDN;AaxtDI;EACC;EACA;EACA;Ab0tDL;AavtDI;EAEE;AbwtDN;AattDK;EACC;AbwtDN;AACA;oDACoD;AACpD;oDACoD;AACpD;oDACoD;Acl2DpD;EACC;EACA;EACA;Ado2DD;Acl2DA;EXoBC;EACG;EACE;EACG;EAXR;EACG;EACE;EACG;AH61DT;Acv2DA;EXeC;EACG;EACE;EACG;EAXR;EACG;EACE;EACG;AHu2DT;AACA;oDACoD;Ae33DpD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;Af63DD;Aep4DA;EAUE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EZ+BA;EACA;EACE;EACK;EYhCP;EACA;EACG;EACE;EACA;Afg4DP;Aev5DA;EA0BE;EACA;EACA;EACA;Afg4DF;Ae75DA;EAgCE;EACA;EACA;EACA;EACA;EAEA;Af+3DF;Aer6DA;EAyCG;EACA;EACA;EACA;EACA;EACA;EACA;Af+3DH;Ae96DA;EAmDI;EACA;EACA;EAEA;EACA;EACA;Af63DJ;Aet7DA;EAgEI;EACA;EACA;EAGA;EACA;EACA;EACA;Afu3DJ;AACA;oDACoD;Ae52DpD;EAIG;Af22DH;Ae/2DA;EAQI;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;Afy2DJ;Aez3DA;EAuBI;EACA;EACA;EACA;EACA;EACA;Afq2DJ;AACA;oDACoD;Ae11DpD;EAIG;Afy1DH;Ae71DA;EAMI;EACA;EACA;EACA;EACA;Af01DJ;AACA;oDACoD;Ael1DpD;;EZ3EC;EACA;AHi6DD;Aev1DA;;;;;;;;;;;;;;EZ3EC;EACA;AHk7DD;Aex2DA;;;;;;;;;;EAOE;EACA;Af62DF;Aer3DA;;EAWE;EACA;Af82DF;Ae13DA;;;;EZ3EC;EACA;AH28DD;Aej4DA;;;;EZ3EC;EACA;AHk9DD;Aex4DA;;;;EZ3EC;EACA;AHy9DD;Ae/4DA;;;;EZ3EC;EACA;AHg+DD;AACA;oDACoD;Aen3DpD;EACC;EACA;EACG;EACE;EACA;EAGL;EACA;Afm3DD;Ae53DA;;;;;;;EAcE;Afu3DF;Aer4DA;;EAiBE;Afw3DF;Aez4DA;;EAsBG;Afu3DH;Ae74DA;;EAwBI;Afy3DJ;AACA;oDACoD;AACpD;oDACoD;Aeh3DpD;EAGG;Efg3DD,wDAAwD;EG/gEzD;EHihEC,0BAA0B;EG/gE3B;EAYC;EACG;EACK;AHsgEV;Ae13DA;EAOI;Afs3DJ;AACA;oDACoD;Ae92DpD;EAGE;EACA;Af82DF;Ael3DA;EAMG;EACA;EACA;EACA;EAEA;Ef82DD,WAAW;Ee72DV;EAEA;EACA;Ef82DD,gBAAgB;AAClB;Ae93DA;EAiBI;EAEG;Ef+2DL,WAAW;Ee92DT;EACA;EACA;Efg3DF,WAAW;Ee/2DT;EACA;EACA;EACA;Afi3DJ;Ae34DA;EA4BK;EACA;EACA;EACA;EACA;EAEA;EAEA;Afg3DL;Aep5DA;EAuCK;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;Afg3DL;Ae/5DA;EAkDM;EACA;EACA;Afg3DN;Ae12DE;;EAII;Af02DN;Aep2DE;EAGG;EACA;Efo2DH,WAAW;AACb;Aez2DE;EAMI;EACA;Afs2DN;AACA;oDACoD;AACpD;oDACoD;Aer1DpD;;;;;EAMM;Afs1DN;AACA;oDACoD;AACpD;oDACoD;AgB1qEpD;;EACC;EACA;EACA;EACA;AhB6qED;AgBjrEA;;EAOE;EACA;EACA;AhB8qEF;AgBvrEA;;;;EAcE;EACA;EACK;EACL;EhB+qEA,4BAA4B;EAC5B;;;;;GAKC;EGzpED;EACA;EACE;EACK;AH2pET;AgB3sEA;;;;EAkCG;AhB+qEH;AgBjtEA;;EAsCE;EACA;EACA;AhB+qEF;AgBvtEA;;EA4CE;EACA;EbAA;EACA;EACE;EACK;AHgrET;AgBhuEA;;EAgDG;AhBorEH;AACA;oDACoD;AgB9qEpD;;;;;;EAGG;EACA;AhBmrEH;AgBvrEA;;;;;;EASG;EACA;AhBsrEH;AACA;oDACoD;AgBjrEpD;;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AhBmrEF;AgB/qEA;EACC;EACA;EACG;AhBirEJ;AgBprEA;;EAKE;AhBmrEF;AgBxrEA;EAQE;AhBmrEF;AgB3rEA;EAWE;AhBmrEF;AgBhrEA;EACC;EACA;AhBkrED;AgBprEA;EAIE;AhBmrEF;AgBvrEA;EAOE;AhBmrEF;AACA;oDACoD;AgB7qEpD;;EbzEE;EACA;EACE;EACK;AH0vET;AgBprEA;;EbzEE;EACA;EACE;EACK;AHiwET;AgBnrEA;EAEQ;AhBorER;AgBjrEA;EAEE;AhBkrEF;AgBxqEA;EAEK;AhByqEL;AgB3qEA;EAIG;AhB0qEH;AgB9qEA;;EASG;EACA;AhByqEH;AgBnrEA;;;;EAaG;AhB4qEH;AgBzrEA;;EblGE;EACA;EACE;EACK;AH+xET;AgBhsEA;EAqBQ;EbvHN;EACA;EACE;EACK;AHsyET;AgBvsEA;EA2BG;Eb7HD;EACA;EACE;EACK;AH6yET;AgB1qEA;EAEE;AhB2qEF;AgB7qEA;EAIQ;Eb1IN;EACA;EACE;EACK;AHuzET;AgBprEA;EAUG;EbhJD;EACA;EACE;EACK;AH8zET;AgB3rEA;EAiBG;EbvJD;EACA;EACE;EACK;AHq0ET;AgBlsEA;EbtIE;EACA;EACE;EACK;Ea2JJ;AhBirEL;AgB3qEA;EbpKE;EACA;EACE;EACK;AHk1ET;AgBjrEA;EbpKE;EACA;EACE;EACK;AHw1ET;AgBvrEA;EbpKE;EACA;EACE;EACK;AH81ET;AgB7rEA;EbpKE;EACA;EACE;EACK;AHo2ET;AgB3qEA;;;;;;;;EAEE;AhBmrEF;AACA;oDACoD;AACpD;oDACoD;AiBl6EpD;EACC;EACA;EACA;Ed+HA;EACG;EACC;EACC;EACG;EcjIR;EACA;EAGA;AjBs6ED;AiB/6EA;;;;;EAWE;EACA;AjB26EF;AiBv7EA;EAeE;EACA;EACA;EACA;EACA;EACA;AjB26EF;AiB/7EA;EAwBE;EACA;EACA;EAEA;EACA;EACA;AjBy6EF;AiBv8EA;EAiCE;EACA;EACA;EAEA;EACA;AjBw6EF;AiB98EA;EAwCG;EACA;EACA;EACA;EACA;EACA;AjBy6EH;AiBt9EA;EAgDI;EACA;EACA;EACA;AjBy6EJ;AACA;oDACoD;AACpD;oDACoD;AACpD;oDACoD;AACpD;oDACoD;AkBv+EpD;EAGC;EACA;EACA;EACA;EACA;EACA;EACA;AlBu+ED;AkBn+EE;EACC;EACA;AlBq+EH;AkBp/EA;EAkBG;Gf2HF;AH22ED;AG12EC;;EAEC;EACA;AH42EF;AG12EC;EACC;AH42EF;AkBhgFA;EAuBK;EAIA;AlBy+EL;AkBpgFA;EAyBM;AlB8+EN;AkBvgFA;;EAiCK;EACA;EACA;AlB0+EL;AkB7gFA;;;;EAwCI;EACA;AlB2+EJ;AACA;oDACoD;AkBj+EjD;EACC;EACA;AlBm+EJ;AACA;oDACoD;AkB39EpD;EACC;EACA;EfoCA;EACG;EACK;AH07ET;AkBx9EA;;;;EAEE;EACA;AlB49EF;AkB/9EA;;EAME;EACA;AlB69EF;AACA;oDACoD;AkB19EpD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AlB49ED;AACA;oDACoD;AkBz9EpD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AlB29ED;AACA;oDACoD;AkBx9EpD;;;;EAGE;EfbD;EACG;EACK;AHy+ET;AACA;oDACoD;AkBh9EpD;EAEE;EACA;EACA;EACA;AlBi9EF;AkB/8EG;EACC;EACA;AlBi9EJ;AkB19EA;;EAgBI;EACA;EACA;EACA;AlB88EJ;AkBj+EA;EAsBI;AlB88EJ;AACA;oDACoD;AACpD;oDACoD;AkBl8EpD;EAEE;EACA;EACA;EACA;AlBm8EF;AkBh8EG;EACC;EACA;AlBk8EJ;AACA;oDACoD;AmBvnFpD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;AnBwnFD;AmBloFA;EAYE;AnBynFF;AmBroFA;;EAoBE;AnBqnFF;AmBzoFA;;EAuBE;EACA;EACA;EACA;EACA;EACA;AnBsnFF;AmBlpFA;;EA8BG;EACA;EACA;EACA;AnBwnFH;AmBzpFA;EAqCE;EACA;EACA;EACA;EACA;EACA;AnBunFF;AmB5mFA;;;;EAEE;EACA;AnBgnFF;AmBnnFA;;;;;;;;EAKG;AnBwnFH;AmB7nFA;;;;;;;;EAOI;AnBgoFJ;AmBvoFA;;;;EAWG;EACA;AnBkoFH;AACA;oDACoD;AmB5nFpD;EAEE;EACA;EACA;EACA;EACA;AnB6nFF;AmBnoFA;;EAcG;EACA;AnBynFH;AACA;oDACoD;AmBpnFpD;;EAIG;EACA;AnBonFH;AACA;oDACoD;AACpD;oDACoD;AoBxtFpD;EAGG;ApBwtFH;AqBluFA;EAEE;EAIA;ArBguFF;AqBtuFA;EAQG;EACA;EACA;EACA;EACA;ArBiuFH;AqB7uFA;EAcI;EACA;EACA;ArBkuFJ;AqBlvFA;EAuBG;ArB8tFH;AqBrvFA;EA0BG;ArB8tFH;AqBxvFA;EA8BG;ArB6tFH;AqB3vFA;;EAkCI;EACA;ArB6tFJ;AqBhwFA;;;;EAqCK;ArBiuFL;AqBvtFA;EAGG;EACA;EACA;ArButFH;AqBntFA;EAMK;EACA;ArBgtFL;AqBzsFA;EAIG;EACA;ArBwsFH;AqB7sFA;EAQK;EACA;ArBwsFL;AsBvxFA;EAEE;EACA;AtBwxFF;AsB3xFA;EAMG;EACA;EACA;EACA;EACA;EACA;AtBwxFH;AsBnyFA;EAaI;EACA;EACA;AtByxFJ;AsBxxFI;;EACC;EACA;AtB2xFL;AsBrxFI;EACC;EACA;AtBuxFL;AsBrxFI;EACC;EACA;AtBuxFL;AsBrzFA;EAkCI;EACA;EAEA;EACA;EACA;AtBqxFJ;AsB5wFA;EAGG;EACA;EACA;EACA;AtB4wFH;AsBvwFA;EACC;IAKI;IACA;EtBqwFH;AACF;AsB9vFA;EACC;IAKI;IACA;EtB4vFH;AACF;AuBt0FA;EAGG;AvBs0FH;AwBj1FA;EAEE;AxBk1FF;AyBp1FA;EAEE;EACA;AzBq1FF;AyBx1FA;EAKG;EACA;AzBs1FH;A0B51FA;EAIE;EACA;EACA;EAEA;A1B01FF;A0Bl2FA;EAUG;EACA;EAEA;EACA;A1B01FH;A0Bx2FA;EAoBG;EACA;EACA;EACA;A1Bu1FH;A0B92FA;EA0BG;EACA;EACA;EACA;A1Bu1FH;A0Bp3FA;EAiCG;EACA;EACA;EAEA;EACA;EAEA;A1Bo1FH;A0B53FA;EA2CG;EAEA;A1Bm1FH;A0Bh4FA;EAiDG;EACA;A1Bk1FH;A0Bp4FA;EAsDG;EACA;A1Bi1FH;A0B30FA;EAGG;EACA;EACA;EACA;EACA;EACA;EACA;A1B20FH;A0Bv0FA;;EAGG;E1Bw0FD,wDAAwD;EGn1FzD;EHq1FC,0BAA0B;EGn1F3B;EAYC;EACG;EACK;AH00FV;A0Bl1FA;;EvBDC;EACA;AHu1FD;A0Bv1FA;;EAUI;EACA;A1Bi1FJ;A0B51FA;;EAcI;A1Bk1FJ;A0Bh2FA;;EAiBI;A1Bm1FJ;A0B70FA;;EAGG;EACA;A1B80FH;A2Bn7FA;EAIE;EACA;EACA;EAEA;A3Bi7FF;A2Bz7FA;EAWG;EACA;EACA;EACA;EACA;A3Bi7FH;A2Bh8FA;EAkBG;EAEA;EACA;A3Bg7FH;A2Br8FA;EAwBG;EACA;A3Bg7FH;A2Bz8FA;EA6BG;EACA;A3B+6FH;A2B78FA;EAsCK;EACA;EACA;EACA;A3B06FL;A2Bz6FK;EACC;EACA;EACA;EACA;EACA;A3B26FN;A2Bl6FA;;EAGG;E3Bm6FD,wDAAwD;EG55FzD;EH85FC,0BAA0B;EG55F3B;EAYC;EACG;EACK;AHm5FV;A2B76FA;;ExBiBC;EACA;AHg6FD;A2Bl7FA;;EAUI;EACA;A3B46FJ;A2Bt6FA;EAGG;EACA;A3Bs6FH;AACA;oDACoD;A4B57FpD;EACC;EACA;EACA;EACA;EACA;EACA;EzBwEA;EACG;EACC;EACC;EACG;EyB1ER;EACA;EACA;EACA;EACA;A5Bk8FD;A4Bh8FC;EACC;EACA;EACA;EACA;A5Bk8FF;A4B/7FC;EACC;EACA;EACA;A5Bi8FF;AACA;oDACoD;A4B77FpD;EzBkBC;EACG;EACK;AH86FT;A4B37FA;;;;;;;;;;;EAEE;EACA;A5Bs8FF;A4Bz8FA;;EAQG;A5Bq8FH;A4B78FA;EAaE;A5Bm8FF;A4Bh9FA;EAiBE;A5Bk8FF;A4Bn9FA;EAqBE;A5Bi8FF;A4Bt9FA;EAyBE;A5Bg8FF","file":"../css/timeline.css","sourcesContent":["/*!\n\tTimeline JS 3 \n\t\n\tDesigned and built by Zach Wise for the Northwestern University Knight Lab\n\t\n\tThis Source Code Form is subject to the terms of the Mozilla Public\n\tLicense, v. 2.0. If a copy of the MPL was not distributed with this\n\tfile, You can obtain one at https://mozilla.org/MPL/2.0/.\n\n*/\n/* Includes \n================================================== */\n/*\tVARIABLES\n----------------------------------------------------- */\n/* ICON PATH\n================================================== */\n/* TYPEFACE\n================================================== */\n/* COLOR SCHEME\n================================================== */\n/* UI COLOR\n================================================== */\n/* UI\n================================================== */\n/* Animation\n================================================== */\n/* GFX\n================================================== */\n/*!\n\tTimeline JS 3\n\n\tDesigned and built by Zach Wise for the Northwestern University Knight Lab\n\n\tThis Source Code Form is subject to the terms of the Mozilla Public\n\tLicense, v. 2.0. If a copy of the MPL was not distributed with this\n\tfile, You can obtain one at https://mozilla.org/MPL/2.0/.\n\n*/\n/* Includes\n================================================== */\n/*\tMixins.less\n\tSnippets of reusable CSS to develop faster and keep code readable\n * ----------------------------------------------------------------- */\n/*\tReset\n------------------------------------------------------------------------------------------- */\n.tl-storyjs {\n /*\tReset tags and common classes\n\t\tDisplay in IE6-9 and FF3\n\t\tBased on: http://github.com/necolas/normalize.css\n\t------------------------------------------------------------------------------------------- */\n /*\tPrevents modern browsers from displaying 'audio' without controls\n\t\tBased on: http://github.com/necolas/normalize.css\n\t------------------------------------------------------------------------------------------- */\n /*\tPrevents sub and sup affecting line-height in all browsers\n\t\tBased on: http://github.com/necolas/normalize.css\n\t------------------------------------------------------------------------------------------- */\n /*\tImg border in a's and image quality\n\t\tBased on: http://github.com/necolas/normalize.css\n\t------------------------------------------------------------------------------------------- */\n /*\tForms\n\t\tBased on: http://github.com/necolas/normalize.css\n\t------------------------------------------------------------------------------------------- */\n}\n.tl-storyjs div * {\n -webkit-box-sizing: content-box;\n -moz-box-sizing: content-box;\n box-sizing: content-box;\n}\n.tl-storyjs h1,\n.tl-storyjs h2,\n.tl-storyjs h3,\n.tl-storyjs h4,\n.tl-storyjs h5,\n.tl-storyjs h6,\n.tl-storyjs p,\n.tl-storyjs blockquote,\n.tl-storyjs pre,\n.tl-storyjs a,\n.tl-storyjs abbr,\n.tl-storyjs acronym,\n.tl-storyjs address,\n.tl-storyjs cite,\n.tl-storyjs code,\n.tl-storyjs del,\n.tl-storyjs dfn,\n.tl-storyjs em,\n.tl-storyjs img,\n.tl-storyjs q,\n.tl-storyjs s,\n.tl-storyjs samp,\n.tl-storyjs small,\n.tl-storyjs strike,\n.tl-storyjs strong,\n.tl-storyjs sub,\n.tl-storyjs sup,\n.tl-storyjs tt,\n.tl-storyjs var,\n.tl-storyjs dd,\n.tl-storyjs dl,\n.tl-storyjs dt,\n.tl-storyjs li,\n.tl-storyjs ol,\n.tl-storyjs ul,\n.tl-storyjs fieldset,\n.tl-storyjs form,\n.tl-storyjs label,\n.tl-storyjs legend,\n.tl-storyjs button,\n.tl-storyjs table,\n.tl-storyjs caption,\n.tl-storyjs tbody,\n.tl-storyjs tfoot,\n.tl-storyjs thead,\n.tl-storyjs tr,\n.tl-storyjs th,\n.tl-storyjs td,\n.tl-storyjs .tl-container,\n.tl-storyjs .content-container,\n.tl-storyjs .media,\n.tl-storyjs .text,\n.tl-storyjs .tl-slider,\n.tl-storyjs .slider,\n.tl-storyjs .date,\n.tl-storyjs .title,\n.tl-storyjs .message,\n.tl-storyjs .map,\n.tl-storyjs .credit,\n.tl-storyjs .caption,\n.tl-storyjs .tl-feedback,\n.tl-storyjs .tl-feature,\n.tl-storyjs .toolbar,\n.tl-storyjs .marker,\n.tl-storyjs .dot,\n.tl-storyjs .line,\n.tl-storyjs .flag,\n.tl-storyjs .time,\n.tl-storyjs .era,\n.tl-storyjs .major,\n.tl-storyjs .minor,\n.tl-storyjs .tl-navigation,\n.tl-storyjs .start,\n.tl-storyjs .active {\n margin: 0;\n padding: 0;\n border: 0;\n font-weight: normal;\n font-style: normal;\n font-size: 100%;\n line-height: 1;\n font-family: inherit;\n width: auto;\n float: none;\n}\n.tl-storyjs h1,\n.tl-storyjs h2,\n.tl-storyjs h3,\n.tl-storyjs h4,\n.tl-storyjs h5,\n.tl-storyjs h6 {\n clear: none;\n}\n.tl-storyjs table {\n border-collapse: collapse;\n border-spacing: 0;\n}\n.tl-storyjs ol,\n.tl-storyjs ul {\n list-style: none;\n}\n.tl-storyjs q:before,\n.tl-storyjs q:after,\n.tl-storyjs blockquote:before,\n.tl-storyjs blockquote:after {\n content: \"\";\n}\n.tl-storyjs a:focus {\n outline: thin dotted;\n}\n.tl-storyjs a:hover,\n.tl-storyjs a:active {\n outline: 0;\n}\n.tl-storyjs article,\n.tl-storyjs aside,\n.tl-storyjs details,\n.tl-storyjs figcaption,\n.tl-storyjs figure,\n.tl-storyjs footer,\n.tl-storyjs header,\n.tl-storyjs hgroup,\n.tl-storyjs nav,\n.tl-storyjs section {\n display: block;\n}\n.tl-storyjs audio,\n.tl-storyjs canvas,\n.tl-storyjs video {\n display: inline-block;\n *display: inline;\n *zoom: 1;\n}\n.tl-storyjs audio:not([controls]) {\n display: none;\n}\n.tl-storyjs div {\n max-width: none;\n}\n.tl-storyjs sub,\n.tl-storyjs sup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n.tl-storyjs sup {\n top: -0.5em;\n}\n.tl-storyjs sub {\n bottom: -0.25em;\n}\n.tl-storyjs img {\n border: 0;\n -ms-interpolation-mode: bicubic;\n}\n.tl-storyjs button,\n.tl-storyjs input,\n.tl-storyjs select,\n.tl-storyjs textarea {\n font-size: 100%;\n margin: 0;\n vertical-align: baseline;\n *vertical-align: middle;\n}\n.tl-storyjs button,\n.tl-storyjs input {\n line-height: normal;\n *overflow: visible;\n}\n.tl-storyjs button::-moz-focus-inner,\n.tl-storyjs input::-moz-focus-inner {\n border: 0;\n padding: 0;\n}\n.tl-storyjs button,\n.tl-storyjs input[type=\"button\"],\n.tl-storyjs input[type=\"reset\"],\n.tl-storyjs input[type=\"submit\"] {\n cursor: pointer;\n -webkit-appearance: button;\n}\n.tl-storyjs input[type=\"search\"] {\n -webkit-appearance: textfield;\n -webkit-box-sizing: content-box;\n -moz-box-sizing: content-box;\n box-sizing: content-box;\n}\n.tl-storyjs input[type=\"search\"]::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n.tl-storyjs textarea {\n overflow: auto;\n vertical-align: top;\n}\n.tl-timeline {\n font-family: \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n /* VCard\n\t================================================== */\n}\n.tl-timeline h1,\n.tl-timeline h2,\n.tl-timeline h3,\n.tl-timeline h4,\n.tl-timeline h5,\n.tl-timeline h6 {\n color: #000;\n}\n.tl-timeline h1,\n.tl-timeline h2,\n.tl-timeline h3 {\n font-size: 28px;\n line-height: 28px;\n}\n.tl-timeline h1 small,\n.tl-timeline h2 small,\n.tl-timeline h3 small {\n font-size: 24px;\n line-height: 24px;\n}\n.tl-timeline h4,\n.tl-timeline h5,\n.tl-timeline h6 {\n font-size: 24px;\n line-height: 24px;\n margin-bottom: 0px;\n}\n.tl-timeline h4 small,\n.tl-timeline h5 small,\n.tl-timeline h6 small {\n font-size: 15px;\n line-height: 15px;\n}\n.tl-timeline h2.tl-headline-title {\n font-size: 38px;\n line-height: 38px;\n}\n.tl-timeline h2.tl-headline-title small {\n display: block;\n margin-top: 5px;\n font-size: 24px;\n line-height: 24px;\n}\n.tl-timeline h2 {\n margin-top: 20px;\n margin-bottom: 5px;\n}\n.tl-timeline p {\n margin-top: 5px;\n margin-bottom: 10px;\n font-size: 15px;\n line-height: 1.42857143;\n color: #666666;\n}\n.tl-timeline p.lead {\n font-size: 24px;\n}\n.tl-timeline p a {\n /*\n\t\t\tcolor: lighten(@color-dark, 40%);\n\t\t\ttext-decoration: none;\n\t\t\tbackground-image: -moz-linear-gradient(top, fade(lighten(@color-dark, 40%), 0%) 50%, fade(lighten(@color-dark, 40%), 60%) 50%);\n\t\t\tbackground-image: -webkit-linear-gradient(top, fade(lighten(@color-dark, 40%), 0%) 50%, fade(lighten(@color-dark, 40%), 60%) 50%);\n\t\t\tbackground-image: -o-linear-gradient(top, fade(lighten(@color-dark, 40%), 0%) 50%, fade(lighten(@color-dark, 40%), 60%) 50%);\n\t\t\tbackground-image: linear-gradient(to bottom, fade(lighten(@color-dark, 40%), 0%) 50%, fade(lighten(@color-dark, 40%), 60%) 50%);\n\t\t\tbackground-repeat: repeat-x;\n\t\t\tbackground-size: 2px 2px;\n\t\t\tbackground-position: 0 @base-font-size+2;\n\t\t\ttext-shadow: -2px -1px 0 white, 2px -1px 0 white, -2px 1px 0 white, 2px 1px 0 white;\n\t\t\t&:hover,\n\t\t\t&:focus {\n\t\t\t\tcolor:@color-theme;\n\t\t\t\ttext-decoration: none;\n\t\t\t}\n\t\t\t*/\n color: #666666;\n text-decoration: underline;\n}\n.tl-timeline p a:hover,\n.tl-timeline p a:focus {\n color: #c34528;\n}\n@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {\n .tl-timeline p a {\n text-decoration: underline;\n background-image: none;\n text-shadow: none;\n }\n .tl-timeline p a:hover,\n .tl-timeline p a:focus {\n color: #c34528;\n text-decoration: underline;\n }\n}\n.tl-timeline b,\n.tl-timeline strong {\n font-weight: bold;\n}\n.tl-timeline i,\n.tl-timeline em {\n font-style: italic;\n}\n.tl-timeline a {\n text-decoration: none;\n color: #c34528;\n}\n.tl-timeline a:hover {\n text-decoration: underline;\n color: #6e2717;\n}\n.tl-timeline .tl-caption,\n.tl-timeline .tl-credit,\n.tl-timeline .tl-slidenav-next,\n.tl-timeline .tl-slidenav-previous {\n font-size: 11px;\n line-height: 11px;\n}\n.tl-timeline .tl-caption a,\n.tl-timeline .tl-credit a,\n.tl-timeline .tl-slidenav-next a,\n.tl-timeline .tl-slidenav-previous a {\n color: #000;\n}\n.tl-timeline .tl-makelink {\n word-break: break-all;\n word-break: break-word;\n -webkit-hyphens: auto;\n -moz-hyphens: auto;\n hyphens: auto;\n}\n.tl-timeline blockquote,\n.tl-timeline blockquote p {\n font-family: \"Georgia\", \"Times New Roman\", Times, serif;\n color: #999999;\n font-size: 24px;\n line-height: 24px;\n text-align: left;\n background: transparent;\n border: 0px;\n padding: 0px;\n}\n.tl-timeline blockquote cite,\n.tl-timeline blockquote p cite {\n font-family: \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n font-size: 11px;\n color: #666666;\n display: block;\n text-align: right;\n font-style: normal;\n}\n.tl-timeline blockquote cite:before,\n.tl-timeline blockquote p cite:before {\n content: \"\\2014\";\n}\n.tl-timeline blockquote p:before {\n content: open-quote;\n display: inline-block;\n font-size: 28px;\n position: relative;\n top: 8px;\n margin-right: 5px;\n}\n.tl-timeline blockquote p:after {\n content: close-quote;\n display: inline-block;\n font-size: 28px;\n position: relative;\n top: 8px;\n margin-left: 3px;\n}\n.tl-timeline blockquote {\n margin: 10px;\n}\n.tl-timeline blockquote p {\n margin: 0;\n}\n.tl-timeline .vcard {\n font-family: \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n font-size: 15px;\n line-height: 15px;\n *zoom: 1;\n margin-bottom: 15px;\n margin-top: 10px;\n}\n.tl-timeline .vcard:before,\n.tl-timeline .vcard:after {\n display: table;\n content: \"\";\n}\n.tl-timeline .vcard:after {\n clear: both;\n}\n.tl-timeline .vcard .twitter-date {\n text-align: left;\n font-size: 11px;\n}\n.tl-timeline .vcard .author {\n float: right;\n}\n.tl-timeline .vcard a {\n color: #333333;\n text-decoration: none;\n}\n.tl-timeline .vcard a:hover {\n text-decoration: none;\n}\n.tl-timeline .vcard a:hover .fn,\n.tl-timeline .vcard a:hover .nickname {\n color: #c34528;\n}\n.tl-timeline .vcard .fn,\n.tl-timeline .vcard .nickname {\n padding-left: 42px;\n}\n.tl-timeline .vcard .fn {\n display: block;\n font-weight: bold;\n}\n.tl-timeline .vcard .nickname {\n margin-top: 1px;\n display: block;\n color: #666666;\n}\n.tl-timeline .vcard .avatar {\n float: left;\n display: block;\n width: 32px;\n height: 32px;\n}\n.tl-timeline .vcard .avatar img {\n -moz-border-radius: 5px;\n -webkit-border-radius: 5px;\n border-radius: 5px;\n}\n.tl-timeline .tl-text ul {\n padding: 0px;\n padding-left: 30px;\n margin: 0;\n}\n.tl-timeline .tl-text ul li {\n margin-bottom: 5px;\n}\n.tl-timeline .tl-button-calltoaction {\n cursor: pointer;\n font-weight: bold;\n padding-top: 10px;\n margin-bottom: 10px;\n padding-bottom: 10px;\n}\n.tl-timeline .tl-button-calltoaction .tl-button-calltoaction-text {\n display: inline-block;\n background-color: #c34528;\n color: #fff;\n padding: 10px 15px 10px 15px;\n border-radius: 7px;\n}\n.tl-timeline .tl-note {\n display: block;\n font-family: \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n font-style: italic;\n background-color: #e6e6e6;\n font-size: 15px;\n line-height: 17px;\n padding: 10px;\n -webkit-border-radius: 7px;\n -moz-border-radius: 7px;\n border-radius: 7px;\n color: #8a6d3b;\n background-color: #fcf8e3;\n border: 1px solid #faebcc;\n text-shadow: none;\n}\n@media only screen and (max-width: 800px), only screen and (max-device-width: 800px) {\n .tl-timeline h1,\n .tl-timeline h2,\n .tl-timeline h3 {\n font-size: 28px;\n line-height: 28px;\n }\n}\n@media only screen and (max-width: 500px), only screen and (max-device-width: 500px) {\n .tl-timeline h1,\n .tl-timeline h2,\n .tl-timeline h3 {\n font-size: 24px;\n line-height: 24px;\n }\n}\n.tl-skinny h2 {\n margin-top: 0px;\n}\n/* Icons\n================================================== */\n@font-face {\n font-family: 'tl-icons';\n src: url('../css/icons/tl-icons.eot');\n src: url('../css/icons/tl-icons.eot?#iefix') format('embedded-opentype'), url('../css/icons/tl-icons.ttf') format('truetype'), url('../css/icons/tl-icons.woff2') format('woff2'), url('../css/icons/tl-icons.woff') format('woff'), url('../css/icons/tl-icons.svg#tl-icons') format('svg');\n font-weight: normal;\n font-style: normal;\n}\n[class^=\"tl-icon-\"],\n[class*=\" tl-icon-\"] {\n font-family: 'tl-icons';\n speak: none;\n font-style: normal;\n font-weight: normal;\n font-variant: normal;\n text-transform: none;\n line-height: 1;\n /* Better Font Rendering =========== */\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n.tl-icon-vine:after {\n content: \"\\e64d\";\n}\n.tl-icon-wikipedia:after {\n content: \"\\e64e\";\n}\n.tl-icon-chevron-right:after {\n content: \"\\e64f\";\n}\n.tl-icon-chevron-left:after {\n content: \"\\e650\";\n}\n.tl-icon-youtube-logo:after {\n content: \"\\e651\";\n}\n.tl-icon-foursquare:after {\n content: \"\\e652\";\n}\n.tl-icon-camera-retro:after {\n content: \"\\e653\";\n}\n.tl-icon-doc:after {\n content: \"\\e654\";\n}\n.tl-icon-weibo:after {\n content: \"\\e655\";\n}\n.tl-icon-resize-horizontal:after {\n content: \"\\e656\";\n}\n.tl-icon-resize-vertical:after {\n content: \"\\e657\";\n}\n.tl-icon-resize-full:after {\n content: \"\\e658\";\n}\n.tl-icon-resize-small:after {\n content: \"\\e659\";\n}\n.tl-icon-twitter:after {\n content: \"\\e62b\";\n}\n.tl-icon-google-plus:after {\n content: \"\\e62c\";\n}\n.tl-icon-video:after {\n content: \"\\e62d\";\n}\n.tl-icon-youtube:after {\n content: \"\\e62d\";\n}\n.tl-icon-plaintext:after {\n content: \"\\e62e\";\n}\n.tl-icon-storify:after {\n content: \"\\e62e\";\n}\n.tl-icon-image-v2:after {\n content: \"\\e62f\";\n}\n.tl-icon-quote-v2:after {\n content: \"\\e630\";\n}\n.tl-icon-zoom-in:after {\n content: \"\\e631\";\n}\n.tl-icon-zoom-out:after {\n content: \"\\e632\";\n}\n.tl-icon-list:after {\n content: \"\\e633\";\n}\n.tl-icon-music:after {\n content: \"\\e634\";\n}\n.tl-icon-spotify:after {\n content: \"\\e634\";\n}\n.tl-icon-location:after {\n content: \"\\e635\";\n}\n.tl-icon-googlemaps:after {\n content: \"\\e635\";\n}\n.tl-icon-web:after {\n content: \"\\e636\";\n}\n.tl-icon-share-v2:after {\n content: \"\\e637\";\n}\n.tl-icon-soundcloud:after {\n content: \"\\e639\";\n}\n.tl-icon-video-v2:after {\n content: \"\\e63a\";\n}\n.tl-icon-dailymotion:after {\n content: \"\\e63a\";\n}\n.tl-icon-tumblr:after {\n content: \"\\e63b\";\n}\n.tl-icon-lastfm:after {\n content: \"\\e63c\";\n}\n.tl-icon-github:after {\n content: \"\\e63d\";\n}\n.tl-icon-goback:after {\n content: \"\\e63e\";\n}\n.tl-icon-doc-v2:after {\n content: \"\\e63f\";\n}\n.tl-icon-googledrive:after {\n content: \"\\e640\";\n}\n.tl-icon-facebook:after {\n content: \"\\e641\";\n}\n.tl-icon-flickr:after {\n content: \"\\e642\";\n}\n.tl-icon-dribbble:after {\n content: \"\\e643\";\n}\n.tl-icon-image:after {\n content: \"\\e605\";\n}\n.tl-icon-vimeo:after {\n content: \"\\e606\";\n}\n.tl-icon-instagram:after {\n content: \"\\e644\";\n}\n.tl-icon-pinterest:after {\n content: \"\\e645\";\n}\n.tl-icon-arrow-left:after {\n content: \"\\e646\";\n}\n.tl-icon-arrow-down:after {\n content: \"\\e647\";\n}\n.tl-icon-arrow-up:after {\n content: \"\\e648\";\n}\n.tl-icon-arrow-right:after {\n content: \"\\e649\";\n}\n.tl-icon-share:after {\n content: \"\\e64a\";\n}\n.tl-icon-blockquote:after {\n content: \"\\e64b\";\n}\n.tl-icon-evernote:after {\n content: \"\\e64c\";\n}\n.tl-icon-mappin:after {\n content: \"\\e600\";\n}\n.tl-icon-swipe-right:after {\n content: \"\\e601\";\n}\n.tl-icon-swipe-left:after {\n content: \"\\e602\";\n}\n.tl-icon-touch-spread:after {\n content: \"\\e603\";\n}\n.tl-icon-touch-pinch:after {\n content: \"\\e604\";\n}\n/* Disable Text selection when dragging\n================================================== */\n.tl-dragging {\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n -o-user-select: none;\n user-select: none;\n}\n/* MenuBar \n================================================== */\n.tl-menubar {\n position: absolute;\n z-index: 11;\n text-align: center;\n color: #333;\n overflow: hidden;\n border-bottom-right-radius: 10px;\n border-top-right-radius: 10px;\n top: 100%;\n left: 50%;\n left: 0;\n}\n/* Skinny\n================================================== */\n/* Mobile, iPhone\n================================================== */\n/* Mobile, iPhone and skinny\n================================================== */\n/* Color\n================================================== */\n/*\n.tl-sizebar.tl-sizebar-inverted {\n\tborder-bottom: 1px solid #FFF;\n\t//background-color:#000;\n\tcolor:#a5a5a5;\n\t.tl-sizebar-button {\n\t\tborder-left: 1px solid darken(@color-background, 70);\n\t\t//color:#a5a5a5;\n\t}\n\t.tl-sizebar-button:hover {\n\t\t//background:@color-theme;\n\t\tcolor:@color-background;\n\t}\n}\n.tl-sizebar.tl-sizebar-inverted:before {\n\tbackground-color:#000;\n\t//.gradient-vertical (rgba(0,0,0,0.25), rgba(0,0,0,1));\n\t//.translucent-background(rgb(0,0,0), .5);\n\tborder-top: 2px solid #000;\n\tanimation: invertToBlack 1s;\n\t-webkit-animation:invertToBlack 1s; \n}\n*/\n@keyframes invertToBlack {\n from {\n background-color: #FFF;\n }\n to {\n background-color: #000;\n }\n}\n@-webkit-keyframes invertToBlack {\n from {\n background: #FFF;\n }\n to {\n background: #000;\n }\n}\n@keyframes invertToWhite {\n from {\n background-color: #000;\n }\n to {\n background-color: #FFF;\n }\n}\n@-webkit-keyframes invertToWhite {\n from {\n background: #000;\n }\n to {\n background: #FFF;\n }\n}\n/* MenuBar Button\n================================================== */\n.tl-menubar-button {\n font-size: 18px;\n line-height: 18px;\n background-color: rgba(242, 242, 242, 0.9);\n cursor: pointer;\n padding: 6px 12px 6px 12px;\n display: inline-block;\n display: block;\n color: #bfbfbf;\n}\n.tl-menubar-button.tl-menubar-button-inactive {\n opacity: 0.33;\n}\n.tl-menubar-button:hover {\n background: #333;\n color: #FFF;\n}\n.tl-menubar-button:hover.tl-menubar-button-inactive {\n color: #bfbfbf;\n background-color: rgba(242, 242, 242, 0.9);\n}\n.tl-mobile .tl-menubar-button {\n display: block;\n}\n.tl-mobile .tl-menubar-button:hover {\n background-color: rgba(242, 242, 242, 0.67);\n color: #737373;\n}\n.tl-mobile .tl-menubar-button:active {\n background: #c34528;\n color: #FFF;\n}\n@keyframes invertToBlack {\n from {\n background-color: #FFF;\n }\n to {\n background-color: #000;\n }\n}\n@-webkit-keyframes invertToBlack {\n from {\n background: #FFF;\n }\n to {\n background: #000;\n }\n}\n@keyframes invertToWhite {\n from {\n background-color: #000;\n }\n to {\n background-color: #FFF;\n }\n}\n@-webkit-keyframes invertToWhite {\n from {\n background: #000;\n }\n to {\n background: #FFF;\n }\n}\n/* MESSAGE \n================================================== */\n.tl-message,\n.tl-message-full {\n width: 100%;\n height: 100%;\n position: absolute;\n display: table;\n overflow: hidden;\n top: 0px;\n left: 0px;\n z-index: 99;\n margin: auto;\n text-align: center;\n}\n.tl-message .tl-message-container,\n.tl-message-full .tl-message-container {\n padding: 20px;\n margin: 20px;\n text-align: center;\n vertical-align: middle;\n display: table-cell;\n}\n.tl-message .tl-message-container .tl-message-content,\n.tl-message-full .tl-message-container .tl-message-content {\n color: #666;\n text-align: center;\n font-size: 11px;\n line-height: 13px;\n text-transform: uppercase;\n margin-top: 7.5px;\n margin-bottom: 7.5px;\n text-shadow: 1px 1px 1px #FFF;\n}\n.tl-message .tl-message-container .tl-message-content strong,\n.tl-message-full .tl-message-container .tl-message-content strong {\n text-transform: uppercase;\n}\n.tl-message .tl-message-container .tl-loading-icon,\n.tl-message-full .tl-message-container .tl-loading-icon {\n width: 30px;\n height: 30px;\n background-color: #666;\n vertical-align: middle;\n -webkit-box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.1);\n -moz-box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.1);\n box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.1);\n margin-left: auto;\n margin-right: auto;\n text-align: center;\n -webkit-animation: rotateplane 1.2s infinite ease-in-out;\n animation: rotateplane 1.2s infinite ease-in-out;\n}\n@-webkit-keyframes rotateplane {\n 0% {\n -webkit-transform: perspective(120px);\n }\n 50% {\n -webkit-transform: perspective(120px) rotateY(180deg);\n }\n 100% {\n -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg);\n }\n}\n@keyframes rotateplane {\n 0% {\n transform: perspective(120px) rotateX(0deg) rotateY(0deg);\n }\n 50% {\n transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);\n }\n 100% {\n transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);\n }\n}\n.tl-message-full {\n background-color: hsla(0, 0%, 100%, 0.8);\n}\n.tl-message-full [class^=\"tl-icon-\"],\n.tl-message-full [class*=\" tl-icon-\"] {\n color: #666;\n font-size: 72px;\n}\n.tl-message-full .tl-message-container .tl-message-content {\n font-size: 22px;\n line-height: 22px;\n text-shadow: none;\n color: #666;\n text-transform: none;\n font-weight: normal;\n}\n.tl-message-full .tl-message-container .tl-message-content .tl-button {\n display: inline-block;\n cursor: pointer;\n background-color: #FFF;\n color: #333;\n padding: 10px;\n margin-top: 10px;\n -webkit-border-radius: 7px;\n -moz-border-radius: 7px;\n border-radius: 7px;\n}\n/* TL.TimeNav\n================================================== */\n.tl-timenav {\n width: 100%;\n background-color: #f2f2f2;\n position: relative;\n overflow: hidden;\n border-top: 1px solid #e5e5e5;\n}\n.tl-timenav .tl-attribution {\n cursor: pointer;\n z-index: 9;\n position: absolute;\n bottom: 2px;\n left: 0px;\n font-size: 10px;\n line-height: 10px;\n font-family: \"Helvetica Neue\", Helvetica, Arial, sans-serif !important;\n background-color: rgba(255, 255, 255, 0.85);\n padding: 3px;\n /*\n\t\tright:-26px;\n\t\ttop:30px;\n\t\ttransform: rotate(90deg);\n\t\t-ms-transform: rotate(90deg);\n\t\t-webkit-transform: rotate(90deg);\n\t\tbackground-color: fadeout(@ui-background-color, 15%);\n\t\t*/\n}\n.tl-timenav .tl-attribution a {\n color: #cccccc;\n}\n.tl-timenav .tl-attribution a:hover {\n color: #000;\n text-decoration: none;\n}\n.tl-timenav .tl-attribution a:hover .tl-knightlab-logo {\n background-color: #c34528;\n}\n.tl-timenav .tl-attribution .tl-knightlab-logo {\n display: inline-block;\n vertical-align: middle;\n height: 8px;\n width: 8px;\n margin-right: 3px;\n background-color: #c34528;\n background-color: #cccccc;\n transform: rotate(45deg);\n -ms-transform: rotate(45deg);\n -webkit-transform: rotate(45deg);\n}\n.tl-timenav .tl-timenav-line {\n position: absolute;\n top: 0;\n left: 50%;\n width: 1px;\n height: 100%;\n background-color: #d9d9d9;\n z-index: 2;\n display: none;\n}\n.tl-timenav .tl-timenav-line:before,\n.tl-timenav .tl-timenav-line:after {\n font-family: 'tl-icons';\n speak: none;\n font-style: normal;\n font-weight: normal;\n font-variant: normal;\n text-transform: none;\n line-height: 1;\n /* Better Font Rendering =========== */\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n color: #c34528;\n font-size: 32px;\n line-height: 32px;\n position: absolute;\n left: -14px;\n}\n.tl-timenav .tl-timenav-line:before {\n top: -10px;\n}\n.tl-timenav .tl-timenav-line:after {\n content: \"\\e648\";\n bottom: 24px;\n}\n.tl-timenav .tl-timenav-slider {\n position: absolute;\n height: 100%;\n width: 100%;\n top: 0;\n}\n.tl-timenav .tl-timenav-slider.tl-timenav-slider-animate {\n -webkit-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n}\n.tl-timenav .tl-timenav-slider .tl-timenav-slider-background {\n position: absolute;\n height: 100%;\n width: 100%;\n cursor: move;\n z-index: 6;\n}\n.tl-timenav .tl-timenav-slider .tl-timenav-container-mask {\n position: absolute;\n height: 100%;\n top: 0;\n}\n.tl-timenav .tl-timenav-slider .tl-timenav-container-mask .tl-timenav-container {\n position: absolute;\n height: 100%;\n}\n.tl-timenav .tl-timenav-slider .tl-timenav-container-mask .tl-timenav-container .tl-timenav-item-container {\n position: absolute;\n height: 100%;\n}\n/* Skinny\n================================================== */\n/* Mobile, iPhone\n================================================== */\n/* Mobile, iPhone and skinny\n================================================== */\n/* TL.TimeMarker\n================================================== */\n.tl-timemarker {\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n cursor: pointer;\n /* Animate Left Width and Top\n\t================================================== */\n -webkit-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n /* Timespan\n\t================================================== */\n /* Lines\n\t================================================== */\n /* Content\n\t================================================== */\n /* Hover State\n\t================================================== */\n /* Hover Active State\n\t================================================== */\n /* Active Markers\n\t================================================== */\n /* Markers with End Dates\n\t================================================== */\n /* Markers with End Dates and Hover\n\t================================================== */\n /* Markers with End Dates and Active\n\t================================================== */\n /* Markers with End Dates and Active and Hover\n\t================================================== */\n}\n.tl-timemarker.tl-timemarker-fast {\n -webkit-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1);\n transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1);\n -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n}\n.tl-timemarker.tl-timemarker-fast .tl-timemarker-content-container {\n -webkit-transition: width 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition: width 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition: width 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1);\n transition: width 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1);\n}\n.tl-timemarker.tl-timemarker-fast .tl-timemarker-timespan {\n -webkit-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1);\n transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1);\n}\n.tl-timemarker .tl-timemarker-timespan {\n pointer-events: none;\n position: absolute;\n margin: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(229, 229, 229, 0.15);\n border-top-right-radius: 4px;\n border-top-left-radius: 4px;\n -webkit-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n}\n.tl-timemarker .tl-timemarker-timespan .tl-timemarker-timespan-content {\n display: none;\n position: absolute;\n width: 100%;\n background-color: #e5e5e5;\n border-top-left-radius: 4px;\n border-top-right-radius: 4px;\n height: 100px;\n box-sizing: border-box;\n}\n.tl-timemarker .tl-timemarker-line-right {\n display: none;\n right: 0px;\n}\n.tl-timemarker .tl-timemarker-line-left {\n width: 1px;\n left: 0px;\n}\n.tl-timemarker .tl-timemarker-line-left,\n.tl-timemarker .tl-timemarker-line-right {\n margin-top: 7px;\n -webkit-box-sizing: border-box;\n /* Safari/Chrome, other WebKit */\n -moz-box-sizing: border-box;\n /* Firefox, other Gecko */\n box-sizing: border-box;\n border-left: 1px solid #d9d9d9;\n z-index: 5;\n content: \" \";\n position: absolute;\n height: 100%;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -khtml-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n box-shadow: 1px 1px 1px #FFF;\n}\n.tl-timemarker .tl-timemarker-line-left:after,\n.tl-timemarker .tl-timemarker-line-right:after {\n display: block;\n content: \" \";\n position: absolute;\n left: -4px;\n bottom: 0px;\n height: 6px;\n width: 6px;\n background-color: #919191;\n z-index: 8;\n -webkit-border-radius: 50%;\n -moz-border-radius: 50%;\n border-radius: 50%;\n}\n.tl-timemarker .tl-timemarker-content-container {\n position: absolute;\n background-color: #e5e5e5;\n border: 0;\n border-top-left-radius: 4px;\n border-top-right-radius: 4px;\n border-bottom-right-radius: 4px;\n height: 100%;\n width: 100px;\n overflow: hidden;\n z-index: 6;\n -webkit-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n box-sizing: border-box;\n border: 1px solid #d9d9d9;\n box-shadow: 1px 1px 1px #FFF;\n}\n.tl-timemarker .tl-timemarker-content-container:hover {\n z-index: 9;\n}\n.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content {\n position: relative;\n overflow: hidden;\n height: 100%;\n z-index: 8;\n padding: 5px;\n -webkit-box-sizing: border-box;\n /* Safari/Chrome, other WebKit */\n -moz-box-sizing: border-box;\n /* Firefox, other Gecko */\n box-sizing: border-box;\n}\n.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text {\n overflow: hidden;\n position: relative;\n}\n.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline,\n.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline p {\n display: -webkit-box;\n line-clamp: 2;\n -webkit-line-clamp: 2;\n box-orient: vertical;\n -webkit-box-orient: vertical;\n text-overflow: ellipsis;\n font-size: 12px;\n line-height: 12px;\n height: 100%;\n overflow: hidden;\n font-weight: normal;\n margin: 0;\n color: #bfbfbf;\n position: relative;\n}\n.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline.tl-headline-fadeout:after,\n.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline p.tl-headline-fadeout:after {\n content: \"\";\n text-align: right;\n position: absolute;\n bottom: 0;\n right: 0;\n width: 100%;\n height: 50%;\n background: -moz-linear-gradient(top, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%);\n /* FF3.6+ */\n background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(229, 229, 229, 0)), color-stop(50%, #e5e5e5));\n /* Chrome,Safari4+ */\n background: -webkit-linear-gradient(top, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%);\n /* Chrome10+,Safari5.1+ */\n background: -o-linear-gradient(top, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%);\n /* Opera 11.10+ */\n background: -ms-linear-gradient(top, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%);\n /* IE10+ */\n background: linear-gradient(to bottom, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%);\n /* W3C */\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@thecolor', endColorstr='@thecolor', GradientType=0);\n /* IE6-9 */\n}\n.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container {\n float: left;\n max-width: 24px;\n max-height: 24px;\n overflow: hidden;\n margin-right: 5px;\n height: 100%;\n -webkit-box-sizing: border-box;\n /* Safari/Chrome, other WebKit */\n -moz-box-sizing: border-box;\n /* Firefox, other Gecko */\n box-sizing: border-box;\n}\n.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container .tl-timemarker-media {\n max-width: 24px;\n max-height: 100%;\n opacity: 0.25;\n}\n.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class^=\"tl-icon-\"],\n.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class*=\" tl-icon-\"] {\n display: block;\n font-size: 24px;\n color: #bfbfbf;\n margin-top: 0px;\n}\n.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container .tl-icon-wikipedia {\n font-size: 16px;\n}\n.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content.tl-timemarker-content-small .tl-timemarker-text h2.tl-headline {\n display: block;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\n.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content.tl-timemarker-content-small .tl-timemarker-media-container [class^=\"tl-icon-\"],\n.tl-timemarker .tl-timemarker-content-container .tl-timemarker-content.tl-timemarker-content-small .tl-timemarker-media-container [class*=\" tl-icon-\"] {\n font-size: 12px;\n}\n.tl-timemarker:hover .tl-timemarker-timespan {\n background-color: rgba(191, 191, 191, 0.15);\n}\n.tl-timemarker:hover .tl-timemarker-timespan .tl-timemarker-timespan-content {\n background-color: #bfbfbf;\n}\n.tl-timemarker:hover .tl-timemarker-timespan .tl-timemarker-line-left,\n.tl-timemarker:hover .tl-timemarker-timespan .tl-timemarker-line-right {\n border-color: #a6a6a6;\n}\n.tl-timemarker:hover .tl-timemarker-timespan .tl-timemarker-line-left:after,\n.tl-timemarker:hover .tl-timemarker-timespan .tl-timemarker-line-right:after {\n background-color: #3d3d3d;\n}\n.tl-timemarker:hover .tl-timemarker-content-container {\n background-color: #bfbfbf;\n border-color: #a6a6a6;\n -webkit-transition: height 250ms cubic-bezier(0.77, 0, 0.175, 1), width 250ms cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition: height 250ms cubic-bezier(0.77, 0, 0.175, 1), width 250ms cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition: height 250ms cubic-bezier(0.77, 0, 0.175, 1), width 250ms cubic-bezier(0.77, 0, 0.175, 1);\n transition: height 250ms cubic-bezier(0.77, 0, 0.175, 1), width 250ms cubic-bezier(0.77, 0, 0.175, 1);\n}\n.tl-timemarker:hover .tl-timemarker-content-container.tl-timemarker-content-container-small {\n width: 200px;\n}\n.tl-timemarker:hover .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline {\n color: #FFF;\n}\n.tl-timemarker:hover .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline.tl-headline-fadeout:after {\n background: -moz-linear-gradient(top, rgba(191, 191, 191, 0) 0%, #bfbfbf 80%);\n /* FF3.6+ */\n background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(191, 191, 191, 0)), color-stop(80%, #bfbfbf));\n /* Chrome,Safari4+ */\n background: -webkit-linear-gradient(top, rgba(191, 191, 191, 0) 0%, #bfbfbf 80%);\n /* Chrome10+,Safari5.1+ */\n background: -o-linear-gradient(top, rgba(191, 191, 191, 0) 0%, #bfbfbf 80%);\n /* Opera 11.10+ */\n background: -ms-linear-gradient(top, rgba(191, 191, 191, 0) 0%, #bfbfbf 80%);\n /* IE10+ */\n background: linear-gradient(to bottom, rgba(191, 191, 191, 0) 0%, #bfbfbf 80%);\n /* W3C */\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@thecolor', endColorstr='@thecolor', GradientType=0);\n /* IE6-9 */\n}\n.tl-timemarker:hover .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container .tl-timemarker-media {\n opacity: 1;\n}\n.tl-timemarker:hover .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class^=\"tl-icon-\"],\n.tl-timemarker:hover .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class*=\" tl-icon-\"] {\n color: #FFF;\n}\n.tl-timemarker:hover.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline.tl-headline-fadeout:after {\n background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFF 80%);\n /* FF3.6+ */\n background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(80%, #FFF));\n /* Chrome,Safari4+ */\n background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFF 80%);\n /* Chrome10+,Safari5.1+ */\n background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFF 80%);\n /* Opera 11.10+ */\n background: -ms-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFF 80%);\n /* IE10+ */\n background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #FFF 80%);\n /* W3C */\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@thecolor', endColorstr='@thecolor', GradientType=0);\n /* IE6-9 */\n}\n.tl-timemarker:hover.tl-timemarker-active .tl-timemarker-line-left,\n.tl-timemarker:hover.tl-timemarker-active .tl-timemarker-line-right {\n border-color: #000;\n}\n.tl-timemarker:hover.tl-timemarker-active .tl-timemarker-line-left:after,\n.tl-timemarker:hover.tl-timemarker-active .tl-timemarker-line-right:after {\n background-color: #000;\n}\n.tl-timemarker.tl-timemarker-active .tl-timemarker-timespan {\n background-color: rgba(255, 255, 255, 0.5);\n z-index: 8;\n}\n.tl-timemarker.tl-timemarker-active .tl-timemarker-timespan .tl-timemarker-timespan-content {\n background-color: #333;\n}\n.tl-timemarker.tl-timemarker-active .tl-timemarker-line-left,\n.tl-timemarker.tl-timemarker-active .tl-timemarker-line-right {\n border-color: rgba(51, 51, 51, 0.5);\n border-width: 1px;\n z-index: 8;\n box-shadow: 0px 1px 3px rgba(145, 145, 145, 0.5);\n}\n.tl-timemarker.tl-timemarker-active .tl-timemarker-line-left:after,\n.tl-timemarker.tl-timemarker-active .tl-timemarker-line-right:after {\n background-color: #333;\n}\n.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container {\n background-color: #FFF;\n color: #333;\n z-index: 9;\n border-color: rgba(51, 51, 51, 0.5);\n box-shadow: 1px 1px 3px rgba(145, 145, 145, 0.5);\n}\n.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline {\n color: #333;\n}\n.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-text h2.tl-headline.tl-headline-fadeout:after {\n background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFF 80%);\n /* FF3.6+ */\n background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(80%, #FFF));\n /* Chrome,Safari4+ */\n background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFF 80%);\n /* Chrome10+,Safari5.1+ */\n background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFF 80%);\n /* Opera 11.10+ */\n background: -ms-linear-gradient(top, rgba(255, 255, 255, 0) 0%, #FFF 80%);\n /* IE10+ */\n background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #FFF 80%);\n /* W3C */\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@thecolor', endColorstr='@thecolor', GradientType=0);\n /* IE6-9 */\n}\n.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container .tl-timemarker-media {\n opacity: 1;\n}\n.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class^=\"tl-icon-\"],\n.tl-timemarker.tl-timemarker-active .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container [class*=\" tl-icon-\"] {\n color: #333;\n}\n.tl-timemarker.tl-timemarker-with-end .tl-timemarker-timespan .tl-timemarker-timespan-content {\n display: block;\n}\n.tl-timemarker.tl-timemarker-with-end .tl-timemarker-timespan .tl-timemarker-line-left,\n.tl-timemarker.tl-timemarker-with-end .tl-timemarker-timespan .tl-timemarker-line-right {\n z-index: 5;\n}\n.tl-timemarker.tl-timemarker-with-end .tl-timemarker-timespan:after {\n display: block;\n content: \" \";\n position: absolute;\n left: 0px;\n bottom: -7px;\n height: 6px;\n width: 100%;\n background-color: rgba(115, 115, 115, 0.15);\n z-index: 6;\n -webkit-border-radius: 7px;\n -moz-border-radius: 7px;\n border-radius: 7px;\n}\n.tl-timemarker.tl-timemarker-with-end .tl-timemarker-content-container.tl-timemarker-content-container-long {\n box-shadow: none;\n}\n.tl-timemarker.tl-timemarker-with-end .tl-timemarker-line-right {\n display: block;\n}\n.tl-timemarker.tl-timemarker-with-end .tl-timemarker-line-left {\n box-shadow: none;\n}\n.tl-timemarker.tl-timemarker-with-end:hover .tl-timemarker-timespan:after {\n background-color: rgba(0, 0, 0, 0.25);\n}\n.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-timespan:after {\n background-color: rgba(51, 51, 51, 0.5);\n}\n.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-line-left,\n.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-line-right {\n border-width: 1px;\n}\n.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-line-left:after,\n.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-line-right:after {\n background-color: #333 !important;\n}\n.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active .tl-timemarker-line-left {\n box-shadow: none;\n}\n.tl-timemarker.tl-timemarker-with-end.tl-timemarker-active:hover .tl-timemarker-timespan:after {\n background-color: rgba(51, 51, 51, 0.5);\n}\n/* Skinny\n================================================== */\n/* Mobile, iPhone\n================================================== */\n/* Mobile, iPhone and skinny\n================================================== */\n/* TL.TimeMarker\n================================================== */\n.tl-timeera {\n height: 100%;\n height: 40px;\n position: absolute;\n bottom: 0;\n left: 0;\n pointer-events: none;\n z-index: 3;\n /* Animate Left Width and Top\n\t================================================== */\n -webkit-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n /* Timespan\n\t================================================== */\n /* Content\n\t================================================== */\n}\n.tl-timeera.tl-timeera-fast {\n -webkit-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1);\n transition: top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 500ms cubic-bezier(0.77, 0, 0.175, 1);\n -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n}\n.tl-timeera .tl-timeera-background {\n position: absolute;\n background-color: #28a6c3;\n width: 100%;\n height: 100%;\n opacity: 1;\n}\n.tl-timeera.tl-timeera-color0 .tl-timeera-background {\n background-color: #c34528;\n}\n.tl-timeera.tl-timeera-color1 .tl-timeera-background {\n background-color: #28a6c3;\n}\n.tl-timeera.tl-timeera-color2 .tl-timeera-background {\n background-color: #2832c3;\n}\n.tl-timeera.tl-timeera-color3 .tl-timeera-background {\n background-color: #28c36c;\n}\n.tl-timeera.tl-timeera-color4 .tl-timeera-background {\n background-color: #286dc3;\n}\n.tl-timeera.tl-timeera-color5 .tl-timeera-background {\n background-color: #28c3a7;\n}\n.tl-timeera .tl-timeera-content-container {\n position: absolute;\n border: 0;\n border-top-left-radius: 4px;\n border-top-right-radius: 4px;\n border-bottom-right-radius: 4px;\n height: 100%;\n width: 100px;\n overflow: hidden;\n -webkit-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n transition: height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n box-sizing: border-box;\n border: 1px solid #d9d9d9;\n}\n.tl-timeera .tl-timeera-content-container .tl-timeera-content {\n position: relative;\n overflow: hidden;\n height: 100%;\n padding: 5px;\n -webkit-box-sizing: border-box;\n /* Safari/Chrome, other WebKit */\n -moz-box-sizing: border-box;\n /* Firefox, other Gecko */\n box-sizing: border-box;\n}\n.tl-timeera .tl-timeera-content-container .tl-timeera-content .tl-timeera-text {\n overflow: hidden;\n position: relative;\n height: 100%;\n}\n.tl-timeera .tl-timeera-content-container .tl-timeera-content .tl-timeera-text h2.tl-headline {\n bottom: 0px;\n position: absolute;\n display: -webkit-box;\n line-clamp: 4;\n -webkit-line-clamp: 4;\n box-orient: vertical;\n -webkit-box-orient: vertical;\n text-overflow: ellipsis;\n font-size: 10px;\n line-height: 10px;\n overflow: hidden;\n font-weight: normal;\n margin: 0;\n color: #FFF;\n margin-left: 10px;\n}\n.tl-timeera .tl-timeera-content-container .tl-timeera-content .tl-timeera-text h2.tl-headline.tl-headline-fadeout:after {\n content: \"\";\n text-align: right;\n position: absolute;\n bottom: 0;\n right: 0;\n width: 100%;\n height: 50%;\n background: -moz-linear-gradient(top, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%);\n /* FF3.6+ */\n background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(229, 229, 229, 0)), color-stop(50%, #e5e5e5));\n /* Chrome,Safari4+ */\n background: -webkit-linear-gradient(top, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%);\n /* Chrome10+,Safari5.1+ */\n background: -o-linear-gradient(top, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%);\n /* Opera 11.10+ */\n background: -ms-linear-gradient(top, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%);\n /* IE10+ */\n background: linear-gradient(to bottom, rgba(229, 229, 229, 0) 0%, #e5e5e5 50%);\n /* W3C */\n filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@thecolor', endColorstr='@thecolor', GradientType=0);\n /* IE6-9 */\n}\n/* Skinny\n================================================== */\n/* Mobile, iPhone\n================================================== */\n/* Mobile, iPhone and skinny\n================================================== */\n/* TL.TimeMarker\n================================================== */\n.tl-timegroup {\n width: 100%;\n position: absolute;\n top: 0;\n left: 0;\n background-color: #f2f2f2;\n display: -ms-flexbox;\n display: -webkit-flex;\n display: flex;\n align-items: center;\n -ms-flex-align: center;\n -webkit-align-items: center;\n -webkit-box-align: center;\n /* Animate Left Width and Top\n\t================================================== */\n -webkit-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n transition: left 1000ms cubic-bezier(0.77, 0, 0.175, 1), top 500ms cubic-bezier(0.77, 0, 0.175, 1), height 500ms cubic-bezier(0.77, 0, 0.175, 1), width 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n}\n.tl-timegroup .tl-timegroup-message {\n color: #e0e0e0;\n text-shadow: #FFF 0px 2px 2px;\n margin-left: 80px;\n}\n.tl-timegroup.tl-timegroup-alternate {\n background-color: #fafafa;\n}\n.tl-timegroup.tl-timegroup-hidden {\n display: none;\n}\n/* Skinny\n================================================== */\n/* Mobile, iPhone\n================================================== */\n/* Mobile, iPhone and skinny\n================================================== */\n/* TL.TimeAxis\n================================================== */\n.tl-timeaxis-background {\n height: 39px;\n width: 100%;\n position: absolute;\n bottom: 0;\n left: 0;\n background-color: #FFF;\n border-top: 1px solid #e5e5e5;\n z-index: 2;\n}\n.tl-timeaxis {\n height: 39px;\n width: 100%;\n position: absolute;\n bottom: 0;\n left: 0;\n z-index: 3;\n}\n.tl-timeaxis .tl-timeaxis-content-container {\n position: relative;\n bottom: 0;\n height: 39px;\n}\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major,\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor {\n opacity: 0;\n position: absolute;\n}\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major .tl-timeaxis-tick,\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick {\n position: absolute;\n display: block;\n top: 0;\n left: 0;\n text-align: center;\n font-weight: normal;\n}\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major .tl-timeaxis-tick .tl-timeaxis-tick-text,\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick .tl-timeaxis-tick-text {\n display: inline-block;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major .tl-timeaxis-tick:before,\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick:before {\n content: \"|\";\n display: block;\n color: #FFF;\n width: 1px;\n overflow: hidden;\n border-left: 1px solid #bfbfbf;\n text-align: center;\n}\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major.tl-timeaxis-animate .tl-timeaxis-tick,\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor.tl-timeaxis-animate .tl-timeaxis-tick {\n -webkit-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n}\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major.tl-timeaxis-animate-opacity .tl-timeaxis-tick,\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor.tl-timeaxis-animate-opacity .tl-timeaxis-tick {\n -webkit-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n}\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major {\n z-index: 1;\n background-color: #FFF;\n}\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major .tl-timeaxis-tick {\n font-size: 12px;\n line-height: 14px;\n color: #737373;\n width: 100px;\n margin-left: -50px;\n}\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-major .tl-timeaxis-tick:before {\n border-color: #a6a6a6;\n font-size: 18px;\n line-height: 18px;\n margin-bottom: 2px;\n margin-left: 50px;\n}\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick {\n font-size: 11px;\n line-height: 13px;\n color: #bfbfbf;\n width: 50px;\n margin-left: -25px;\n}\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick .tl-timeaxis-tick-text {\n opacity: 0;\n white-space: normal;\n padding-left: 2px;\n padding-right: 2px;\n}\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick .tl-timeaxis-tick-text span {\n display: block;\n font-size: 9px;\n line-height: 9px;\n margin-top: -2px;\n color: #e6e6e6;\n}\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick:before {\n font-size: 9px;\n line-height: 9px;\n margin-left: 25px;\n}\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick.tl-timeaxis-tick-hidden .tl-timeaxis-tick-text {\n opacity: 0 !important;\n}\n.tl-timeaxis .tl-timeaxis-content-container .tl-timeaxis-minor .tl-timeaxis-tick.tl-timeaxis-tick-hidden:before {\n opacity: 0.33;\n}\n/* Skinny\n================================================== */\n/* Mobile, iPhone\n================================================== */\n/* Mobile, iPhone and skinny\n================================================== */\n.tlanimate {\n -webkit-transform: translateZ(0);\n -webkit-perspective: 1000;\n -webkit-backface-visibility: hidden;\n}\n.tl-animate {\n -webkit-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n}\n.tl-animate-opacity {\n -webkit-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n transition: opacity 1000ms cubic-bezier(0.77, 0, 0.175, 1);\n -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);\n}\n/* SLIDE\n================================================== */\n.tl-slide {\n position: absolute;\n width: 100%;\n height: 100%;\n padding: 0px;\n margin: 0px;\n overflow-x: hidden;\n overflow-y: auto;\n}\n.tl-slide .tl-slide-background {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n z-index: -1;\n overflow: hidden;\n display: none;\n filter: alpha(opacity=50);\n -khtml-opacity: 0.5;\n -moz-opacity: 0.5;\n opacity: 0.5;\n background: no-repeat center center;\n -webkit-background-size: cover;\n -moz-background-size: cover;\n -o-background-size: cover;\n background-size: cover;\n}\n.tl-slide .tl-slide-scrollable-container {\n display: table;\n table-layout: fixed;\n height: 100%;\n z-index: 1;\n}\n.tl-slide .tl-slide-content-container {\n display: table-cell;\n vertical-align: middle;\n position: relative;\n width: 100%;\n height: 100%;\n z-index: 3;\n}\n.tl-slide .tl-slide-content-container .tl-slide-content {\n display: table;\n vertical-align: middle;\n padding-left: 100px;\n padding-right: 100px;\n position: relative;\n max-width: 100%;\n user-select: text;\n}\n.tl-slide .tl-slide-content-container .tl-slide-content .tl-media {\n position: relative;\n width: 100%;\n min-width: 50%;\n float: left;\n margin-top: auto;\n margin-bottom: auto;\n}\n.tl-slide .tl-slide-content-container .tl-slide-content .tl-text {\n width: 50%;\n max-width: 50%;\n min-width: 120px;\n padding: 0 20px 0 20px;\n display: table-cell;\n vertical-align: middle;\n text-align: left;\n}\n/* Only Media (no text)\n================================================== */\n.tl-slide-media-only .tl-slide-content-container .tl-slide-content {\n text-align: center;\n}\n.tl-slide-media-only .tl-slide-content-container .tl-slide-content .tl-media {\n text-align: center;\n position: relative;\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n float: none;\n margin-top: auto;\n margin-bottom: auto;\n}\n.tl-slide-media-only .tl-slide-content-container .tl-slide-content .tl-text {\n width: 100%;\n max-width: 100%;\n display: block;\n margin-left: auto;\n margin-right: auto;\n text-align: center;\n}\n/* Only Text (no media)\n================================================== */\n.tl-slide-text-only .tl-slide-content-container .tl-slide-content {\n text-align: center;\n}\n.tl-slide-text-only .tl-slide-content-container .tl-slide-content .tl-text {\n max-width: 80%;\n width: 80%;\n display: block;\n margin-left: auto;\n margin-right: auto;\n}\n/* Background\n================================================== */\n.tl-slide.tl-full-image-background,\n.tl-slide.tl-full-color-background {\n color: #FFF !important;\n text-shadow: 1px 1px 1px #000 !important;\n}\n.tl-slide.tl-full-image-background p,\n.tl-slide.tl-full-color-background p,\n.tl-slide.tl-full-image-background h1,\n.tl-slide.tl-full-color-background h1,\n.tl-slide.tl-full-image-background h2,\n.tl-slide.tl-full-color-background h2,\n.tl-slide.tl-full-image-background h3,\n.tl-slide.tl-full-color-background h3,\n.tl-slide.tl-full-image-background h4,\n.tl-slide.tl-full-color-background h4,\n.tl-slide.tl-full-image-background h5,\n.tl-slide.tl-full-color-background h5,\n.tl-slide.tl-full-image-background h6,\n.tl-slide.tl-full-color-background h6 {\n color: #FFF !important;\n text-shadow: 1px 1px 1px #000 !important;\n}\n.tl-slide.tl-full-image-background a,\n.tl-slide.tl-full-color-background a,\n.tl-slide.tl-full-image-background b,\n.tl-slide.tl-full-color-background b,\n.tl-slide.tl-full-image-background i,\n.tl-slide.tl-full-color-background i,\n.tl-slide.tl-full-image-background blockquote,\n.tl-slide.tl-full-color-background blockquote,\n.tl-slide.tl-full-image-background blockquote p,\n.tl-slide.tl-full-color-background blockquote p {\n text-shadow: 1px 1px 1px #000;\n color: #ffffff;\n}\n.tl-slide.tl-full-image-background a:hover,\n.tl-slide.tl-full-color-background a:hover {\n text-decoration: underline;\n color: #c34528;\n}\n.tl-slide.tl-full-image-background .tl-caption,\n.tl-slide.tl-full-color-background .tl-caption,\n.tl-slide.tl-full-image-background .tl-credit,\n.tl-slide.tl-full-color-background .tl-credit {\n color: #FFF !important;\n text-shadow: 1px 1px 1px #000 !important;\n}\n.tl-slide.tl-full-image-background .tl-media-twitter blockquote,\n.tl-slide.tl-full-color-background .tl-media-twitter blockquote,\n.tl-slide.tl-full-image-background .tl-media-blockquote blockquote,\n.tl-slide.tl-full-color-background .tl-media-blockquote blockquote {\n color: #FFF !important;\n text-shadow: 1px 1px 1px #000 !important;\n}\n.tl-slide.tl-full-image-background .tl-media-twitter blockquote p,\n.tl-slide.tl-full-color-background .tl-media-twitter blockquote p,\n.tl-slide.tl-full-image-background .tl-media-blockquote blockquote p,\n.tl-slide.tl-full-color-background .tl-media-blockquote blockquote p {\n color: #FFF !important;\n text-shadow: 1px 1px 1px #000 !important;\n}\n.tl-slide.tl-full-image-background .vcard a,\n.tl-slide.tl-full-color-background .vcard a,\n.tl-slide.tl-full-image-background .vcard .nickname,\n.tl-slide.tl-full-color-background .vcard .nickname {\n color: #FFF !important;\n text-shadow: 1px 1px 1px #000 !important;\n}\n/* Full Image Background\n================================================== */\n.tl-slide.tl-full-image-background {\n background: no-repeat center center;\n -webkit-background-size: cover;\n -moz-background-size: cover;\n -o-background-size: cover;\n background-size: cover;\n background-position: center 25%;\n text-shadow: 1px 1px 2px #000;\n}\n.tl-slide.tl-full-image-background p,\n.tl-slide.tl-full-image-background h1,\n.tl-slide.tl-full-image-background h2,\n.tl-slide.tl-full-image-background h3,\n.tl-slide.tl-full-image-background h4,\n.tl-slide.tl-full-image-background h5,\n.tl-slide.tl-full-image-background h6 {\n text-shadow: 1px 1px 2px #000;\n}\n.tl-slide.tl-full-image-background .tl-caption,\n.tl-slide.tl-full-image-background .tl-credit {\n text-shadow: 1px 1px 2px #000;\n}\n.tl-slide.tl-full-image-background .tl-media-twitter blockquote,\n.tl-slide.tl-full-image-background .tl-media-blockquote blockquote {\n text-shadow: 1px 1px 2px #000 !important;\n}\n.tl-slide.tl-full-image-background .tl-media-twitter blockquote p,\n.tl-slide.tl-full-image-background .tl-media-blockquote blockquote p {\n text-shadow: 1px 1px 2px #000 !important;\n}\n/* Color Background\n================================================== */\n/* Text Background\n================================================== */\n.tl-slide.tl-text-background .tl-text .tl-text-content-container {\n padding: 20px;\n /* Fallback for web browsers that doesn't support RGBa */\n background: #000000 transparent;\n /* RGBa with 0.6 opacity */\n background: rgba(0, 0, 0, 0.6);\n -webkit-border-radius: 7px;\n -moz-border-radius: 7px;\n border-radius: 7px;\n}\n.tl-slide.tl-text-background .tl-text .tl-text-content-container h2 {\n margin-top: 5px;\n}\n/* Skinny\n================================================== */\n.tl-skinny .tl-slide {\n display: block;\n padding-top: 10px;\n}\n.tl-skinny .tl-slide .tl-slide-content-container {\n display: block;\n position: static;\n height: auto;\n height: 100%;\n display: -webkit-flex;\n /* Safari */\n display: flex;\n align-items: center;\n -webkit-align-items: center;\n /* Safari 7.0+ */\n}\n.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content {\n display: block;\n display: -webkit-flex;\n /* Safari */\n display: flex;\n flex-direction: column-reverse;\n -webkit-flex-direction: column-reverse;\n /* Safari */\n position: static;\n height: auto;\n padding-left: 50px;\n padding-right: 50px;\n}\n.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media {\n position: static;\n width: 100%;\n height: auto;\n float: none;\n display: block;\n padding-top: 20px;\n border-top: 1px solid #e6e6e6;\n}\n.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-text {\n display: block;\n height: auto;\n vertical-align: initial;\n position: static;\n width: 100%;\n max-width: 100%;\n min-width: 0;\n float: none;\n padding: 0;\n}\n.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-text .tl-text-content-container {\n padding-left: 10px;\n padding-right: 10px;\n padding-bottom: 10px;\n}\n.tl-skinny .tl-slide.tl-slide.tl-full-color-background .tl-slide-content-container .tl-slide-content .tl-media,\n.tl-skinny .tl-slide.tl-full-image-background .tl-slide-content-container .tl-slide-content .tl-media {\n border-color: rgba(230, 230, 230, 0.25);\n}\n.tl-skinny .tl-slide.tl-slide-media-only .tl-slide-content-container .tl-slide-content {\n flex-direction: column;\n -webkit-flex-direction: column;\n /* Safari */\n}\n.tl-skinny .tl-slide.tl-slide-media-only .tl-slide-content-container .tl-slide-content .tl-media {\n border-top: none;\n padding-top: 0px;\n}\n/* Mobile, iPhone\n================================================== */\n/* Mobile, iPhone and skinny\n================================================== */\n.tl-mobile.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media img,\n.tl-mobile.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media embed,\n.tl-mobile.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media object,\n.tl-mobile.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media video,\n.tl-mobile.tl-skinny .tl-slide .tl-slide-content-container .tl-slide-content .tl-media iframe {\n max-height: 175px;\n}\n/* SlideNav\n================================================== */\n/* NAVIGATION\n================================================== */\n.tl-slidenav-previous,\n.tl-slidenav-next {\n position: absolute;\n top: 45%;\n z-index: 10;\n cursor: pointer;\n}\n.tl-slidenav-previous .tl-slidenav-content-container,\n.tl-slidenav-next .tl-slidenav-content-container {\n height: 200px;\n width: 100px;\n position: absolute;\n}\n.tl-slidenav-previous .tl-slidenav-title,\n.tl-slidenav-next .tl-slidenav-title,\n.tl-slidenav-previous .tl-slidenav-description,\n.tl-slidenav-next .tl-slidenav-description {\n width: 80px;\n -webkit-line-clamp: 2;\n line-clamp: 2;\n text-overflow: ellipsis;\n /* Non standard for webkit */\n /*\n\t -webkit-hyphens: auto;\n\t -moz-hyphens: auto;\n\t -ms-hyphens: auto;\n\t hyphens: auto;\n\t\t*/\n filter: alpha(opacity=15);\n -khtml-opacity: 0.15;\n -moz-opacity: 0.15;\n opacity: 0.15;\n}\n.tl-slidenav-previous .tl-slidenav-title small,\n.tl-slidenav-next .tl-slidenav-title small,\n.tl-slidenav-previous .tl-slidenav-description small,\n.tl-slidenav-next .tl-slidenav-description small {\n display: block;\n}\n.tl-slidenav-previous .tl-slidenav-title,\n.tl-slidenav-next .tl-slidenav-title {\n margin-top: 10px;\n font-size: 11px;\n line-height: 11px;\n}\n.tl-slidenav-previous .tl-slidenav-description,\n.tl-slidenav-next .tl-slidenav-description {\n font-size: 11px;\n margin-top: 5px;\n filter: alpha(opacity=0);\n -khtml-opacity: 0;\n -moz-opacity: 0;\n opacity: 0;\n}\n.tl-slidenav-previous .tl-slidenav-description small,\n.tl-slidenav-next .tl-slidenav-description small {\n display: none;\n}\n/* NAVIGATION COLOR\n================================================== */\n.tl-slidenav-previous .tl-slidenav-content-container .tl-slidenav-icon,\n.tl-slidenav-next .tl-slidenav-content-container .tl-slidenav-icon,\n.tl-slidenav-previous .tl-slidenav-content-container .tl-slidenav-title,\n.tl-slidenav-next .tl-slidenav-content-container .tl-slidenav-title,\n.tl-slidenav-previous .tl-slidenav-content-container .tl-slidenav-description,\n.tl-slidenav-next .tl-slidenav-content-container .tl-slidenav-description {\n text-shadow: 1px 1px 1px #FFF;\n color: #333;\n}\n.tl-slidenav-previous .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-icon,\n.tl-slidenav-next .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-icon,\n.tl-slidenav-previous .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-title,\n.tl-slidenav-next .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-title,\n.tl-slidenav-previous .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-description,\n.tl-slidenav-next .tl-slidenav-content-container.tl-slidenav-inverted .tl-slidenav-description {\n color: #f2f2f2;\n text-shadow: 1px 1px 1px #333;\n}\n/* ICONS\n================================================== */\n.tl-slidenav-next .tl-slidenav-icon,\n.tl-slidenav-previous .tl-slidenav-icon {\n font-family: 'tl-icons';\n speak: none;\n font-style: normal;\n font-weight: normal;\n font-variant: normal;\n text-transform: none;\n line-height: 1;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n font-size: 32px;\n margin-bottom: 5px;\n}\n.tl-slidenav-next {\n text-align: right;\n margin-right: 10px;\n right: 100px;\n}\n.tl-slidenav-next .tl-slidenav-title,\n.tl-slidenav-next .tl-slidenav-description {\n margin-left: 20px;\n}\n.tl-slidenav-next .tl-slidenav-icon {\n margin-left: 76px;\n}\n.tl-slidenav-next .tl-slidenav-icon:before {\n content: \"\\e64f\";\n}\n.tl-slidenav-previous {\n text-align: left;\n margin-left: 10px;\n}\n.tl-slidenav-previous .tl-slidenav-icon {\n margin-left: 0px;\n}\n.tl-slidenav-previous .tl-slidenav-icon:before {\n content: \"\\e650\";\n}\n/* NAVIGATION HOVER\n================================================== */\n.tl-slidenav-previous:hover .tl-slidenav-title,\n.tl-slidenav-next:hover .tl-slidenav-title {\n filter: alpha(opacity=100);\n -khtml-opacity: 1;\n -moz-opacity: 1;\n opacity: 1;\n}\n.tl-slidenav-previous:hover .tl-slidenav-description,\n.tl-slidenav-next:hover .tl-slidenav-description {\n filter: alpha(opacity=50);\n -khtml-opacity: 0.5;\n -moz-opacity: 0.5;\n opacity: 0.5;\n}\n.tl-slidenav-next:hover .tl-slidenav-icon {\n margin-left: 80px;\n}\n.tl-slidenav-previous:hover .tl-slidenav-icon {\n margin-left: -4px;\n}\n.tl-skinny .tl-slidenav-next {\n right: 32px;\n}\n.tl-skinny .tl-slidenav-next .tl-slidenav-icon {\n margin-left: 8px;\n}\n.tl-skinny .tl-slidenav-previous .tl-slidenav-content-container,\n.tl-skinny .tl-slidenav-next .tl-slidenav-content-container {\n width: 32px;\n height: 32px;\n}\n.tl-skinny .tl-slidenav-previous .tl-slidenav-title,\n.tl-skinny .tl-slidenav-next .tl-slidenav-title,\n.tl-skinny .tl-slidenav-previous .tl-slidenav-description,\n.tl-skinny .tl-slidenav-next .tl-slidenav-description {\n display: none;\n}\n.tl-skinny .tl-slidenav-previous .tl-slidenav-icon,\n.tl-skinny .tl-slidenav-next .tl-slidenav-icon {\n filter: alpha(opacity=33);\n -khtml-opacity: 0.33;\n -moz-opacity: 0.33;\n opacity: 0.33;\n}\n.tl-skinny .tl-slidenav-next:hover .tl-slidenav-icon {\n margin-left: 12px;\n filter: alpha(opacity=100);\n -khtml-opacity: 1;\n -moz-opacity: 1;\n opacity: 1;\n}\n.tl-skinny .tl-slidenav-previous:hover .tl-slidenav-icon {\n margin-left: -4px;\n filter: alpha(opacity=100);\n -khtml-opacity: 1;\n -moz-opacity: 1;\n opacity: 1;\n}\n.tl-layout-landscape.tl-mobile .tl-slidenav-next:hover {\n right: 70px;\n}\n.tl-layout-landscape.tl-mobile .tl-slidenav-next:hover .tl-slidenav-icon {\n margin-left: 8px;\n filter: alpha(opacity=100);\n -khtml-opacity: 1;\n -moz-opacity: 1;\n opacity: 1;\n}\n.tl-layout-landscape.tl-mobile .tl-slidenav-next:active .tl-slidenav-icon {\n margin-left: 0px;\n filter: alpha(opacity=100);\n -khtml-opacity: 1;\n -moz-opacity: 1;\n opacity: 1;\n}\n.tl-layout-landscape.tl-mobile .tl-slidenav-previous:hover .tl-slidenav-icon {\n margin-left: 80px;\n filter: alpha(opacity=100);\n -khtml-opacity: 1;\n -moz-opacity: 1;\n opacity: 1;\n}\n.tl-layout-landscape.tl-mobile .tl-slidenav-previous:active .tl-slidenav-icon {\n filter: alpha(opacity=100);\n -khtml-opacity: 1;\n -moz-opacity: 1;\n opacity: 1;\n margin-left: -4px;\n}\n.tl-layout-portrait.tl-mobile .tl-slidenav-next:hover .tl-slidenav-icon {\n filter: alpha(opacity=33);\n -khtml-opacity: 0.33;\n -moz-opacity: 0.33;\n opacity: 0.33;\n}\n.tl-layout-portrait.tl-mobile .tl-slidenav-next:active .tl-slidenav-icon {\n filter: alpha(opacity=100);\n -khtml-opacity: 1;\n -moz-opacity: 1;\n opacity: 1;\n}\n.tl-layout-portrait.tl-mobile .tl-slidenav-previous:hover .tl-slidenav-icon {\n filter: alpha(opacity=33);\n -khtml-opacity: 0.33;\n -moz-opacity: 0.33;\n opacity: 0.33;\n}\n.tl-layout-portrait.tl-mobile .tl-slidenav-previous:active .tl-slidenav-icon {\n filter: alpha(opacity=100);\n -khtml-opacity: 1;\n -moz-opacity: 1;\n opacity: 1;\n}\n.tl-mobile .tl-slidenav-previous,\n.tl-skinny.tl-mobile .tl-slidenav-previous,\n.tl-skinny.tl-layout-landscape.tl-mobile .tl-slidenav-previous,\n.tl-skinny.tl-layout-portrait.tl-mobile .tl-slidenav-previous,\n.tl-mobile .tl-slidenav-next,\n.tl-skinny.tl-mobile .tl-slidenav-next,\n.tl-skinny.tl-layout-landscape.tl-mobile .tl-slidenav-next,\n.tl-skinny.tl-layout-portrait.tl-mobile .tl-slidenav-next {\n display: none;\n}\n/* StorySlider\n================================================== */\n/* SLIDER CONTAINERS\n================================================== */\n.tl-storyslider {\n width: 100%;\n height: 100%;\n overflow: hidden;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n -o-user-select: none;\n user-select: none;\n position: relative;\n box-sizing: content-box;\n z-index: 8;\n}\n.tl-storyslider img,\n.tl-storyslider embed,\n.tl-storyslider object,\n.tl-storyslider video,\n.tl-storyslider iframe {\n max-width: 100%;\n position: relative;\n}\n.tl-storyslider .tl-slider-background {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 1;\n}\n.tl-storyslider .tl-slider-touch-mask {\n width: 100%;\n height: 100%;\n z-index: 25;\n top: 0px;\n left: 0px;\n position: absolute;\n}\n.tl-storyslider .tl-slider-container-mask {\n text-align: center;\n width: 100%;\n height: 100%;\n position: relative;\n z-index: 5;\n}\n.tl-storyslider .tl-slider-container-mask .tl-slider-container {\n position: absolute;\n top: 0px;\n left: 0px;\n width: 100%;\n height: 100%;\n text-align: center;\n}\n.tl-storyslider .tl-slider-container-mask .tl-slider-container .tl-slider-item-container {\n width: 100%;\n height: 100%;\n display: table-cell;\n vertical-align: middle;\n}\n/* Skinny\n================================================== */\n/* Mobile, iPhone\n================================================== */\n/* Mobile, iPhone and skinny\n================================================== */\n/* Requires Variables.less\n================================================== */\n.tl-media {\n width: 100%;\n min-width: 50%;\n height: 100%;\n float: left;\n margin-top: auto;\n margin-bottom: auto;\n position: relative;\n}\n.tl-media .tl-media-content-container.tl-media-content-container-text {\n border-right: 1px solid #e6e6e6;\n padding-right: 20px;\n}\n.tl-media .tl-media-content-container .tl-media-content {\n position: relative;\n *zoom: 1;\n}\n.tl-media .tl-media-content-container .tl-media-content:before,\n.tl-media .tl-media-content-container .tl-media-content:after {\n display: table;\n content: \"\";\n}\n.tl-media .tl-media-content-container .tl-media-content:after {\n clear: both;\n}\n.tl-media .tl-media-content-container .tl-media-content .tl-media-loaderror p {\n color: #f2f2f2;\n text-align: center;\n}\n.tl-media .tl-media-content-container .tl-media-content .tl-media-loaderror p span {\n color: #f2f2f2;\n}\n.tl-media .tl-media-content-container .tl-media-content .tl-media-loaderror [class^=\"tl-icon-\"],\n.tl-media .tl-media-content-container .tl-media-content .tl-media-loaderror [class*=\" tl-icon-\"] {\n font-size: 28px;\n color: #f2f2f2;\n text-align: center;\n}\n.tl-media .tl-media-content-container .tl-media-content img,\n.tl-media .tl-media-content-container .tl-media-content embed,\n.tl-media .tl-media-content-container .tl-media-content object,\n.tl-media .tl-media-content-container .tl-media-content video {\n max-width: 100%;\n max-height: 100%;\n}\n/* Media Only Slides\n================================================== */\n.tl-slide-media-only .tl-media .tl-media-content-container.tl-media-content-container-text {\n border-right: none;\n padding-right: 0;\n}\n/* Media Shodow\n================================================== */\n.tl-media-shadow {\n position: relative;\n z-index: 1;\n -webkit-box-shadow: 0 12px 10px -10px rgba(0, 0, 0, 0.6);\n -moz-box-shadow: 0 12px 10px -10px rgba(0, 0, 0, 0.6);\n box-shadow: 0 12px 10px -10px rgba(0, 0, 0, 0.6);\n}\n.tl-slide.tl-full-image-background a,\n.tl-slide.tl-full-color-background a,\n.tl-slide.tl-full-image-background .vcard a,\n.tl-slide.tl-full-color-background .vcard a {\n text-shadow: 1px 1px 1px #000;\n color: #ffffff;\n}\n.tl-slide.tl-full-image-background a:hover,\n.tl-slide.tl-full-color-background a:hover {\n text-decoration: underline;\n color: #c34528;\n}\n/* Credit\n================================================== */\n.tl-credit {\n color: #999999;\n text-align: right;\n display: block;\n margin: 0 auto;\n margin-top: 6px;\n font-size: 10px;\n line-height: 13px;\n}\n/* Caption\n================================================== */\n.tl-caption {\n text-align: left;\n margin-right: auto;\n margin-left: auto;\n margin-top: 10px;\n color: #666666;\n font-size: 11px;\n line-height: 14px;\n text-rendering: optimizeLegibility;\n word-wrap: break-word;\n}\n/* Full Image Background\n================================================== */\n.tl-full-image-background .tl-media-shadow:before,\n.tl-full-color-background .tl-media-shadow:before,\n.tl-full-image-background .tl-media-shadow:after,\n.tl-full-color-background .tl-media-shadow:after {\n background: none;\n -webkit-box-shadow: 0 0px 0px #000;\n -moz-box-shadow: 0 0px 0px #000;\n box-shadow: 0 0px 0px #000;\n}\n/* Skinny\n================================================== */\n.tl-skinny .tl-media {\n width: 100%;\n height: auto;\n float: none;\n display: block;\n}\n.tl-skinny .tl-media .tl-media-content-container.tl-media-content-container-text {\n border-right: 0;\n padding-right: 0;\n}\n.tl-skinny .tl-media .tl-media-content-container .tl-credit,\n.tl-skinny .tl-media .tl-media-content-container .tl-caption {\n margin-top: 2px;\n padding-left: 10px;\n padding-right: 10px;\n font-size: 8px;\n}\n.tl-skinny .tl-media .tl-media-content-container .tl-credit {\n margin-top: 0px;\n}\n/* Mobile, iPhone\n================================================== */\n/* Mobile, iPhone and skinny\n================================================== */\n.tl-mobile.tl-skinny .tl-media {\n width: 100%;\n height: auto;\n float: none;\n display: block;\n}\n.tl-mobile.tl-skinny .tl-media .tl-media-content-container.tl-media-content-container-text {\n border-right: 0;\n padding-right: 0;\n}\n/* Requires Variables.less\n================================================== */\n.tl-text {\n width: 50%;\n max-width: 50%;\n min-width: 120px;\n padding: 0 20px 0 20px;\n display: table-cell;\n vertical-align: middle;\n text-align: left;\n text-shadow: none;\n color: #737373;\n}\n.tl-text p {\n color: #737373;\n}\n.tl-text h2.tl-headline-title,\n.tl-text h2.tl-headline {\n margin-top: 0;\n}\n.tl-text .tl-headline-date,\n.tl-text h3.tl-headline-date {\n font-family: \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n font-size: 15px;\n line-height: 15px;\n font-weight: normal;\n margin: 0 0 3px 0;\n color: #b3b3b3;\n}\n.tl-text .tl-headline-date small,\n.tl-text h3.tl-headline-date small {\n font-size: 15px;\n line-height: 15px;\n font-weight: normal;\n color: #b3b3b3;\n}\n.tl-text .tl-text-date {\n display: inline-block;\n font-family: \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n font-weight: normal;\n margin-top: 10px;\n font-size: 12px;\n color: #b3b3b3;\n}\n.tl-full-image-background .tl-text,\n.tl-full-color-background .tl-text,\n.tl-full-image-background .tl-text p,\n.tl-full-color-background .tl-text p {\n color: #f2f2f2 !important;\n text-shadow: 1px 1px 2px #000;\n}\n.tl-full-image-background .tl-text .tl-headline-date,\n.tl-full-color-background .tl-text .tl-headline-date,\n.tl-full-image-background .tl-text p .tl-headline-date,\n.tl-full-color-background .tl-text p .tl-headline-date,\n.tl-full-image-background .tl-text h3.tl-headline-date,\n.tl-full-color-background .tl-text h3.tl-headline-date,\n.tl-full-image-background .tl-text p h3.tl-headline-date,\n.tl-full-color-background .tl-text p h3.tl-headline-date {\n color: #f2f2f2 !important;\n}\n.tl-full-image-background .tl-text .tl-headline-date small,\n.tl-full-color-background .tl-text .tl-headline-date small,\n.tl-full-image-background .tl-text p .tl-headline-date small,\n.tl-full-color-background .tl-text p .tl-headline-date small,\n.tl-full-image-background .tl-text h3.tl-headline-date small,\n.tl-full-color-background .tl-text h3.tl-headline-date small,\n.tl-full-image-background .tl-text p h3.tl-headline-date small,\n.tl-full-color-background .tl-text p h3.tl-headline-date small {\n color: #f2f2f2 !important;\n}\n.tl-full-image-background .tl-text a:hover,\n.tl-full-color-background .tl-text a:hover,\n.tl-full-image-background .tl-text p a:hover,\n.tl-full-color-background .tl-text p a:hover {\n text-decoration: underline;\n color: #c34528;\n}\n/* Skinny\n================================================== */\n.tl-skinny .tl-text {\n width: 100%;\n max-width: 100%;\n min-width: auto;\n float: none;\n margin-top: 20px;\n}\n.tl-skinny .tl-text h2.tl-headline-title,\n.tl-skinny .tl-text h2.tl-headline {\n font-size: 32px;\n line-height: 36px;\n}\n/* Medium\n================================================== */\n.tl-medium .tl-text h2.tl-headline-title,\n.tl-medium .tl-text h2.tl-headline {\n font-size: 32px;\n line-height: 36px;\n}\n/* Mobile, iPhone\n================================================== */\n/* Mobile, iPhone and skinny\n================================================== */\n.tl-mobile.tl-skinny .tl-media .tl-media-image {\n max-height: 250px !important;\n}\n.tl-media .tl-media-twitter {\n text-align: left;\n clear: both;\n}\n.tl-media .tl-media-twitter blockquote {\n margin: 0;\n margin-right: 15px;\n font-size: 15px;\n line-height: 21px;\n color: #333;\n}\n.tl-media .tl-media-twitter blockquote p {\n font-size: 28px;\n line-height: 30px;\n color: #000;\n}\n.tl-media .tl-media-twitter blockquote p:before {\n display: none;\n}\n.tl-media .tl-media-twitter blockquote p:after {\n display: none;\n}\n.tl-media .tl-media-twitter .tl-icon-twitter {\n color: #55ACEE;\n}\n.tl-media .tl-media-twitter .vcard a:hover,\n.tl-media .tl-media-twitter .vcard a.tl-date:hover {\n text-decoration: none;\n color: #55ACEE;\n}\n.tl-media .tl-media-twitter .vcard a:hover .fn,\n.tl-media .tl-media-twitter .vcard a.tl-date:hover .fn,\n.tl-media .tl-media-twitter .vcard a:hover .nickname,\n.tl-media .tl-media-twitter .vcard a.tl-date:hover .nickname {\n color: #55ACEE;\n}\n.tl-slide-media-only .tl-media .tl-media-twitter {\n width: 80%;\n margin-left: auto;\n margin-right: auto;\n}\n.tl-mobile.tl-skinny .tl-media .tl-media-twitter blockquote p {\n font-size: 15px;\n line-height: 21px;\n}\n.tl-skinny .tl-media .tl-media-twitter {\n margin-left: 10px;\n margin-right: 10px;\n}\n.tl-skinny .tl-media .tl-media-twitter blockquote p {\n font-size: 24px;\n line-height: 26px;\n}\n.tl-media .tl-media-blockquote {\n text-align: left;\n clear: both;\n}\n.tl-media .tl-media-blockquote blockquote {\n margin: 0;\n margin-right: 15px;\n text-align: left;\n font-size: 28px;\n line-height: 30px;\n color: #333;\n}\n.tl-media .tl-media-blockquote blockquote p {\n font-size: 28px;\n line-height: 30px;\n color: #333;\n}\n.tl-media .tl-media-blockquote blockquote p:before,\n.tl-media .tl-media-blockquote blockquote p:after {\n display: inline-block;\n font-size: 36px;\n}\n.tl-media .tl-media-blockquote blockquote p:before {\n content: open-quote;\n margin-right: 5px;\n}\n.tl-media .tl-media-blockquote blockquote p:after {\n content: close-quote;\n margin-left: 3px;\n}\n.tl-media .tl-media-blockquote blockquote cite {\n font-size: 15px;\n line-height: 21px;\n color: #999999;\n text-align: right;\n margin-top: 15px;\n}\n.tl-slide-media-only .tl-media .tl-media-blockquote {\n border-right: 0;\n width: 80%;\n margin-left: auto;\n margin-right: auto;\n}\n@media only screen and (max-width: 800px), only screen and (max-device-width: 800px) {\n .tl-media .tl-media-blockquote blockquote p {\n font-size: 24px;\n line-height: 26px;\n }\n}\n@media only screen and (max-width: 500px), only screen and (max-device-width: 500px) {\n .tl-media .tl-media-blockquote blockquote p {\n font-size: 15px;\n line-height: 21px;\n }\n}\n.tl-mobile.tl-skinny .tl-media .tl-media-instagram {\n max-height: 250px !important;\n}\n.tl-media .tl-media-profile {\n border-radius: 50%;\n}\n.tl-media .tl-media-iframe {\n width: 100%;\n height: 100%;\n}\n.tl-media .tl-media-iframe iframe {\n width: 100%;\n height: 100%;\n}\n.tl-media .tl-media-wikipedia {\n text-align: left;\n margin-left: auto;\n margin-right: auto;\n clear: both;\n}\n.tl-media .tl-media-wikipedia .tl-icon-wikipedia {\n font-size: 32px;\n margin-right: 10px;\n float: left;\n padding-top: 3px;\n}\n.tl-media .tl-media-wikipedia .tl-wikipedia-pageimage {\n float: left;\n margin-right: 10px;\n margin-bottom: 5px;\n margin-top: 5px;\n}\n.tl-media .tl-media-wikipedia .tl-wikipedia-title {\n margin-left: 60px;\n padding-left: 10px;\n border-left: 1px solid #e6e6e6;\n margin-bottom: 10px;\n}\n.tl-media .tl-media-wikipedia .tl-wikipedia-source {\n font-size: 13px;\n line-height: 15px;\n font-style: italic;\n margin-top: 3px;\n display: block;\n color: rgba(0, 0, 0, 0.5);\n}\n.tl-media .tl-media-wikipedia h4 {\n margin-top: 0px;\n margin-bottom: 0px;\n}\n.tl-media .tl-media-wikipedia h4 a {\n color: #000;\n text-decoration: none;\n}\n.tl-media .tl-media-wikipedia p {\n font-size: 13px;\n line-height: 19px;\n}\n.tl-slide-media-only .tl-media .tl-media-wikipedia {\n border-right: 0;\n border-top: 1px solid #e6e6e6;\n width: 80%;\n margin-left: auto;\n margin-right: auto;\n margin-top: 25px;\n padding-top: 25px;\n}\n.tl-slide.tl-full-image-background .tl-media .tl-media-wikipedia,\n.tl-slide.tl-full-color-background .tl-media .tl-media-wikipedia {\n padding: 20px;\n /* Fallback for web browsers that doesn't support RGBa */\n background: #000000 transparent;\n /* RGBa with 0.6 opacity */\n background: rgba(0, 0, 0, 0.6);\n -webkit-border-radius: 7px;\n -moz-border-radius: 7px;\n border-radius: 7px;\n}\n.tl-slide.tl-full-image-background .tl-media .tl-media-wikipedia h4 a,\n.tl-slide.tl-full-color-background .tl-media .tl-media-wikipedia h4 a {\n color: #FFF !important;\n text-shadow: 1px 1px 1px #000 !important;\n}\n.tl-slide.tl-full-image-background .tl-media .tl-media-wikipedia a:hover,\n.tl-slide.tl-full-color-background .tl-media .tl-media-wikipedia a:hover {\n text-decoration: underline;\n color: #c34528;\n}\n.tl-slide.tl-full-image-background .tl-media .tl-media-wikipedia .tl-wikipedia-title,\n.tl-slide.tl-full-color-background .tl-media .tl-media-wikipedia .tl-wikipedia-title {\n border-color: rgba(230, 230, 230, 0.25);\n}\n.tl-slide.tl-full-image-background .tl-media .tl-media-wikipedia .tl-wikipedia-source,\n.tl-slide.tl-full-color-background .tl-media .tl-media-wikipedia .tl-wikipedia-source {\n color: rgba(230, 230, 230, 0.85);\n}\n.tl-mobile.tl-skinny .tl-media .tl-media-wikipedia,\n.tl-skinny .tl-media .tl-media-wikipedia {\n margin-left: 10px;\n margin-right: 10px;\n}\n.tl-media .tl-media-website {\n text-align: left;\n margin-left: auto;\n margin-right: auto;\n clear: both;\n}\n.tl-media .tl-media-website .tl-media-website-description {\n font-size: 16px;\n line-height: 19px;\n font-style: italic;\n margin-bottom: 10px;\n text-transform: uppercase;\n}\n.tl-media .tl-media-website h4 {\n margin-top: 0px;\n margin-bottom: 0px;\n line-height: 1;\n}\n.tl-media .tl-media-website h4 a {\n color: #000;\n text-decoration: none;\n}\n.tl-media .tl-media-website p {\n font-size: 13px;\n line-height: 19px;\n}\n.tl-media .tl-media-content-container .tl-media-content .tl-media-website img {\n float: right;\n max-width: 120px;\n max-height: 120px;\n margin: 4px 0 0 15px;\n}\n.tl-media .tl-media-content-container .tl-media-content .tl-media-website img.tl-media-website-icon {\n max-width: 16px;\n max-height: 16px;\n float: none;\n margin: 0;\n margin-right: 3px;\n}\n.tl-slide.tl-full-image-background .tl-media .tl-media-website,\n.tl-slide.tl-full-color-background .tl-media .tl-media-website {\n padding: 20px;\n /* Fallback for web browsers that doesn't support RGBa */\n background: #000000 transparent;\n /* RGBa with 0.6 opacity */\n background: rgba(0, 0, 0, 0.6);\n -webkit-border-radius: 7px;\n -moz-border-radius: 7px;\n border-radius: 7px;\n}\n.tl-slide.tl-full-image-background .tl-media .tl-media-website h4 a,\n.tl-slide.tl-full-color-background .tl-media .tl-media-website h4 a {\n color: #FFF !important;\n text-shadow: 1px 1px 1px #000 !important;\n}\n.tl-slide.tl-full-image-background .tl-media .tl-media-website a:hover,\n.tl-slide.tl-full-color-background .tl-media .tl-media-website a:hover {\n text-decoration: underline;\n color: #c34528;\n}\n.tl-mobile.tl-skinny .tl-media .tl-media-website {\n margin-left: 10px;\n margin-right: 10px;\n}\n/* Timeline\n================================================== */\n.tl-timeline {\n width: 100%;\n height: 100%;\n font-size: 16px;\n line-height: normal;\n overflow: hidden;\n position: relative;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n -o-user-select: none;\n user-select: none;\n background-color: #FFF;\n color: #737373;\n -webkit-box-sizing: content-box;\n -moz-box-sizing: content-box;\n box-sizing: content-box;\n}\n.tl-timeline.tl-timeline-embed {\n box-sizing: border-box;\n border-top: 1px solid #cccccc;\n border-bottom: 1px solid #cccccc;\n border-radius: 0;\n}\n.tl-timeline.tl-timeline-full-embed {\n box-sizing: border-box;\n border: 1px solid #cccccc;\n border-radius: 8px;\n}\n/* Portrait\n================================================== */\n.tl-layout-portrait .tl-storyslider {\n -webkit-box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.2);\n -moz-box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.2);\n box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.2);\n}\n.tl-rtl .tl-text-content,\n.tl-rtl .tl-headline,\n.tl-rtl .tl-media-blockquote,\n.tl-rtl .tl-headline-date,\n.tl-rtl .tl-timeline blockquote p,\n.tl-rtl .tl-media-website,\n.tl-rtl .tl-media-wikipedia,\n.tl-rtl .tl-media .tl-media-blockquote blockquote,\n.tl-rtl .blockquote,\n.tl-rtl blockquote p,\n.tl-rtl .tl-text-content p {\n text-align: right;\n direction: rtl;\n}\n.tl-rtl .tl-slide-media-only .tl-headline,\n.tl-rtl .tl-slide-media-only .tl-headline-date {\n text-align: center;\n}\n.tl-rtl .tl-timemarker-text {\n margin-right: 35px;\n}\n.tl-rtl .tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container {\n float: right;\n}\n.tl-rtl .tl-caption {\n text-align: right;\n}\n.tl-rtl .tl-credit {\n text-align: left;\n}\n","/*\tReset\n------------------------------------------------------------------------------------------- */\n\n.tl-storyjs {\n\n\t/*\tReset tags and common classes\n\t\tDisplay in IE6-9 and FF3\n\t\tBased on: http://github.com/necolas/normalize.css\n\t------------------------------------------------------------------------------------------- */\n\t\n\tdiv * {\n\t\t-webkit-box-sizing:content-box;\n\t\t -moz-box-sizing:content-box;\n\t\t box-sizing:content-box;\n\t}\n\t\n\th1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, cite, code, del, dfn, em, img, q, s, samp, small, strike, strong, \n\tsub, sup, tt, var, dd, dl, dt, li, ol, ul, fieldset, form, label, legend, button, table, caption, tbody, tfoot, thead, tr, th, td, \n\t.tl-container, .content-container, .media, .text, .tl-slider, .slider, .date, .title, .message, .map, .credit, .caption, .tl-feedback, .tl-feature, .toolbar, \n\t.marker, .dot, .line, .flag, .time, .era, .major, .minor, .tl-navigation, .start, .active {\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\tborder: 0;\n\t\tfont-weight: normal;\n\t\tfont-style: normal;\n\t\tfont-size: 100%;\n\t\tline-height: 1;\n\t\tfont-family: inherit;\n\t\twidth: auto;\n\t\tfloat:none;\n\t}\n\th1, h2, h3, h4, h5, h6 {\n\t\tclear:none;\n\t}\n\ttable { border-collapse: collapse; border-spacing: 0;}\n\tol, ul { list-style: none;}\n\tq:before, q:after, blockquote:before, blockquote:after { content: \"\"; }\n\ta:focus { outline: thin dotted; }\n\ta:hover, a:active { outline: 0;}\n\tarticle, aside, details, figcaption, figure, footer, header, hgroup, nav, section {\n\t\tdisplay: block;\n\t}\n\taudio, canvas, video {\n\t\tdisplay: inline-block;\n\t\t*display: inline;\n\t\t*zoom: 1;\n\t}\n\n\t/*\tPrevents modern browsers from displaying 'audio' without controls\n\t\tBased on: http://github.com/necolas/normalize.css\n\t------------------------------------------------------------------------------------------- */\n\taudio:not([controls]) {\n\t\tdisplay: none;\n\t}\n\tdiv {\n\t\tmax-width:none;\n\t}\n\t\n\t/*\tPrevents sub and sup affecting line-height in all browsers\n\t\tBased on: http://github.com/necolas/normalize.css\n\t------------------------------------------------------------------------------------------- */\n\tsub, sup {\n\t\tfont-size: 75%;\n\t\tline-height: 0;\n\t\tposition: relative;\n\t\tvertical-align: baseline;\n\t}\n\tsup {\n\t\ttop: -0.5em;\n\t}\n\tsub {\n\t\tbottom: -0.25em;\n\t}\n\n\t/*\tImg border in a's and image quality\n\t\tBased on: http://github.com/necolas/normalize.css\n\t------------------------------------------------------------------------------------------- */\n\timg {\n\t\tborder: 0;\n\t\t-ms-interpolation-mode: bicubic;\n\t}\n\n\t/*\tForms\n\t\tBased on: http://github.com/necolas/normalize.css\n\t------------------------------------------------------------------------------------------- */\n\tbutton, input, select, textarea {\n\t font-size: 100%;\n\t margin: 0;\n\t vertical-align: baseline;\n\t *vertical-align: middle;\n\t}\n\tbutton, input {\n\t line-height: normal; // FF3/4 have !important on line-height in UA stylesheet\n\t *overflow: visible; // Inner spacing ie IE6/7\n\t}\n\tbutton::-moz-focus-inner, input::-moz-focus-inner { // Inner padding and border oddities in FF3/4\n\t border: 0;\n\t padding: 0;\n\t}\n\tbutton, input[type=\"button\"], input[type=\"reset\"], input[type=\"submit\"] {\n\t cursor: pointer; // Cursors on all buttons applied consistently\n\t -webkit-appearance: button; // Style clicable inputs in iOS\n\t}\n\tinput[type=\"search\"] { // Appearance in Safari/Chrome\n\t -webkit-appearance: textfield;\n\t -webkit-box-sizing: content-box;\n\t -moz-box-sizing: content-box;\n\t box-sizing: content-box;\n\t}\n\tinput[type=\"search\"]::-webkit-search-decoration {\n\t -webkit-appearance: none; // Inner-padding issues in Chrome OSX, Safari 5\n\t}\n\ttextarea {\n\t overflow: auto; // Remove vertical scrollbar in IE6-9\n\t vertical-align: top; // Readability and alignment cross-browser\n\t}\n}",".tl-timeline {\n\tfont-family: @font-main;\n\t\n\th1, h2, h3, h4, h5, h6 {\n\t\tcolor:@color-header-text;\n\t}\n\t\n\th1, h2, h3 {\n\t\tfont-size: @base-font-size-xlarge;\n\t\tline-height:@base-font-size-xlarge;\n\t\tsmall {\n\t\t\tfont-size: \t\t@base-font-size-large;\n\t\t\tline-height:\t@base-font-size-large;\n\t\t}\n\t}\n\th4, h5, h6 {\n\t\tfont-size: @base-font-size-large;\n\t\tline-height:@base-font-size-large;\n\t\tmargin-bottom:0px;\n\t\tsmall {\n\t\t\tfont-size: @base-font-size;\n\t\t\tline-height:@base-font-size;\n\t\t}\n\t}\n\th2.tl-headline-title {\n\t\tfont-size: @base-font-size-xlarge + 10;\n\t\tline-height: @base-font-size-xlarge + 10;\n\t\tsmall {\n\t\t\tdisplay:block;\n\t\t\tmargin-top:5px;\n\t\t\tfont-size: @base-font-size-large;\n\t\t\tline-height:@base-font-size-large;\n\t\t}\n\t}\n\t\n\th2 {\n\t\tmargin-top:20px;\n\t\tmargin-bottom:5px;\n\t}\n\t\n\tp {\n\t\tmargin-top:5px;\n\t\tmargin-bottom:10px;\n\t\tfont-size: @base-font-size;\n\t\tline-height:@base-line-height;\n\t\t//font-family: @font-secondary;\n\t\tcolor: lighten(@color-dark, 40%);\n\t\t&.lead {\n\t\t\tfont-size: @base-font-size-large;\n\t\t}\n\t\ta {\n\t\t\t/*\n\t\t\tcolor: lighten(@color-dark, 40%);\n\t\t\ttext-decoration: none;\n\t\t\tbackground-image: -moz-linear-gradient(top, fade(lighten(@color-dark, 40%), 0%) 50%, fade(lighten(@color-dark, 40%), 60%) 50%);\n\t\t\tbackground-image: -webkit-linear-gradient(top, fade(lighten(@color-dark, 40%), 0%) 50%, fade(lighten(@color-dark, 40%), 60%) 50%);\n\t\t\tbackground-image: -o-linear-gradient(top, fade(lighten(@color-dark, 40%), 0%) 50%, fade(lighten(@color-dark, 40%), 60%) 50%);\n\t\t\tbackground-image: linear-gradient(to bottom, fade(lighten(@color-dark, 40%), 0%) 50%, fade(lighten(@color-dark, 40%), 60%) 50%);\n\t\t\tbackground-repeat: repeat-x;\n\t\t\tbackground-size: 2px 2px;\n\t\t\tbackground-position: 0 @base-font-size+2;\n\t\t\ttext-shadow: -2px -1px 0 white, 2px -1px 0 white, -2px 1px 0 white, 2px 1px 0 white;\n\t\t\t&:hover,\n\t\t\t&:focus {\n\t\t\t\tcolor:@color-theme;\n\t\t\t\ttext-decoration: none;\n\t\t\t}\n\t\t\t*/\n\t\t\tcolor: lighten(@color-dark, 40%);\n\t\t\ttext-decoration: underline;\n\t\t\t&:hover,\n\t\t\t&:focus {\n\t\t\t\tcolor:@color-theme;\n\t\t\t\t//text-decoration: none;\n\t\t\t}\n\t\t}\n\t\t\n\t\t\n\t\t@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {\n\t\t\ta {\n\t\t\t\ttext-decoration: underline;\n\t\t\t\tbackground-image:none;\n\t\t\t\ttext-shadow: none;\n\t\t\t\t&:hover,\n\t\t\t\t&:focus {\n\t\t\t\t\tcolor:@color-theme;\n\t\t\t\t\ttext-decoration: underline;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t\n\t\t\n\t}\n\tb, strong {\n\t\tfont-weight: bold;\n\t\t//color: @color-dark;\n\t}\n\ti, em {\n\t\tfont-style: italic;\n\t}\n\ta {\n\t\ttext-decoration:none;\n\t\tcolor:@color-theme;\n\t}\n\ta:hover {\n\t\ttext-decoration:underline;\n\t\tcolor: darken(@color-theme, 20%);\n\t}\n\t.tl-caption, .tl-credit, .tl-slidenav-next, .tl-slidenav-previous {\n\t\t//font-family: @font-sanserif;\n\t\tfont-size:@base-font-size-small;\n\t\tline-height:@base-font-size-small;\n\t\ta {\n\t\t\tcolor: @color-dark;\n\t\t}\n\t}\n\t.tl-makelink {\n\n\t\tword-break: break-all;\n\t\tword-break: break-word;\n\t\t-webkit-hyphens: auto;\n\t\t -moz-hyphens: auto;\n\t\t hyphens: auto;\n\t}\n\tblockquote, blockquote p {\n\t\tfont-family: @font-serif;\n\t\tcolor: lighten(@color-dark, 60%);\n\t\tfont-size: @base-font-size-large;\n\t\tline-height:@base-font-size-large;\n\t\ttext-align:left;\n\t\tbackground:transparent;\n\t\tborder:0px;\n\t\tpadding:0px;\n\t\tcite {\n\t\t\tfont-family: @font-sanserif;\n\t\t\tfont-size: @base-font-size-small;\n\t\t\tcolor: lighten(@color-dark, 40%);\n\t\t\tdisplay:block;\n\t\t\ttext-align:right;\n\t\t\tfont-style: normal;\n\t\t\t\n\t\t}\n\t\tcite:before {\n\t\t\tcontent: \"\\2014\";\n\t\t}\n\t}\n\tblockquote p:before {\n\t\tcontent: open-quote;\n\t\tdisplay:inline-block;\n\t\tfont-size: @base-font-size-xlarge;\n\t\tposition: relative; \n\t\ttop: 8px;\n\t\tmargin-right:5px;\n\t\t\n\t}\n\tblockquote p:after {\n\t\tcontent: close-quote;\n\t\tdisplay:inline-block;\n\t\tfont-size: @base-font-size-xlarge;\n\t\tposition: relative; \n\t\ttop: 8px;\n\t\tmargin-left:3px;\n\t\t\n\t}\n\tblockquote {\n\t\tmargin:10px;\n\t\tp {\n\t\t\tmargin:0;\n\t\t}\n\t\t//margin-left:18px;\n\t}\n\t\n\n\t/* VCard\n\t================================================== */\n\t.vcard {\n\t\tfont-family: @font-main;\n\t\tfont-size: @base-font-size;\n\t\tline-height:@base-font-size;\n\n\t\t.clearfix();\n\t\tmargin-bottom:@base-spacing;\n\t\tmargin-top:10px;\n\t\t.twitter-date {\n\t\t\ttext-align:left;\n\t\t\tfont-size:@base-font-size-small;\n\t\t}\n\t\t.author {\n\t\t\tfloat:right;\n\t\t\t//text-align:right;\n\t\t}\n\t\ta {\n\t\t\tcolor: lighten(@color-dark, 20%);\n\t\t\ttext-decoration:none;\n\t\t}\n\t\ta:hover {\n\t\t\ttext-decoration: none;\n\t\t\t.fn, .nickname {\n\t\t\t\tcolor:@color-theme;\n\t\t\t\t//text-decoration: underline;\n\t\t\t}\n\t\t}\n\t\t.fn, .nickname {\n\t\t\t\t\n\t\t\tpadding-left: 42px;\n\t\t}\n\t\t.fn {\n\t\t\tdisplay:block;\n\t\t\tfont-weight: bold;\n\n\t\t}\n\t\t.nickname {\n\t\t\tmargin-top:1px;\n\t\t\tdisplay:block;\n\t\t\tcolor: lighten(@color-dark, 40%);\n\t\t}\n\t\t\t\n\t\t.avatar {\n\t\t\tfloat:left;\n\t\t\tdisplay: block;\n\t\t\twidth: 32px;\n\t\t\theight: 32px;\n\t\t\timg {\n\t\t\t\t-moz-border-radius: 5px;\n\t\t\t\t-webkit-border-radius: 5px;\n\t\t\t\tborder-radius: 5px;\n\t\t\t}\n\t\t}\n\t}\n\t.tl-text {\n\t\tul {\n\t\t\tpadding:0px;\n\t\t\tpadding-left:30px;\n\t\t\tmargin:0;\n\t\t\tli {\n\t\t\t\tmargin-bottom:5px;\n\t\t\t}\n\t\t}\n\t\t\n\t}\n\n\t.tl-button-calltoaction {\n\t\tcursor: pointer;\n\t\tfont-weight: bold;\n\t\tpadding-top: 10px;\n\t\tmargin-bottom: 10px;\n\t\tpadding-bottom: 10px;\n\n\t\t.tl-button-calltoaction-text {\n\t\t\tdisplay: inline-block;\n\t\t\tbackground-color: #c34528;\n\t\t\tcolor: #fff;\n\t\t\tpadding: 10px 15px 10px 15px;\n\t\t\tborder-radius: 7px;\n\t\t}\n\t}\n\n\t.tl-note {\n\t\tdisplay:block;\n\t\tfont-family: @font-main;\n\t\tfont-style: italic;\n\t\tbackground-color:lighten(@color-dark, 90%);\n\t\tfont-size:@base-font-size;\n\t\tline-height:@base-font-size+2;\n\t\tpadding:10px;\n\t\t.border-radius(7px); \n\t\tcolor: #8a6d3b;\n\t\tbackground-color: #fcf8e3;\n\t\tborder: 1px solid #faebcc;\n\t\ttext-shadow: none;\n\t}\n\n\n}\n\n\n// Skinnier\n@media only screen and (max-width: 800px), only screen and (max-device-width: 800px) {\n\t.tl-timeline {\n\t\th1, h2, h3 {\n\t\t\tfont-size: @base-font-size-xlarge;\n\t\t\tline-height: @base-font-size-xlarge;\n\t\t}\n\t\th2.tl-headline-title {\n\t\t}\n\t}\n\t\n}\n// Mobile, iPhone and skinny\n@media only screen and (max-width: 500px), only screen and (max-device-width: 500px) {\n\t.tl-timeline {\n\t\th1, h2, h3 {\n\t\t\tfont-size: @base-font-size-xlarge - 4;\n\t\t\tline-height: @base-font-size-xlarge - 4;\n\t\t}\n\t\th2.tl-headline-title {\n\n\t\t}\n\t}\n}\n.tl-skinny {\n\th2 {\n\t\tmargin-top:0px;\n\t\t//padding-top:20px;\n\t}\n}","/*\tMixins.less\n\tSnippets of reusable CSS to develop faster and keep code readable\n * ----------------------------------------------------------------- */\n// Marker bottom text fade\n.marker-text-fade(@thecolor, @thepercent: 100%) {\n\tbackground: -moz-linear-gradient(top, fadeout(@thecolor, 100%) 0%, @thecolor @thepercent); /* FF3.6+ */\n\tbackground: -webkit-gradient(linear, left top, left bottom, color-stop(0%,fadeout(@thecolor, 100%)), color-stop(@thepercent,@thecolor)); /* Chrome,Safari4+ */\n\tbackground: -webkit-linear-gradient(top, fadeout(@thecolor, 100%) 0%,@thecolor @thepercent); /* Chrome10+,Safari5.1+ */\n\tbackground: -o-linear-gradient(top, fadeout(@thecolor, 100%) 0%,@thecolor @thepercent); /* Opera 11.10+ */\n\tbackground: -ms-linear-gradient(top, fadeout(@thecolor, 100%) 0%,@thecolor @thepercent); /* IE10+ */\n\tbackground: linear-gradient(to bottom, fadeout(@thecolor, 100%) 0%,@thecolor @thepercent); /* W3C */\n\tfilter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@thecolor', endColorstr='@thecolor',GradientType=0 ); /* IE6-9 */\n}\n\n// Cubic Bezier \n.animation-timing-cubic-bezier() {\n\t\n\t-webkit-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); \n\t -moz-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); \n\t -o-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); \n\t transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);\n}\n\n// Property Animation\n.property-animation(@prop:height, @time:1000ms, @ease:cubic-bezier(0.770, 0.000, 0.175, 1.000)) {\n\t-webkit-transition+: @prop @time cubic-bezier(0.770, 0.000, 0.175, 1.000); \n\t -moz-transition+: @prop @time cubic-bezier(0.770, 0.000, 0.175, 1.000); \n\t -o-transition+: @prop @time cubic-bezier(0.770, 0.000, 0.175, 1.000); \n\t transition+: @prop @time cubic-bezier(0.770, 0.000, 0.175, 1.000);\n}\n\n// Disable Selection\n.disable-selection() {\n\t-webkit-touch-callout: none;\n\t -webkit-user-select: none;\n\t -khtml-user-select: none;\n\t -moz-user-select: none;\n\t -ms-user-select: none;\n\t user-select: none;\n}\n\n// Border Box\n.border-box() {\n\t-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */\n\t -moz-box-sizing: border-box; /* Firefox, other Gecko */\n\t\t box-sizing: border-box;\n}\n\n// Opacity\n.opacity(@opacity: 100) {\n \tfilter: e(%(\"alpha(opacity=%d)\", @opacity));\n \t-khtml-opacity: @opacity / 100;\n \t -moz-opacity: @opacity / 100;\n \t opacity: @opacity / 100;\n}\n// Background Opacity\n.background-opacity(@opacity: 100) {\n\t/* Fallback for web browsers that doesn't support RGBa */\n\tbackground: rgb(0, 0, 0) transparent;\n\t/* RGBa with 0.6 opacity */\n\tbackground: rgba(0, 0, 0, @opacity / 100);\n}\n\n// Background Color Opacity\n.background-color-opacity(@cr:0, @cg:0, @cb:0, @opacity: 100) {\n\t/* Fallback for web browsers that doesn't support RGBa */\n\tbackground: rgb(@cr, @cg, @cb) transparent;\n\t/* RGBa with 0.6 opacity */\n\tbackground: rgba(@cr, @cg, @cb, @opacity / 100);\n}\n\n// Slide Text Shadow\n.slide-text-shadow(@shadow: 1px 1px 1px #000) {\n\tcolor: #FFF !important;\n\ttext-shadow: @shadow !important;\n\n}\n\n// Border Radius\n.border-radius(@radius: 5px) {\n \t-webkit-border-radius: @radius;\n \t -moz-border-radius: @radius;\n \t border-radius: @radius;\n}\n\n// Single side border-radius\n.border-top-radius(@radius) {\n border-top-right-radius: @radius;\n border-top-left-radius: @radius;\n}\n.border-right-radius(@radius) {\n border-bottom-right-radius: @radius;\n border-top-right-radius: @radius;\n}\n.border-bottom-radius(@radius) {\n border-bottom-right-radius: @radius;\n border-bottom-left-radius: @radius;\n}\n.border-left-radius(@radius) {\n border-bottom-left-radius: @radius;\n border-top-left-radius: @radius;\n}\n\n// Box Shadow\n.box-shadow(@shadow: 1px 1px 7px rgba(0,0,0,.30)) {\n\t-webkit-box-shadow: @shadow;\n\t -moz-box-shadow: @shadow;\n\t box-shadow: @shadow;\n}\n// Transform\n.transform(@transform) {\n \t-webkit-transform: @transform;\n \t -moz-transform: @transform;\n \t -ms-transform: @transform;\n \t -o-transform: @transform;\n \t transform: @transform;\n}\n// Transitions\n.transition(@transition) {\n \t-webkit-transition: @transition;\n \t -moz-transition: @transition;\n \t -ms-transition: @transition;\n \t -o-transition: @transition;\n \t transition: @transition;\n}\n// Hyphens\n.hyphens(@hyphens: auto) {\n \t-webkit-hyphens:@hyphens;\n \t -moz-hyphens:@hyphens;\n \t -ms-hyphens:@hyphens;\n \t hyphens:@hyphens;\n}\n// User select\n// For selecting text on the page\n.user-select(@select) {\n\t-webkit-user-select: @select;\n\t -moz-user-select: @select;\n\t -ms-user-select: @select; // IE10+\n\t -o-user-select: @select;\n\t user-select: @select;\n}\n// Clear Fix\n.clearfix() {\n\t*zoom: 1;\n\t&:before,\n\t&:after {\n\t\tdisplay: table;\n\t\tcontent: \"\";\n\t}\n\t&:after {\n\t\tclear: both;\n\t}\n}\n.translucent-background(@color: @white, @alpha: 1) {\n\tbackground-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);\n}\n// Add an alphatransparency value to any background or border color (via Elyse Holladay)\n#translucent {\n .background(@color: @white, @alpha: 1) {\n background-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);\n }\n .border(@color: @white, @alpha: 1) {\n border-color: hsla(hue(@color), saturation(@color), lightness(@color), @alpha);\n background-clip: padding-box;\n }\n}\n// Reset filters for IE\n.reset-filter() {\n\tfilter: e(%(\"progid:DXImageTransform.Microsoft.gradient(enabled = false)\"));\n}\n// Center-align a block level element\n.center-block() {\n\tdisplay: block;\n\tmargin-left: auto;\n\tmargin-right: auto;\n}\n// Create Vertical Gradient\n.gradient-vertical (@startColor: #555, @endColor: #333) {\n //background-color: @endColor;\n background-repeat: repeat-x;\n background-image: -khtml-gradient(linear, left top, left bottom, from(@startColor), to(@endColor)); // Konqueror\n background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+\n background-image: -ms-linear-gradient(top, @startColor, @endColor); // IE10\n background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, @startColor), color-stop(100%, @endColor)); // Safari 4+, Chrome 2+\n background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+\n background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10\n background-image: linear-gradient(top, @startColor, @endColor); // The standard\n filter: e(%(\"progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)\",@startColor,@endColor)); // IE9 and down\n}\n\n// GRADIENTS\n// --------------------------------------------------\n\n#gradient {\n\n // Horizontal gradient, from left to right\n //\n // Creates two color stops, start and end, by specifying a color and position for each color stop.\n // Color stops are not available in IE9 and below.\n .horizontal(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) {\n background-image: -webkit-linear-gradient(left, color-stop(@start-color @start-percent), color-stop(@end-color @end-percent)); // Safari 5.1-6, Chrome 10+\n background-image: linear-gradient(to right, @start-color @start-percent, @end-color @end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+\n background-repeat: repeat-x;\n filter: e(%(\"progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)\",argb(@start-color),argb(@end-color))); // IE9 and down\n }\n\n // Vertical gradient, from top to bottom\n //\n // Creates two color stops, start and end, by specifying a color and position for each color stop.\n // Color stops are not available in IE9 and below.\n .vertical(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) {\n background-image: -webkit-linear-gradient(top, @start-color @start-percent, @end-color @end-percent); // Safari 5.1-6, Chrome 10+\n background-image: linear-gradient(to bottom, @start-color @start-percent, @end-color @end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+\n background-repeat: repeat-x;\n filter: e(%(\"progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)\",argb(@start-color),argb(@end-color))); // IE9 and down\n }\n\n .directional(@start-color: #555; @end-color: #333; @deg: 45deg) {\n background-repeat: repeat-x;\n background-image: -webkit-linear-gradient(@deg, @start-color, @end-color); // Safari 5.1-6, Chrome 10+\n background-image: linear-gradient(@deg, @start-color, @end-color); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+\n }\n .horizontal-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) {\n background-image: -webkit-linear-gradient(left, @start-color, @mid-color @color-stop, @end-color);\n background-image: linear-gradient(to right, @start-color, @mid-color @color-stop, @end-color);\n background-repeat: no-repeat;\n filter: e(%(\"progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)\",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback\n }\n .vertical-three-colors(@start-color: #00b3ee; @mid-color: #7a43b6; @color-stop: 50%; @end-color: #c3325f) {\n background-image: -webkit-linear-gradient(@start-color, @mid-color @color-stop, @end-color);\n background-image: linear-gradient(@start-color, @mid-color @color-stop, @end-color);\n background-repeat: no-repeat;\n filter: e(%(\"progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)\",argb(@start-color),argb(@end-color))); // IE9 and down, gets no color-stop at all for proper fallback\n }\n .radial(@inner-color: #555; @outer-color: #333) {\n background-image: -webkit-radial-gradient(circle, @inner-color, @outer-color);\n background-image: radial-gradient(circle, @inner-color, @outer-color);\n background-repeat: no-repeat;\n }\n .striped(@color: rgba(255,255,255,.15); @angle: 45deg) {\n background-image: -webkit-linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent);\n background-image: linear-gradient(@angle, @color 25%, transparent 25%, transparent 50%, @color 50%, @color 75%, transparent 75%, transparent);\n }\n}","/* Icons\n================================================== */\n\n@font-face {\n\tfont-family: 'tl-icons';\n\tsrc:url('@{icon-path}tl-icons.eot');\n\tsrc:url('@{icon-path}tl-icons.eot?#iefix') format('embedded-opentype'),\n\t\turl('@{icon-path}tl-icons.ttf') format('truetype'),\n\t\turl('@{icon-path}tl-icons.woff2') format('woff2'),\n\t\turl('@{icon-path}tl-icons.woff') format('woff'),\n\t\turl('@{icon-path}tl-icons.svg#tl-icons') format('svg');\n\tfont-weight: normal;\n\tfont-style: normal;\n}\n\n[class^=\"tl-icon-\"], [class*=\" tl-icon-\"] {\n\tfont-family: 'tl-icons';\n\tspeak: none;\n\tfont-style: normal;\n\tfont-weight: normal;\n\tfont-variant: normal;\n\ttext-transform: none;\n\tline-height: 1;\n\n\t/* Better Font Rendering =========== */\n\t-webkit-font-smoothing: antialiased;\n\t-moz-osx-font-smoothing: grayscale;\n}\n\n\n.tl-icon-vine:after {\n\tcontent: \"\\e64d\";\n}\n.tl-icon-wikipedia:after {\n\tcontent: \"\\e64e\";\n}\n.tl-icon-chevron-right:after {\n\tcontent: \"\\e64f\";\n}\n.tl-icon-chevron-left:after {\n\tcontent: \"\\e650\";\n}\n.tl-icon-youtube-logo:after {\n\tcontent: \"\\e651\";\n}\n.tl-icon-foursquare:after {\n\tcontent: \"\\e652\";\n}\n.tl-icon-camera-retro:after {\n\tcontent: \"\\e653\";\n}\n.tl-icon-doc:after {\n\tcontent: \"\\e654\";\n}\n.tl-icon-weibo:after {\n\tcontent: \"\\e655\";\n}\n.tl-icon-resize-horizontal:after {\n\tcontent: \"\\e656\";\n}\n.tl-icon-resize-vertical:after {\n\tcontent: \"\\e657\";\n}\n.tl-icon-resize-full:after {\n\tcontent: \"\\e658\";\n}\n.tl-icon-resize-small:after {\n\tcontent: \"\\e659\";\n}\n.tl-icon-twitter:after {\n\tcontent: \"\\e62b\";\n}\n.tl-icon-google-plus:after {\n\tcontent: \"\\e62c\";\n}\n.tl-icon-video:after {\n\tcontent: \"\\e62d\";\n}\n.tl-icon-youtube:after {\n\tcontent: \"\\e62d\";\n}\n.tl-icon-plaintext:after {\n\tcontent: \"\\e62e\";\n}\n.tl-icon-storify:after {\n\tcontent: \"\\e62e\";\n}\n.tl-icon-image-v2:after {\n\tcontent: \"\\e62f\";\n}\n.tl-icon-quote-v2:after {\n\tcontent: \"\\e630\";\n}\n.tl-icon-zoom-in:after {\n\tcontent: \"\\e631\";\n}\n.tl-icon-zoom-out:after {\n\tcontent: \"\\e632\";\n}\n.tl-icon-list:after {\n\tcontent: \"\\e633\";\n}\n.tl-icon-music:after {\n\tcontent: \"\\e634\";\n}\n.tl-icon-spotify:after {\n\tcontent: \"\\e634\";\n}\n.tl-icon-location:after {\n\tcontent: \"\\e635\";\n}\n.tl-icon-googlemaps:after {\n\tcontent: \"\\e635\";\n}\n.tl-icon-web:after {\n\tcontent: \"\\e636\";\n}\n.tl-icon-share-v2:after {\n\tcontent: \"\\e637\";\n}\n.tl-icon-soundcloud:after {\n\tcontent: \"\\e639\";\n}\n.tl-icon-video-v2:after {\n\tcontent: \"\\e63a\";\n}\n.tl-icon-dailymotion:after {\n\tcontent: \"\\e63a\";\n}\n.tl-icon-tumblr:after {\n\tcontent: \"\\e63b\";\n}\n.tl-icon-lastfm:after {\n\tcontent: \"\\e63c\";\n}\n.tl-icon-github:after {\n\tcontent: \"\\e63d\";\n}\n.tl-icon-goback:after {\n\tcontent: \"\\e63e\";\n}\n.tl-icon-doc-v2:after {\n\tcontent: \"\\e63f\";\n}\n.tl-icon-googledrive:after {\n\tcontent: \"\\e640\";\n}\n.tl-icon-facebook:after {\n\tcontent: \"\\e641\";\n}\n.tl-icon-flickr:after {\n\tcontent: \"\\e642\";\n}\n.tl-icon-dribbble:after {\n\tcontent: \"\\e643\";\n}\n.tl-icon-image:after {\n\tcontent: \"\\e605\";\n}\n.tl-icon-vimeo:after {\n\tcontent: \"\\e606\";\n}\n.tl-icon-instagram:after {\n\tcontent: \"\\e644\";\n}\n.tl-icon-pinterest:after {\n\tcontent: \"\\e645\";\n}\n.tl-icon-arrow-left:after {\n\tcontent: \"\\e646\";\n}\n.tl-icon-arrow-down:after {\n\tcontent: \"\\e647\";\n}\n.tl-icon-arrow-up:after {\n\tcontent: \"\\e648\";\n}\n.tl-icon-arrow-right:after {\n\tcontent: \"\\e649\";\n}\n.tl-icon-share:after {\n\tcontent: \"\\e64a\";\n}\n.tl-icon-blockquote:after {\n\tcontent: \"\\e64b\";\n}\n.tl-icon-evernote:after {\n\tcontent: \"\\e64c\";\n}\n.tl-icon-mappin:after {\n\tcontent: \"\\e600\";\n}\n.tl-icon-swipe-right:after {\n\tcontent: \"\\e601\";\n}\n.tl-icon-swipe-left:after {\n\tcontent: \"\\e602\";\n}\n.tl-icon-touch-spread:after {\n\tcontent: \"\\e603\";\n}\n.tl-icon-touch-pinch:after {\n\tcontent: \"\\e604\";\n}\n","/* Disable Text selection when dragging\n================================================== */\n.tl-dragging {\n\t-webkit-touch-callout: none;\n\t\n\t.user-select(none);\n}","/* MenuBar \n================================================== */\n\n.tl-menubar {\n\tposition:absolute;\n\t//width:100%;\n\t//height:\t1px;\n\tz-index:11;\n\ttext-align:center;\n\tcolor:#333;\n\t//height:26px;\n\t//background-color:#FFF;\n\t//.box-shadow(0px -3px 6px rgba(0,0,0,.20));\n\toverflow:hidden;\n\t//margin-top:-25px;\n\t//border-top: 1px solid darken(@color-background,10);\n\t//border-bottom: 1px solid darken(@color-background,10);\n\t//border-right: 1px solid darken(@color-background,10);\n\t\n\t//.border-bottom-radius(7px);\n\tborder-bottom-right-radius: 10px;\n\tborder-top-right-radius: 10px;\n\ttop:100%;\n\tleft:50%;\n\tleft:0;\n}\n/* Skinny\n================================================== */\n.tl-skinny {\n\t.tl-menubar {\n\t\t\n\t}\n}\n\n\n\n/* Mobile, iPhone\n================================================== */\n.tl-mobile {\n\t.tl-menubar {\n\t\t\n\t}\n}\n\n/* Mobile, iPhone and skinny\n================================================== */\n.tl-mobile.tl-skinny {\n\t.tl-menubar {\n\t\t\n\t}\n}\n\n\n/* Color\n================================================== */\n\n// Inverted\n/*\n.tl-sizebar.tl-sizebar-inverted {\n\tborder-bottom: 1px solid #FFF;\n\t//background-color:#000;\n\tcolor:#a5a5a5;\n\t.tl-sizebar-button {\n\t\tborder-left: 1px solid darken(@color-background, 70);\n\t\t//color:#a5a5a5;\n\t}\n\t.tl-sizebar-button:hover {\n\t\t//background:@color-theme;\n\t\tcolor:@color-background;\n\t}\n}\n.tl-sizebar.tl-sizebar-inverted:before {\n\tbackground-color:#000;\n\t//.gradient-vertical (rgba(0,0,0,0.25), rgba(0,0,0,1));\n\t//.translucent-background(rgb(0,0,0), .5);\n\tborder-top: 2px solid #000;\n\tanimation: invertToBlack 1s;\n\t-webkit-animation:invertToBlack 1s; \n}\n*/\n\n@keyframes invertToBlack {\n\tfrom {\n\t\tbackground-color:#FFF;\n\t}\n\tto {\n\t\tbackground-color:#000;\n\t}\n}\n@-webkit-keyframes invertToBlack {\n\tfrom {background:#FFF;}\n\tto {background:#000;}\n}\n@keyframes invertToWhite {\n\tfrom {background-color:#000;}\n\tto {background-color:#FFF;}\n}\n@-webkit-keyframes invertToWhite{\n\tfrom {background:#000;}\n\tto {background:#FFF;}\n}\n\n\n","/* MenuBar Button\n================================================== */\n\n.tl-menubar-button {\n\t//border-left: 1px solid darken(@color-background,10);\n\tfont-size: 18px;\n\tline-height:18px;\n\t//padding: 6px 12px 6px 12px;\n\t//padding:12px;\n\tbackground-color:fadeout(@ui-background-color, 10%);\n\tcursor:pointer;\n\tpadding: 6px 12px 6px 12px;\n\tdisplay:inline-block;\n\tdisplay:block;\n\t//color:@color-text;\n\tcolor:darken(@marker-color,15);\n\t[class^=\"tl-icon-\"], [class*=\" tl-icon-\"] {\n\t\t\n\t}\n\t\n\t&.tl-menubar-button-inactive {\n\t\topacity:0.33;\n\t}\n\t&:hover {\n\t\tbackground:@color-foreground;\n\t\tcolor:@color-background;\n\t\t&.tl-menubar-button-inactive {\n\t\t\tcolor:darken(@marker-color,15);\n\t\t\tbackground-color:fadeout(@ui-background-color, 10%);\n\t\t}\n\t}\n}\n\n.tl-mobile {\n\t.tl-menubar-button {\n\t\tdisplay:block;\n\t\t&:hover {\n\t\t\t//background-color:#FFF;\n\t\t\tbackground-color:fadeout(@ui-background-color, 33%);\n\t\t\tcolor:@color-text;\n\t\t}\n\t\t&:active {\n\t\t\tbackground:@color-theme;\n\t\t\tcolor:@color-background;\n\t\t}\n\t}\n}\n\n\n@keyframes invertToBlack {\n\tfrom {\n\t\tbackground-color:#FFF;\n\t}\n\tto {\n\t\tbackground-color:#000;\n\t}\n}\n@-webkit-keyframes invertToBlack {\n\tfrom {background:#FFF;}\n\tto {background:#000;}\n}\n@keyframes invertToWhite {\n\tfrom {background-color:#000;}\n\tto {background-color:#FFF;}\n}\n@-webkit-keyframes invertToWhite{\n\tfrom {background:#000;}\n\tto {background:#FFF;}\n}\n\n\n","/* MESSAGE \n================================================== */\n.tl-message, .tl-message-full {\n\twidth:\t\t\t\t100%;\n\t//max-width: \t\t\t200px;\n\theight:\t\t\t\t100%;\n\tposition: \t\t\tabsolute;\n\t//position: \t\t\trelative;\n\t\n\tdisplay: \t\t\ttable;\n\toverflow: \t\t\thidden;\n\ttop: \t\t\t\t0px;\n\tleft: \t\t\t\t0px;\n\tz-index:\t\t\t99;\n\tmargin:\t\t\t\tauto;\n\ttext-align:\t\t\tcenter;\n\t.tl-message-container {\n\t\tpadding: \t\t\t20px;\n\t\tmargin:20px;\n\t\ttext-align:\t\t\tcenter;\n\t\tvertical-align: \tmiddle;\n\t\tdisplay:table-cell;\n\n\t\t.tl-message-content {\n\t\t\tcolor:#666;\n\t\t\ttext-align: center;\n\t\t\tfont-size: 11px;\n\t\t\tline-height: 13px;\n\t\t\ttext-transform: uppercase;\n\t\t\tmargin-top: 7.5px;\n\t\t\tmargin-bottom: 7.5px;\n\t\t\ttext-shadow: 1px 1px 1px #FFF;\n\t\t\t\n\t\t\tstrong {\n\t\t\t\ttext-transform: uppercase;\n\t\t\t}\n\t\t}\n\t\t.tl-loading-icon {\n\t\t\twidth: 30px;\n\t\t\theight: 30px;\n\t\t\tbackground-color: #666;\n\t\t\tvertical-align: middle;\n\t\t\t.box-shadow(inset 0 1px 2px rgba(255,255,255,.1));\n\t\t\tmargin-left: auto;\n\t\t\tmargin-right: auto;\n\t\t\ttext-align: center;\n\t\t //margin: 100px auto;\n\t\t\t-webkit-animation: rotateplane 1.2s infinite ease-in-out;\n\t\t\tanimation: rotateplane 1.2s infinite ease-in-out;\n\t\t}\n\n\t\t@-webkit-keyframes rotateplane {\n\t\t\t0% { -webkit-transform: perspective(120px) }\n\t\t\t50% { -webkit-transform: perspective(120px) rotateY(180deg) }\n\t\t\t100% { -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg) }\n\t\t}\n\n\t\t@keyframes rotateplane {\n\t\t\t0% { transform: perspective(120px) rotateX(0deg) rotateY(0deg) }\n\t\t\t50% { transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg) }\n\t\t\t100% { transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg) }\n\t\t}\n\t}\n}\n.tl-message-full {\n\t.translucent-background(#FFF, 0.80);\n\t[class^=\"tl-icon-\"], [class*=\" tl-icon-\"] {\n\t\t//width: 48px;\n\t\t//height: 48px;\n\t\tcolor:#666;\n\t\tfont-size:72px;\n\t}\n\t.tl-message-container {\n\t\t.tl-message-content {\n\t\t\tfont-size: 22px;\n\t\t\tline-height: 22px;\n\t\t\ttext-shadow: none;\n\t\t\tcolor:#666;\n\t\t\ttext-transform: none;\n\t\t\tfont-weight: normal;\n\t\t\t.tl-button {\n\t\t\t\tdisplay:inline-block;\n\t\t\t\tcursor:pointer;\n\t\t\t\tbackground-color:#FFF;\n\t\t\t\tcolor:#333;\n\t\t\t\tpadding:10px;\n\t\t\t\tmargin-top:10px;\n\t\t\t\t.border-radius(7px)\n\t\t\t}\n\t\t}\n\t}\n\n}\n.tl-message {\n\t\n}","/* TL.TimeNav\n================================================== */\n\n.tl-timenav {\n\t//height:200px;\n\twidth:100%;\n\tbackground-color:@ui-background-color;\n\tposition:relative;\n\toverflow:hidden;\n\t//border-top: 2px solid @ui-background-color;\n\tborder-top: 1px solid darken(@ui-background-color,5);\n\t//border-top: 1px solid #e3e3e3;\n\t//box-shadow: inset 10px 10px 5px 0px rgba(0,0,0,0.75);\n\t//.box-shadow(inset -7px 0px 7px rgba(0,0,0,.30));\n\t\n\t.tl-attribution {\n\t\tcursor: pointer;\n\t\tz-index:9;\n\t\tposition:absolute;\n\t\tbottom:2px;\n\t\tleft:0px;\n\t\tfont-size:10px;\n\t\tline-height:10px;\n\t\tfont-family:@font-sanserif !important;\n\t\t//height:100%;\n\t\t//background-color: @color-background;\n\t\tbackground-color: fadeout(@color-background, 15%);\n\t\tpadding:3px;\n\t\t\n\t\t/*\n\t\tright:-26px;\n\t\ttop:30px;\n\t\ttransform: rotate(90deg);\n\t\t-ms-transform: rotate(90deg);\n\t\t-webkit-transform: rotate(90deg);\n\t\tbackground-color: fadeout(@ui-background-color, 15%);\n\t\t*/\n\t\ta {\n\t\t\t\n\t\t\tcolor:@brand-color;\n\t\t\t//margin-left:10px;\n\t\t\t&:hover {\n\t\t\t\tcolor:@color-dark;\n\t\t\t\ttext-decoration: none;\n\t\t\t\t.tl-knightlab-logo {\n\t\t\t\t\tbackground-color: #c34528;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t.tl-knightlab-logo {\n\t\t\tdisplay: inline-block;\n\t\t\tvertical-align: middle;\n\t\t\theight: 8px;\n\t\t\twidth: 8px;\n\t\t\tmargin-right:3px;\n\t\t\tbackground-color: #c34528;\n\t\t\tbackground-color:@brand-color;\n\t\t\ttransform: rotate(45deg);\n\t\t\t-ms-transform: rotate(45deg);\n\t\t\t-webkit-transform: rotate(45deg);\n\t\t}\n\t\t\n\t}\n\t.tl-timenav-line {\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tleft: 50%;\n\t\twidth: 1px;\n\t\theight: 100%;\n\t\tbackground-color: darken(@ui-background-color, 10);//@color-theme;//darken(@ui-background-color, 10);\n\t\tz-index: 2;\n\t\tdisplay:none;\n\t\t//box-shadow: 1px 1px 7px rgba(0,0,0,0.3);\n\t\t&:before, &:after {\n\t\t\tfont-family: 'tl-icons';\n\t\t\tspeak: none;\n\t\t\tfont-style: normal;\n\t\t\tfont-weight: normal;\n\t\t\tfont-variant: normal;\n\t\t\ttext-transform: none;\n\t\t\tline-height: 1;\n\t\t\t\n\t\t\t/* Better Font Rendering =========== */\n\t\t\t-webkit-font-smoothing: antialiased;\n\t\t\t-moz-osx-font-smoothing: grayscale;\n\t\t\t\n\t\t\tcolor:@color-theme;\n\t\t\tfont-size:32px;\n\t\t\tline-height:32px;\n\t\t\tposition: absolute;\n\t\t\tleft:-14px;\n\t\t}\n\t\t&:before {\n\t\t\t//content: \"\\e647\";\n\t\t\ttop: -10px;\n\t\t}\n\t\t&:after {\n\t\t\tcontent: \"\\e648\";\n\t\t\tbottom:24px;\n\t\t}\n\t}\n\t.tl-timenav-slider {\n\t\tposition:absolute;\n\t\theight:100%;\n\t\twidth:100%;\n\t\ttop:0;\n\t\t\n\t\t&.tl-timenav-slider-animate {\n\t\t\t\n\t\t\t.property-animation(all, @animation-duration, @animation-ease);\n\t\t\t.animation-timing-cubic-bezier();\n\t\t}\n\t\t.tl-timenav-slider-background {\n\t\t\tposition:absolute;\n\t\t\theight:100%;\n\t\t\twidth:100%;\n\t\t\tcursor:move;\n\t\t\tz-index:6;\n\t\t}\n\t\t.tl-timenav-container-mask {\n\t\t\tposition:absolute;\n\t\t\theight:100%;\n\t\t\ttop:0;\n\t\t\t.tl-timenav-container {\n\t\t\t\tposition:absolute;\n\t\t\t\theight:100%;\n\n\t\t\t\n\t\t\t\t.tl-timenav-item-container {\n\t\t\t\t\t//margin-top:5px;\n\t\t\t\t\tposition:absolute;\n\t\t\t\t\theight:100%;\n\t\t\t\t}\n\t\t\t\n\t\t\t}\n\t\t\n\t\t}\n\t}\n\t\n\t\n}\n\n/* Skinny\n================================================== */\n.tl-skinny {\n\t.tl-timenav {\n\n\t}\n}\n\n/* Mobile, iPhone\n================================================== */\n.tl-mobile {\n\t.tl-timenav {\n\n\t}\n}\n\n/* Mobile, iPhone and skinny\n================================================== */\n.tl-mobile.tl-skinny {\n\t.tl-timenav {\n\n\t}\n}","/* TL.TimeMarker\n================================================== */\n\n.tl-timemarker {\n\theight:100%;\n\tposition:absolute;\n\ttop:0;\n\tleft:0;\n\tcursor:pointer;\n\t\n\t/* Animate Left Width and Top\n\t================================================== */\n\t.property-animation(left, @animation-duration, @animation-ease);\n\t.property-animation(top, @animation-duration-fast, @animation-ease);\n\t.property-animation(height, @animation-duration-fast, @animation-ease);\n\t.property-animation(width, @animation-duration, @animation-ease);\n\t.animation-timing-cubic-bezier();\n\t\n\n\t&.tl-timemarker-fast {\n\t\t.property-animation(top, @animation-duration-fast, @animation-ease);\n\t\t.property-animation(height, @animation-duration-fast, @animation-ease);\n\t\t.property-animation(width, @animation-duration-fast, @animation-ease);\n\t\t.animation-timing-cubic-bezier();\n\n\t\t.tl-timemarker-content-container {\n\t\t\t.property-animation(width, @animation-duration-fast, @animation-ease);\n\t\t\t.property-animation(height, @animation-duration-fast, @animation-ease);\n\t\t}\n\t\t.tl-timemarker-timespan {\n\t\t\t.property-animation(height, @animation-duration-fast, @animation-ease);\n\t\t\t.property-animation(width, @animation-duration-fast, @animation-ease);\n\t\t}\n\t}\n\t/* Timespan\n\t================================================== */\n\t.tl-timemarker-timespan {\n\t\tpointer-events: none;\n\t\tposition:absolute;\n\t\tmargin:0;\n\t\twidth:100%;\n\t\theight:100%;\n\t\t//overflow:hidden;\n\t\tbackground-color: fadeout(@marker-color, 85%);\n\t\tborder-top-right-radius:@time-marker-border-radius;\n\t\tborder-top-left-radius:@time-marker-border-radius;\n\t\t\n\t\t.property-animation(height, @animation-duration-fast, @animation-ease);\n\t\t.property-animation(width, @animation-duration, @animation-ease);\n\t\t.animation-timing-cubic-bezier();\n\t\t//box-shadow: 1px 1px 1px @color-background;\n\t\t//box-sizing: border-box;\n\t\t.tl-timemarker-timespan-content {\n\t\t\tdisplay:none;\n\t\t\tposition:absolute;\n\t\t\twidth:100%;\n\t\t\tbackground-color: @marker-color;\n\t\t\tborder-top-left-radius:@time-marker-border-radius;\n\t\t\tborder-top-right-radius:@time-marker-border-radius;\n\t\t\theight:100px;\n\t\t\tbox-sizing: border-box;\n\t\t\t\n\t\t\t\n\t\t}\n\t\t\n\t}\n\t\n\t/* Lines\n\t================================================== */\n\t.tl-timemarker-line-right {\n\t\tdisplay:none;\n\t\tright:0px;\n\t\t\n\t}\n\t\n\t.tl-timemarker-line-left {\n\t\twidth:1px;\n\t\tleft:0px;\n\t}\n\t\n\t.tl-timemarker-line-left, .tl-timemarker-line-right {\n\t\tmargin-top:@marker-dot-offset;\n\t\t//margin-bottom:@time-marker-border-radius;\n\t\t//margin-top:10px; \n\t\t//overflow:hidden;\n\t\t//border-top-right-radius:@time-marker-border-radius;\n\t\t//border-top-left-radius:@time-marker-border-radius;\n\t\t//margin-top:10%;\n\t\t.border-box();\n\t\tborder-left: 1px solid @marker-outline-color;\n\t\t\n\t\tz-index:5;\n\t\t//.border-top-radius(10px);\n\t\tcontent:\" \";\n\t\tposition:absolute;\n\t\t//bottom:0;\n\t\theight:100%;\n\t\t.disable-selection();\n\t\t\n\t\tbox-shadow: 1px 1px 1px @color-background;\n\t\t\n\t\t&:after {\n\t\t\t\n\t\t\tdisplay:block;\n\t\t\tcontent:\" \";\n\t\t\tposition:absolute;\n\t\t\tleft:-4px;\n\t\t\tbottom:0px;\n\t\t\theight:6px;\n\t\t\twidth:6px;\n\t\t\tbackground-color:@marker-dot-color;\n\t\t\tz-index:8;\n\t\t\t.border-radius(50%);\n\t\t}\n\t}\n\t\n\t/* Content\n\t================================================== */\n\t.tl-timemarker-content-container {\n\t\tposition:absolute;\n\t\tbackground-color: @marker-color;\n\t\tborder:0;\n\t\tborder-top-left-radius:@time-marker-border-radius;\n\t\tborder-top-right-radius:@time-marker-border-radius;\n\t\tborder-bottom-right-radius:@time-marker-border-radius;\n\t\theight:100%;\n\t\twidth:100px;\n\t\toverflow:hidden;\n\t\tz-index:6;\n\t\t&:hover {\n\t\t\tz-index: 9;\n\t\t}\n\t\t.property-animation(height, @animation-duration-fast, @animation-ease);\n\t\t.property-animation(width, @animation-duration, @animation-ease);\n\t\t.animation-timing-cubic-bezier();\n\t\tbox-sizing: border-box;\n\t\tborder: 1px solid @marker-outline-color;\n\t\tbox-shadow: 1px 1px 1px @color-background;\n\t\t\t\t\n\t\t.tl-timemarker-content {\n\t\t\tposition:relative;\n\t\t\toverflow:hidden;\n\t\t\theight:100%;\n\t\t\tz-index:8;\n\t\t\tpadding:5px;\n\t\t\t.border-box();\n\t\t\t\n\t\t\t.tl-timemarker-text {\n\t\t\t\toverflow:hidden;\n\t\t\t\tposition: relative;\n\t\t\t\t\n\t\t\t\th2.tl-headline, h2.tl-headline p {\n\t\t\t\t\tdisplay: -webkit-box;\n\t\t\t\t\t\n\t\t\t\t\tline-clamp: 2;\n\t\t\t\t\t-webkit-line-clamp: 2;\n\t\t\t\t\tbox-orient: vertical;\n\t\t\t\t\t-webkit-box-orient: vertical;\n\t\t\t\t\ttext-overflow: ellipsis;\n\t\t\t\t\t\n\t\t\t\t\tfont-size:12px;\n\t\t\t\t\tline-height:12px;\n\t\t\t\t\theight:100%;\n\t\t\t\t\toverflow:hidden;\n\t\t\t\t\tfont-weight:normal;\n\t\t\t\t\tmargin:0;\n\t\t\t\t\tcolor:@marker-text-color;\n\t\t\t\t\tposition: relative;\n\t\t\t\t\t&.tl-headline-fadeout {\n\t\t\t\t\t\t&:after {\n\t\t\t\t\t\t\tcontent: \"\";\n\t\t\t\t\t\t\ttext-align: right;\n\t\t\t\t\t\t\tposition: absolute;\n\t\t\t\t\t\t\tbottom: 0;\n\t\t\t\t\t\t\tright: 0;\n\t\t\t\t\t\t\twidth: 100%;\n\t\t\t\t\t\t\theight: 50%;\n\t\t\t\t\t\t\t.marker-text-fade(@marker-color,50%);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t\n\t\t\t\t}\n\t\t\t\t\n\t\t\t}\n\t\t\t\n\t\t\t.tl-timemarker-media-container {\n\t\t\t\tfloat:left;\n\t\t\t\tmax-width:@marker-icon-size;\n\t\t\t\tmax-height:@marker-icon-size;\n\t\t\t\toverflow:hidden;\n\t\t\t\tmargin-right:5px;\n\t\t\t\theight:100%;\n\t\t\t\t.border-box();\n\t\t\t\t\n\t\t\t\t.tl-timemarker-media {\n\t\t\t\t\tmax-width:@marker-icon-size;\n\t\t\t\t\tmax-height:100%;\n\t\t\t\t\topacity:0.25;\n\t\t\t\t}\n\t\t\t\t\n\t\t\t\t[class^=\"tl-icon-\"], [class*=\" tl-icon-\"] {\n\t\t\t\t\tdisplay:block;\n\t\t\t\t\tfont-size:@marker-icon-size;\n\t\t\t\t\tcolor:@marker-text-color;\n\t\t\t\t\tmargin-top:0px;\n\t\t\t\t}\n\t\t\t\t\n\t\t\t\t.tl-icon-wikipedia {\n\t\t\t\t\tfont-size:16px;\n\t\t\t\t}\n\t\t\t\t\n\t\t\t}\n\t\t\t\n\t\t\t&.tl-timemarker-content-small {\n\t\t\t\t.tl-timemarker-text {\n\t\t\t\t\th2.tl-headline {\n\t\t\t\t\t\tdisplay:block;\n\t\t\t\t\t\twhite-space:nowrap; \n\t\t\t\t\t\ttext-overflow: ellipsis;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t.tl-timemarker-media-container {\n\t\t\t\t\t[class^=\"tl-icon-\"], [class*=\" tl-icon-\"] {\n\t\t\t\t\t\tfont-size:@marker-icon-size/2;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t\n\t\t\t}\n\t\t\t\n\t\t}\n\t\t\n\n\t\t\n\t}\n\t\n\t/* Hover State\n\t================================================== */\n\t&:hover {\n\t\t\n\t\t.tl-timemarker-timespan {\n\t\t\tbackground-color: fadeout(@marker-text-color, 85%);\n\t\t\t\n\t\t\t.tl-timemarker-timespan-content {\n\t\t\t\tbackground-color: @marker-text-color;\n\t\t\t}\n\t\t\t\n\t\t\t.tl-timemarker-line-left, .tl-timemarker-line-right {\n\t\t\t\tborder-color: darken(@marker-color,25);\n\t\t\t\t&:after {\n\t\t\t\t\tbackground-color:@marker-dot-hover-color;\n\t\t\t\t}\n\t\t\t}\n\t\t\t\n\n\t\t\t\n\t\t}\n\t\t\n\t\t.tl-timemarker-content-container {\n\t\t\tbackground-color: darken(@marker-color,15);\n\t\t\tborder-color: darken(@marker-color,25);\n\t\t\t.property-animation(height, @animation-duration-fast/2, @animation-ease);\n\t\t\t.property-animation(width, @animation-duration-fast/2, @animation-ease);\n\t\t\t&.tl-timemarker-content-container-small {\n\t\t\t\t//height:56px !important;\n\t\t\t\twidth:200px;\n\t\t\t\t//min-width:100px;\n\t\t\t\t.tl-timemarker-content {\n\t\t\t\t\t.tl-timemarker-text {\n\t\t\t\t\t\th2.tl-headline {\n\t\t\t\t\t\t\t//line-clamp:3 !important;\n\t\t\t\t\t\t\t//-webkit-line-clamp:3 !important;\n\t\t\t\t\t\t\t//white-space: normal !important;\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t\t\n\t\t\t.tl-timemarker-content {\n\t\t\t\t\n\t\t\t\t.tl-timemarker-text {\n\t\t\t\t\th2.tl-headline {\n\t\t\t\t\t\tcolor:@marker-selected-text-color;\n\t\t\t\t\t\t&.tl-headline-fadeout {\n\t\t\t\t\t\t\t&:after {\n\t\t\t\t\t\t\t\t.marker-text-fade(darken(@marker-color,15),80%);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t\n\t\t\t\t.tl-timemarker-media-container {\n\t\t\t\t\t.tl-timemarker-media {\n\t\t\t\t\t\topacity:1;\n\t\t\t\t\t}\n\t\t\t\t\t[class^=\"tl-icon-\"], [class*=\" tl-icon-\"] {\n\t\t\t\t\t\tcolor:@marker-selected-text-color;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t\n\t}\n\t\n\t/* Hover Active State\n\t================================================== */\n\t&:hover {\n\t\t&.tl-timemarker-active {\n\t\t\t.tl-timemarker-content-container {\n\t\t\t\t.tl-timemarker-content {\n\t\t\t\t\t.tl-timemarker-text {\n\t\t\t\t\t\th2.tl-headline {\n\t\t\t\t\t\t\t&.tl-headline-fadeout {\n\t\t\t\t\t\t\t\t&:after {\n\t\t\t\t\t\t\t\t\t//.marker-text-fade(@color-theme,80%);\n\t\t\t\t\t\t\t\t\t.marker-text-fade(@color-background,80%);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t\t.tl-timemarker-line-left, .tl-timemarker-line-right {\n\t\t\t\t//border-color:@color-theme;\n\t\t\t\tborder-color:@color-dark;\n\t\t\t\n\t\t\t\t&:after {\n\t\t\t\t\t//z-index:6;\n\t\t\t\t\t//background-color:@color-theme;\n\t\t\t\t\tbackground-color:@color-dark;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\t\n\t/* Active Markers\n\t================================================== */\n\t&.tl-timemarker-active {\n\t\t\n\t\t.tl-timemarker-timespan {\n\t\t\t//background-color: fadeout(@color-theme, 85%);\n\t\t\t//background-color: fadeout(@color-foreground, 85%);\n\t\t\tbackground-color: fadeout(@color-background,50%);\n\t\t\tz-index: 8;\n\t\t\t.tl-timemarker-timespan-content {\n\t\t\t\t//background-color: @color-theme;\n\t\t\t\tbackground-color: @color-foreground;\n\t\t\t}\n\t\t}\n\t\t\n\t\t.tl-timemarker-line-left, .tl-timemarker-line-right {\n\t\t\t//border-color:@color-theme;\n\t\t\t//border-color:@color-foreground;\n\t\t\tborder-color:fadeout(@color-foreground, 50%);\n\t\t\tborder-width: 1px;\n\t\t\tz-index:8;\n\t\t\tbox-shadow: 0px 1px 3px fadeout(@marker-dot-color, 50%);\n\t\t\t&:after {\n\t\t\t\t\n\t\t\t\t//background-color:@color-theme;\n\t\t\t\tbackground-color:@color-foreground;\n\t\t\t}\n\t\t}\n\t\t\n\t\t.tl-timemarker-content-container {\n\t\t\t//background-color:@color-theme;\n\t\t\tbackground-color:@color-background;\n\t\t\t//color:@color-background;\n\t\t\tcolor:@color-foreground;\n\t\t\tz-index:9;\n\t\t\t//border: none;\n\t\t\tborder-color:fadeout(@color-foreground, 50%);\n\t\t\t\n\t\t\t//box-shadow:none;\n\t\t\tbox-shadow: 1px 1px 3px fadeout(@marker-dot-color, 50%);\n\t\t\t.tl-timemarker-content {\n\t\t\t\t.tl-timemarker-text {\n\t\t\t\t\th2.tl-headline {\n\t\t\t\t\t\t//color:@marker-selected-text-color;\n\t\t\t\t\t\tcolor:@color-foreground; \n\t\t\t\t\t\t&.tl-headline-fadeout {\n\t\t\t\t\t\t\t&:after {\n\t\t\t\t\t\t\t\t//.marker-text-fade(@color-theme,80%);\n\t\t\t\t\t\t\t\t.marker-text-fade(@color-background,80%);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t\t\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t\n\t\t\t\t.tl-timemarker-media-container {\n\t\t\t\t\t.tl-timemarker-media {\n\t\t\t\t\t\topacity:1;\n\t\t\t\t\t}\n\t\t\t\t\t[class^=\"tl-icon-\"], [class*=\" tl-icon-\"] {\n\t\t\t\t\t\t//color:lighten(@color-theme,33);\n\t\t\t\t\t\tcolor:@color-foreground;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\t\n\t/* Markers with End Dates\n\t================================================== */\n\t&.tl-timemarker-with-end {\n\t\t\n\t\t.tl-timemarker-timespan {\n\t\t\t.tl-timemarker-timespan-content {\n\t\t\t\tdisplay:block;\n\t\t\t}\n\t\t\t\n\t\t\t.tl-timemarker-line-left, .tl-timemarker-line-right {\n\t\t\t\tz-index:5;\n\t\t\t\t&:after {\n\t\t\t\t\t\n\t\t\t\t}\n\t\t\t}\n\t\t\t\n\t\t\t&:after {\n\t\t\t\tdisplay:block;\n\t\t\t\tcontent:\" \";\n\t\t\t\tposition:absolute;\n\t\t\t\tleft:0px;\n\t\t\t\tbottom:-@marker-dot-offset;\n\t\t\t\theight:6px;\n\t\t\t\twidth:100%;\n\t\t\t\tbackground-color: fadeout(darken(@ui-background-color, 50), 85%);\n\t\t\t\tz-index:6;\n\t\t\t\t.border-radius(7px);\n\t\t\t}\n\t\t\t\n\t\t}\n\t\t\n\t\t.tl-timemarker-content-container {\n\t\t\t\n\t\t\t&.tl-timemarker-content-container-long {\n\t\t\t\tbox-shadow: none;\n\t\t\t}\n\t\t\t.tl-timemarker-content {\n\t\t\t\t\n\t\t\t}\n\t\t}\n\t\t\n\t\t.tl-timemarker-line-right {\n\t\t\tdisplay:block;\n\t\t}\n\t\t.tl-timemarker-line-left {\n\t\t\tbox-shadow: none;\n\t\t}\n\t\t\n\t\t.tl-timemarker-line-left, .tl-timemarker-line-right {\n\t\t\t\n\t\t}\n\t}\n\t\n\t/* Markers with End Dates and Hover\n\t================================================== */\n\t&.tl-timemarker-with-end {\n\t\t&:hover {\n\t\t\t\n\t\t\t.tl-timemarker-timespan {\n\t\t\t\t&:after {\n\t\t\t\t\tbackground-color: fadeout(darken(@ui-background-color,100),75%);\n\t\t\t\t}\n\t\t\t}\n\t\t\t.tl-timemarker-line-left, .tl-timemarker-line-right {\n\t\t\t\t&:after {\n\t\t\t\t\t\n\t\t\t\t}\n\t\t\t}\n\t\t\t\n\t\t}\n\t}\n\t\n\t/* Markers with End Dates and Active\n\t================================================== */\n\t&.tl-timemarker-with-end {\n\t\t&.tl-timemarker-active {\n\t\t\t.tl-timemarker-timespan {\n\t\t\t\t&:after {\n\t\t\t\t\t//background-color: fadeout(@color-theme,50%);\n\t\t\t\t\tbackground-color: fadeout(@color-foreground,50%);\n\t\t\t\t}\n\t\t\t}\n\t\t\t\n\t\t\t.tl-timemarker-line-left, .tl-timemarker-line-right {\n\t\t\t\tborder-width: 1px;\n\t\t\t\t&:after {\n\t\t\t\t\t//background-color:@color-theme !important;\n\t\t\t\t\tbackground-color:@color-foreground !important;\n\t\t\t\t}\n\t\t\t}\n\t\t\t.tl-timemarker-line-left {\n\t\t\t\tbox-shadow: none;\n\t\t\t}\n\t\t}\n\t}\n\t\n\t/* Markers with End Dates and Active and Hover\n\t================================================== */\n\t&.tl-timemarker-with-end {\n\t\t&.tl-timemarker-active {\n\t\t\t&:hover {\n\t\t\t\t.tl-timemarker-timespan {\n\t\t\t\t\t&:after {\n\t\t\t\t\t\t//background-color: fadeout(@color-theme,50%);\n\t\t\t\t\t\tbackground-color: fadeout(@color-foreground,50%);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\n\t\t\t}\n\t\t}\n\t}\n}\n\n/* Skinny\n================================================== */\n.tl-skinny {\n\t.tl-timemarker {\n\n\t}\n}\n\n/* Mobile, iPhone\n================================================== */\n.tl-mobile {\n\t.tl-timemarker {\n\n\t}\n}\n\n/* Mobile, iPhone and skinny\n================================================== */\n.tl-mobile.tl-skinny {\n\t.tl-timemarker {\n\n\t}\n}\n","/* TL.TimeMarker\n================================================== */\n\n.tl-timeera {\n\theight:100%;\n\theight:40px;\n\tposition:absolute;\n\tbottom:0;\n\tleft:0;\n\tpointer-events: none;\n\tz-index:3;\n\t/* Animate Left Width and Top\n\t================================================== */\n\t.property-animation(left, @animation-duration, @animation-ease);\n\t.property-animation(top, @animation-duration-fast, @animation-ease);\n\t.property-animation(height, @animation-duration-fast, @animation-ease);\n\t.property-animation(width, @animation-duration, @animation-ease);\n\t.animation-timing-cubic-bezier();\n\t\n\n\t&.tl-timeera-fast {\n\t\t.property-animation(top, @animation-duration-fast, @animation-ease);\n\t\t.property-animation(height, @animation-duration-fast, @animation-ease);\n\t\t.property-animation(width, @animation-duration-fast, @animation-ease);\n\t\t.animation-timing-cubic-bezier();\n\t}\n\t/* Timespan\n\t================================================== */\n\n\t.tl-timeera-background {\n\t\tposition:absolute;\n\t\tbackground-color: @era-color-1;\n\t\twidth:100%;\n\t\theight:100%;\n\t\topacity:1;\n\t}\n\n\t&.tl-timeera-color0 {\n\t\t.tl-timeera-background {\n\t\t\tbackground-color: @era-color-0;\n\t\t}\n\t}\n\t&.tl-timeera-color1 {\n\t\t.tl-timeera-background {\n\t\t\tbackground-color: @era-color-1;\n\t\t}\n\t}\n\t&.tl-timeera-color2 {\n\t\t.tl-timeera-background {\n\t\t\tbackground-color: @era-color-2;\n\t\t}\n\t}\n\t&.tl-timeera-color3 {\n\t\t.tl-timeera-background {\n\t\t\tbackground-color: @era-color-3;\n\t\t}\n\t}\n\t&.tl-timeera-color4 {\n\t\t.tl-timeera-background {\n\t\t\tbackground-color: @era-color-4;\n\t\t}\n\t}\n\t&.tl-timeera-color5 {\n\t\t.tl-timeera-background {\n\t\t\tbackground-color: @era-color-5;\n\t\t}\n\t}\n\t/* Content\n\t================================================== */\n\t.tl-timeera-content-container {\n\t\tposition:absolute;\n\t\t// background-color: @era-color-1;\n\t\tborder:0;\n\t\tborder-top-left-radius:@time-marker-border-radius;\n\t\tborder-top-right-radius:@time-marker-border-radius;\n\t\tborder-bottom-right-radius:@time-marker-border-radius;\n\t\theight:100%;\n\t\twidth:100px;\n\t\toverflow:hidden;\n\t\t// z-index:6;\n\n\t\t.property-animation(height, @animation-duration-fast, @animation-ease);\n\t\t.property-animation(width, @animation-duration, @animation-ease);\n\t\t.animation-timing-cubic-bezier();\n\t\tbox-sizing: border-box;\n\t\tborder: 1px solid @marker-outline-color;\n\t\t// box-shadow: 1px 1px 1px @color-background;\n\t\t\t\t\n\t\t.tl-timeera-content {\n\t\t\tposition:relative;\n\t\t\toverflow:hidden;\n\t\t\theight:100%;\n\t\t\t// z-index:8;\n\t\t\tpadding:5px;\n\t\t\t.border-box();\n\t\t\t\n\t\t\t.tl-timeera-text {\n\t\t\t\toverflow:hidden;\n\t\t\t\tposition: relative;\n\t\t\t\t\n\t\t\t\theight:100%;\n\t\t\t\t\n\t\t\t\th2.tl-headline {\n\t\t\t\t\tbottom:0px;\n\t\t\t\t\tposition: absolute;\n\t\t\t\t\tdisplay: -webkit-box;\n\t\t\t\t\t\n\t\t\t\t\tline-clamp: 4;\n\t\t\t\t\t-webkit-line-clamp: 4;\n\t\t\t\t\tbox-orient: vertical;\n\t\t\t\t\t-webkit-box-orient: vertical;\n\t\t\t\t\ttext-overflow: ellipsis;\n\t\t\t\t\t\n\t\t\t\t\tfont-size:10px;\n\t\t\t\t\tline-height:10px;\n\t\t\t\t\t// height:100%;\n\t\t\t\t\toverflow:hidden;\n\t\t\t\t\tfont-weight:normal;\n\t\t\t\t\tmargin:0;\n\t\t\t\t\tcolor:@color-background;\n\t\t\t\t\tmargin-left:10px;\n\t\t\t\t\t\n\t\t\t\t\t&.tl-headline-fadeout {\n\t\t\t\t\t\t&:after {\n\t\t\t\t\t\t\tcontent: \"\";\n\t\t\t\t\t\t\ttext-align: right;\n\t\t\t\t\t\t\tposition: absolute;\n\t\t\t\t\t\t\tbottom: 0;\n\t\t\t\t\t\t\tright: 0;\n\t\t\t\t\t\t\twidth: 100%;\n\t\t\t\t\t\t\theight: 50%;\n\t\t\t\t\t\t\t.marker-text-fade(@marker-color,50%);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t\n\t\t\t\t}\n\t\t\t\t\n\t\t\t}\n\t\t\t\n\t\t}\n\t\t\n\n\t\t\n\t}\n\t\n\n}\n\n/* Skinny\n================================================== */\n.tl-skinny {\n\t.tl-timeera {\n\n\t}\n}\n\n/* Mobile, iPhone\n================================================== */\n.tl-mobile {\n\t.tl-timeera {\n\n\t}\n}\n\n/* Mobile, iPhone and skinny\n================================================== */\n.tl-mobile.tl-skinny {\n\t.tl-timeera {\n\n\t}\n}\n","/* TL.TimeMarker\n================================================== */\n\n.tl-timegroup {\n\t//height:100%;\n\twidth:100%;\n\tposition:absolute;\n\ttop:0;\n\tleft:0;\n\t\n\tbackground-color:@ui-background-color;\n\t\n\tdisplay: -ms-flexbox;\n\tdisplay: -webkit-flex;\n\tdisplay: flex;\n\talign-items: center;\n\t-ms-flex-align: center;\n\t-webkit-align-items: center;\n\t-webkit-box-align: center;\n\t\n\n\t\n\t.tl-timegroup-message {\n\t\t//z-index:6;\n\t\tcolor:darken(@ui-background-color-darker,2);\n\t\ttext-shadow: @color-background 0px 2px 2px;\n\t\tmargin-left:80px;\n\t\t//background-color:@ui-background-color;\n\t\t\n\t}\n\t\n\t&.tl-timegroup-alternate {\n\t\tbackground-color:lighten(@ui-background-color,3);\n\t\t.tl-timegroup-message {\n\t\t\t//background-color:lighten(@ui-background-color,3);\n\t\t}\n\t}\n\t&.tl-timegroup-hidden {\n\t\tdisplay:none;\n\t}\n\t\n\t/* Animate Left Width and Top\n\t================================================== */\n\t.property-animation(left, @animation-duration, @animation-ease);\n\t.property-animation(top, @animation-duration-fast, @animation-ease);\n\t.property-animation(height, @animation-duration-fast, @animation-ease);\n\t.property-animation(width, @animation-duration, @animation-ease);\n\t.animation-timing-cubic-bezier();\n\t\n}\n\n/* Skinny\n================================================== */\n.tl-skinny {\n\t.tl-timegroup {\n\n\t}\n}\n\n/* Mobile, iPhone\n================================================== */\n.tl-mobile {\n\t.tl-timegroup {\n\n\t}\n}\n\n/* Mobile, iPhone and skinny\n================================================== */\n.tl-mobile.tl-skinny {\n\t.tl-timegroup {\n\n\t}\n}\n","/* TL.TimeAxis\n================================================== */\n.tl-timeaxis-background {\n\theight:@axis-height;\n\twidth:100%;\n\tposition:absolute;\n\tbottom:0;\n\tleft:0;\n\tbackground-color:@color-background;\n\tborder-top: 1px solid darken(@ui-background-color,5);\n\tz-index:2;\n}\n.tl-timeaxis {\n\theight:@axis-height;\n\twidth:100%;\n\tposition:absolute;\n\tbottom:0;\n\tleft:0;\n\tz-index:3;\n\n\t.tl-timeaxis-content-container {\n\t\tposition:relative;\n\t\tbottom:0;\n\t\theight:@axis-height;\n\t\t.tl-timeaxis-major, .tl-timeaxis-minor {\n\t\t\topacity:0;\n\t\t\tposition:absolute;\n\n\t\t\t.tl-timeaxis-tick {\n\t\t\t\tposition:absolute;\n\t\t\t\tdisplay:block;\n\t\t\t\ttop:0;\n\t\t\t\tleft:0;\n\t\t\t\ttext-align: center;\n\t\t\t\tfont-weight:normal;\n\t\t\t\t//.property-animation(opacity, @animation-duration, @animation-ease);\n\t\t\t\t//.animation-timing-cubic-bezier();\n\t\t\t\t.tl-timeaxis-tick-text {\n\t\t\t\t\tdisplay:inline-block;\n\t\t\t\t\t//width:100%;\n\t\t\t\t\twhite-space: nowrap;\n\n\t\t\t\t\ttext-overflow: ellipsis;\n\t\t\t\t\toverflow:hidden;\n\t\t\t\t}\n\t\t\t\t&:before {\n\t\t\t\t\tcontent: \"|\";\n\t\t\t\t\tdisplay:block;\n\t\t\t\t\tcolor:@color-background;\n\t\t\t\t\twidth:1px;\n\t\t\t\t\toverflow:hidden;\n\t\t\t\t\tborder-left: 1px solid @minor-ticks-line-color;\n\t\t\t\t\ttext-align:center;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&.tl-timeaxis-animate {\n\t\t\t\t.tl-timeaxis-tick {\n\t\t\t\t\t.property-animation(all, @animation-duration, @animation-ease);\n\t\t\t\t\t.animation-timing-cubic-bezier();\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t&.tl-timeaxis-animate-opacity {\n\t\t\t\t.tl-timeaxis-tick {\n\t\t\t\t\t.property-animation(opacity, @animation-duration, @animation-ease);\n\t\t\t\t\t.animation-timing-cubic-bezier();\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t.tl-timeaxis-major {\n\t\t\tz-index:1;\n\t\t\tbackground-color:@color-background;\n\t\t\t.tl-timeaxis-tick {\n\t\t\t\tfont-size:@major-ticks-font-size;\n\t\t\t\tline-height:@major-ticks-font-size + @tick-padding;\n\t\t\t\tcolor:@major-ticks-color;\n\t\t\t\twidth:@major-ticks-width;\n\t\t\t\tmargin-left:-(@major-ticks-width/2);\n\n\t\t\t\t&:before {\n\t\t\t\t\tborder-color:@major-ticks-line-color;\n\t\t\t\t\t//border-left: 2px solid @major-ticks-line-color;\n\t\t\t\t\tfont-size:@major-ticks-font-size + (@tick-padding*3);\n\t\t\t\t\tline-height:@major-ticks-font-size + (@tick-padding*3);\n\t\t\t\t\tmargin-bottom:@tick-padding;\n\t\t\t\t\tmargin-left:(@major-ticks-width/2);\n\t\t\t\t}\n\n\t\t\t\t.tl-timeaxis-tick-text {\n\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t.tl-timeaxis-minor {\n\n\t\t\t.tl-timeaxis-tick {\n\t\t\t\tfont-size:@minor-ticks-font-size;\n\t\t\t\tline-height:@minor-ticks-font-size + @tick-padding;\n\t\t\t\tcolor:@minor-ticks-color;\n\t\t\t\twidth:@minor-ticks-width;\n\t\t\t\tmargin-left:-(@minor-ticks-width/2);\n\t\t\t\t.tl-timeaxis-tick-text {\n\t\t\t\t\topacity:0;\n\t\t\t\t\twhite-space: normal;\n\t\t\t\t\tpadding-left:2px;\n\t\t\t\t\tpadding-right:2px;\n\t\t\t\t\tspan {\n\t\t\t\t\t\t//display:none;\n\t\t\t\t\t\tdisplay:block;\n\t\t\t\t\t\tfont-size:9px;\n\t\t\t\t\t\tline-height:9px;\n\t\t\t\t\t\tmargin-top:-2px;\n\t\t\t\t\t\tcolor:lighten(@minor-ticks-color,15);\n\t\t\t\t\t\t&.tl-timeaxis-timesuffix {\n\t\t\t\t\t\t\t//display:none;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t&:before {\n\t\t\t\t\tfont-size:@minor-ticks-font-size - @tick-padding;\n\t\t\t\t\tline-height:@minor-ticks-font-size - @tick-padding;\n\t\t\t\t\tmargin-left:(@minor-ticks-width/2);\n\t\t\t\t}\n\n\t\t\t\t&.tl-timeaxis-tick-hidden {\n\t\t\t\t\t.tl-timeaxis-tick-text {\n\t\t\t\t\t\topacity:0 !important;\n\t\t\t\t\t}\n\t\t\t\t\t&:before {\n\t\t\t\t\t\topacity:0.33;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\n\t}\n\n}\n\n/* Skinny\n================================================== */\n.tl-skinny {\n\t.tl-timeaxis {\n\n\t}\n}\n\n/* Mobile, iPhone\n================================================== */\n.tl-mobile {\n\t.tl-timeaxis {\n\n\t}\n}\n\n/* Mobile, iPhone and skinny\n================================================== */\n.tl-mobile.tl-skinny {\n\t.tl-timeaxis {\n\n\t}\n}\n",".tlanimate {\n\t-webkit-transform: translateZ(0);\n\t-webkit-perspective: 1000;\n\t-webkit-backface-visibility: hidden;\n}\n.tl-animate {\n\t.property-animation(all, @animation-duration, @animation-ease);\n\t.animation-timing-cubic-bezier();\n}\n\n.tl-animate-opacity {\n\t.property-animation(opacity, @animation-duration, @animation-ease);\n\t.animation-timing-cubic-bezier();\n}","/* SLIDE\n================================================== */\n.tl-slide {\n\tposition:absolute;\n\twidth:100%;\n\theight:100%;\n\tpadding:0px;\n\tmargin:0px;\n\toverflow-x:hidden;\n\toverflow-y:auto;\n\n\t.tl-slide-background {\n\t\tposition:absolute;\n\t\tleft:0;\n\t\ttop:0;\n\t\twidth:100%;\n\t\theight:100%;\n\t\tz-index:-1;\n\t\toverflow:hidden;\n\t\tdisplay:none;\n\t\t.opacity(50);\n\t\tbackground: no-repeat center center;\n\t\t-webkit-background-size: cover;\n\t\t -moz-background-size: cover;\n\t\t -o-background-size: cover;\n\t\t\t background-size: cover;\n\t}\n\t.tl-slide-scrollable-container {\n\t\tdisplay:table;\n\t\ttable-layout: fixed;\n\t\theight:100%;\n\t\tz-index:1;\n\t}\n\t.tl-slide-content-container {\n\t\tdisplay:table-cell;\n\t\tvertical-align:middle;\n\t\tposition:relative;\n\t\twidth:100%;\n\t\theight:100%;\n\n\t\tz-index:3;\n\t\t.tl-slide-content {\n\t\t\t//width:100%;\n\t\t\tdisplay:table;\n\t\t\tvertical-align:middle;\n\t\t\tpadding-left:100px;\n\t\t\tpadding-right:100px;\n\t\t\tposition:relative;\n\t\t\tmax-width:100%;\n\t\t\tuser-select: text;\n\t\t\t.tl-media {\n\t\t\t\t//display:table-cell;\n\t\t\t\t//vertical-align:middle;\n\t\t\t\tposition:relative;\n\t\t\t\twidth:100%;\n\t\t\t\tmin-width:50%;\n\t\t\t\t//height:100%;\n\t\t\t\tfloat: left;\n\t\t\t\tmargin-top:auto;\n\t\t\t\tmargin-bottom:auto;\n\t\t\t\t//margin-right:auto;\n\t\t\t\timg, embed, object, video, iframe {\n\t\t\t\t\t//width:100%;\n\t\t\t\t}\n\t\t\t}\n\t\t\t.tl-text {\n\t\t\t\twidth:50%;\n\t\t\t\tmax-width:50%;\n\t\t\t\tmin-width:120px;\n\t\t\t\t//height:100%;\n\t\t\t\t//overflow-y:auto;\n\t\t\t\tpadding: 0 20px 0 20px;\n\t\t\t\tdisplay:table-cell;\n\t\t\t\tvertical-align:middle;\n\t\t\t\ttext-align: left;\n\t\t\t\t//float:left;\n\t\t\t}\n\t\t}\n\t}\n\n\t&.tl-slide-titleslide {\n\t\t//background-color:#333;\n\t}\n}\n\n/* Only Media (no text)\n================================================== */\n.tl-slide-media-only {\n\t.tl-slide-content-container {\n\t\t.tl-slide-content {\n\t\t\t//width:100%;\n\t\t\ttext-align:center;\n\t\t\t.tl-media {\n\t\t\t\t//display:table-cell;\n\t\t\t\t//vertical-align:middle;\n\t\t\t\ttext-align:center;\n\t\t\t\tposition:relative;\n\t\t\t\twidth:100%;\n\t\t\t\tmin-width:50%;\n\t\t\t\tmax-width:100%;\n\t\t\t\t//height:100%;\n\t\t\t\tfloat: none;\n\t\t\t\tmargin-top:auto;\n\t\t\t\tmargin-bottom:auto;\n\t\t\t\t//margin-right:auto;\n\t\t\t\timg, embed, object, video, iframe {\n\t\t\t\t\t//width:100%;\n\t\t\t\t}\n\t\t\t}\n\t\t\t.tl-text {\n\t\t\t\twidth:\t\t\t\t100%;\n\t\t\t\tmax-width:\t\t\t100%;\n\t\t\t\tdisplay:\t\t\tblock;\n\t\t\t\tmargin-left:\t\tauto;\n\t\t\t\tmargin-right:\t\tauto;\n\t\t\t\ttext-align: \t\tcenter;\n\t\t\t\th2 {\n\t\t\t\t\t//margin-top: \t20px;\n\t\t\t\t\t//margin-bottom: \t20px;\n\t\t\t\t}\n\t\t\t\t//float:left;\n\t\t\t}\n\t\t}\n\t}\n}\n\n/* Only Text (no media)\n================================================== */\n.tl-slide-text-only {\n\t.tl-slide-content-container {\n\t\t.tl-slide-content {\n\t\t\t//width:100%;\n\t\t\ttext-align:center;\n\t\t\t.tl-text {\n\t\t\t\tmax-width:80%;\n\t\t\t\twidth:80%;\n\t\t\t\tdisplay:block;\n\t\t\t\tmargin-left:auto;\n\t\t\t\tmargin-right:auto;\n\t\t\t\t//float:left;\n\t\t\t}\n\t\t}\n\t}\n}\n/* Background\n================================================== */\n\n\n.tl-slide.tl-full-image-background, .tl-slide.tl-full-color-background {\n\t.slide-text-shadow();\n\n\tp, h1, h2, h3, h4, h5, h6 {\n\t\t.slide-text-shadow();\n\t}\n\ta, b, i, blockquote, blockquote p {\n\t\ttext-shadow: 1px 1px 1px #000;\n\t\tcolor: lighten(@color-theme, 90%);\n\t}\n\ta:hover{\n\t\ttext-decoration: underline;\n\t\tcolor: @color-theme;\n\t}\n\t.tl-caption, .tl-credit {\n\t\t.slide-text-shadow();\n\t}\n\t.tl-media-twitter, .tl-media-blockquote {\n\t\tblockquote {\n\t\t\t.slide-text-shadow();\n\t\t\tp {\n\t\t\t\t.slide-text-shadow();\n\t\t\t}\n\t\t}\n\t}\n\t.vcard {\n\t\ta, .nickname {\n\t\t\t.slide-text-shadow();\n\t\t}\n\t}\n\n}\n\n\n\n/* Full Image Background\n================================================== */\n.tl-slide.tl-full-image-background {\n\tbackground: no-repeat center center;\n\t-webkit-background-size: cover;\n\t -moz-background-size: cover;\n\t -o-background-size: cover;\n\t\t background-size: cover;\n\t//filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.myBackground.jpg', sizingMethod='scale');\n\t//-ms-filter: \"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale')\";\n\tbackground-position:center 25%;\n\ttext-shadow: 1px 1px 2px #000;\n\t.tl-slide-content-container {\n\t\t//.translucent-background(#000, 0.50);\n\t}\n\tp, h1, h2, h3, h4, h5, h6 {\n\t\ttext-shadow: 1px 1px 2px #000;\n\t}\n\t.tl-caption, .tl-credit {\n\t\ttext-shadow: 1px 1px 2px #000;\n\t}\n\n\t.tl-media-twitter, .tl-media-blockquote {\n\t\tblockquote {\n\t\t\ttext-shadow: 1px 1px 2px #000 !important;\n\t\t\tp {\n\t\t\t\ttext-shadow: 1px 1px 2px #000 !important;\n\t\t\t}\n\t\t}\n\t}\n\n}\n/* Color Background\n================================================== */\n.tl-slide.tl-full-color-background {\n\n}\n/* Text Background\n================================================== */\n.tl-slide.tl-text-background {\n\t.tl-text {\n\t\t.tl-text-content-container {\n\t\t\tpadding:20px;\n\t\t\t.background-color-opacity(0,0,0, 60);\n\t\t\t.border-radius(7px);\n\t\t\th2 {\n\t\t\t\tmargin-top:5px;\n\t\t\t}\n\t\t}\n\t}\n}\n\n\n\n/* Skinny\n================================================== */\n.tl-skinny {\n\n\t.tl-slide {\n\t\tdisplay:block;\n\t\tpadding-top:10px;\n\t\t.tl-slide-content-container {\n\t\t\tdisplay:block;\n\t\t\tposition:static;\n\t\t\theight:auto;\n\t\t\theight:100%;\n\t\t\t//vertical-align:baseline;\n\t\t\tdisplay: -webkit-flex; /* Safari */\n\t\t\tdisplay: flex;\n\t\t\t//flex-direction:column-reverse;\n\t\t\talign-items: center;\n\t\t\t-webkit-align-items: center; /* Safari 7.0+ */\n\t\t\t.tl-slide-content {\n\t\t\t\tdisplay:block;\n\n \t\t\tdisplay: -webkit-flex; /* Safari */\n\t\t\t\tdisplay: flex;\n\t\t\t\tflex-direction:column-reverse;\n\t\t\t\t-webkit-flex-direction:column-reverse; /* Safari */\n\t\t\t\tposition:static;\n\t\t\t\theight:auto;\n\t\t\t\tpadding-left:50px;\n\t\t\t\tpadding-right:50px;\n\t\t\t\t.tl-media {\n\t\t\t\t\tposition:static;\n\t\t\t\t\twidth:100%;\n\t\t\t\t\theight:auto;\n\t\t\t\t\tfloat: none;\n\t\t\t\t\tdisplay:block;\n\t\t\t\t\t//margin-top:20px;\n\t\t\t\t\tpadding-top:20px;\n\t\t\t\t\t//padding-bottom:20px;\n\t\t\t\t\tborder-top: 1px solid @ui-background-color-darker;\n\t\t\t\t}\n\t\t\t\t.tl-text {\n\t\t\t\t\tdisplay:block;\n\t\t\t\t\theight:auto;\n\t\t\t\t\tvertical-align:initial;\n\t\t\t\t\tposition:static;\n\t\t\t\t\twidth:100%;\n\t\t\t\t\tmax-width:100%;\n\t\t\t\t\tmin-width:0;\n\t\t\t\t\tfloat:none;\n\t\t\t\t\tpadding: 0;\n\n\t\t\t\t\t.tl-text-content-container {\n\t\t\t\t\t\tpadding-left:10px;\n\t\t\t\t\t\tpadding-right:10px;\n\t\t\t\t\t\tpadding-bottom:10px;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t&.tl-slide.tl-full-color-background, &.tl-full-image-background {\n\t\t\t.tl-slide-content-container {\n\t\t\t\t.tl-slide-content {\n\t\t\t\t\t.tl-media {\n\t\t\t\t\t\tborder-color: fadeout(@ui-background-color-darker,75);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t&.tl-slide-media-only {\n\t\t\t.tl-slide-content-container {\n\t\t\t\t.tl-slide-content {\n\t\t\t\t\tflex-direction:column;\n\t\t\t\t\t-webkit-flex-direction:column; /* Safari */\n\t\t\t\t\t.tl-media {\n\t\t\t\t\t\tborder-top: none;\n\t\t\t\t\t\tpadding-top:0px;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t}\n\t}\n}\n\n\n\n/* Mobile, iPhone\n================================================== */\n.tl-mobile {\n\t.tl-storyslider {\n\n\t}\n}\n\n/* Mobile, iPhone and skinny\n================================================== */\n.tl-mobile.tl-skinny {\n\t.tl-slide {\n\t\t.tl-slide-content-container {\n\t\t\t.tl-slide-content {\n\t\t\t\t.tl-media {\n\t\t\t\t\timg, embed, object, video, iframe {\n\t\t\t\t\t\tmax-height:175px;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n","/* SlideNav\n================================================== */\n\n/* NAVIGATION\n================================================== */\n.tl-slidenav-previous, .tl-slidenav-next {\n\tposition:absolute;\n\ttop: 45%;\n\tz-index:10;\n\tcursor:pointer;\n\t\n\t.tl-slidenav-content-container {\n\t\theight:200px;\n\t\twidth:100px;\n\t\tposition:absolute;\n\t}\n\t.tl-slidenav-title, .tl-slidenav-description {\n\t\t//width:100%;\n\t\t//word-break:break-all;\n\t\twidth:80px;\n\t\t-webkit-line-clamp: 2;\n\t\t\t line-clamp: 2;\n\t\ttext-overflow: ellipsis;\n\t //-ms-word-break: break-all;\n\t // word-break: break-all;\n\n\t /* Non standard for webkit */\n\t // word-break: break-word;\n\t /*\n\t -webkit-hyphens: auto;\n\t -moz-hyphens: auto;\n\t -ms-hyphens: auto;\n\t hyphens: auto;\n\t\t*/\n\t\t.opacity(15);\n\t\ta {\n\t\t\t\n\t\t}\n\t\tsmall {\n\t\t\tdisplay:block;\n\t\t}\n\t}\n\t.tl-slidenav-title {\n\t\tmargin-top:10px;\n\t\tfont-size: @base-font-size-small;\n\t\tline-height: @base-font-size-small;\n\t\t//font-weight: bold;\n\t}\n\t.tl-slidenav-description {\n\t\tfont-size: @base-font-size-small;\n\t\tmargin-top:5px;\n\t\t.opacity(0);\n\t\tsmall {\n\t\t\tdisplay:none;\n\t\t}\n\t}\n\t\n}\n\n/* NAVIGATION COLOR\n================================================== */\n.tl-slidenav-previous, .tl-slidenav-next {\n\t.tl-slidenav-content-container {\n\t\t.tl-slidenav-icon, .tl-slidenav-title, .tl-slidenav-description {\n\t\t\ttext-shadow: 1px 1px 1px @color-background;\n\t\t\tcolor: @color-foreground;\n\t\t}\n\t}\n\t.tl-slidenav-content-container.tl-slidenav-inverted {\n\t\t.tl-slidenav-icon, .tl-slidenav-title, .tl-slidenav-description {\n\t\t\tcolor:@color-text-inverted;\n\t\t\ttext-shadow: 1px 1px 1px @color-foreground;\n\t\t}\n\t}\n}\n\n/* ICONS\n================================================== */\n.tl-slidenav-next, .tl-slidenav-previous {\n\t.tl-slidenav-icon {\n\t\tfont-family: 'tl-icons';\n\t\tspeak: none;\n\t\tfont-style: normal;\n\t\tfont-weight: normal;\n\t\tfont-variant: normal;\n\t\ttext-transform: none;\n\t\tline-height: 1;\n\t\t-webkit-font-smoothing: antialiased;\n\t\t-moz-osx-font-smoothing: grayscale;\n\t\tfont-size:32px;\n\t\tmargin-bottom: 5px;\n\t}\n}\n\n.tl-slidenav-next {\n\ttext-align: right;\n\tmargin-right:10px;\n right: 100px;\n\t.tl-slidenav-title, .tl-slidenav-description {\n\t\tmargin-left:20px;\n\t}\n\t.tl-slidenav-icon {\n\t\tmargin-left: 100 - 24px;\n\t}\n\t.tl-slidenav-icon:before {\n\t\tcontent: \"\\e64f\";\n\t}\n}\n.tl-slidenav-previous {\n\ttext-align: left;\n\tmargin-left:10px;\n\t.tl-slidenav-icon {\n\t\tmargin-left: 0px;\n\t}\n\t.tl-slidenav-icon:before {\n\t\tcontent: \"\\e650\";\n\t}\n}\n\n\n\n/* NAVIGATION HOVER\n================================================== */\n.tl-slidenav-previous:hover, .tl-slidenav-next:hover {\n\t.tl-slidenav-title {\n\t\t.opacity(100);\n\t}\n\t.tl-slidenav-description {\n\t\t.opacity(50);\n\t}\n}\n.tl-slidenav-next:hover {\n\t.tl-slidenav-icon {\n margin-left: 100 - 20px;\n\t}\n}\n.tl-slidenav-previous:hover {\n\t.tl-slidenav-icon {\n\t\tmargin-left: -4px;\n\t}\n}\n\n// Mobile, iPhone and skinny\n@media only screen and (max-width: 500px), only screen and (max-device-width: 500px) {\n\t.tl-slidenav-previous, .tl-slidenav-next {\n\t\t\n\t}\n} \n.tl-skinny {\n\t.tl-slidenav-next {\n\t right: 32px;\n\t\t.tl-slidenav-icon {\n\t\t\tmargin-left:32 - 24px;\n\t\t}\n\t}\n\t.tl-slidenav-previous, .tl-slidenav-next {\n\t\t.tl-slidenav-content-container {\n\t\t\twidth:32px;\n\t\t\theight:32px;\n\t\t}\n\t\t.tl-slidenav-title, .tl-slidenav-description {\n\t\t\tdisplay:none;\n\t\t}\n\t\t.tl-slidenav-icon {\n\t\t\t.opacity(33);\n\t\t}\n\t}\n\t.tl-slidenav-next:hover {\n\t\t.tl-slidenav-icon {\n\t margin-left:32 - 20px;\n\t\t .opacity(100);\n\t\t}\n\t}\n\t.tl-slidenav-previous:hover {\n\t\t.tl-slidenav-icon {\n\t\t\tmargin-left: -4px;\n\t\t\t.opacity(100);\n\t\t}\n\t}\n\t\n}\n\n\n\n.tl-layout-landscape.tl-mobile {\n\t.tl-slidenav-next:hover {\n\t\tright: 70px;\n\t\t.tl-slidenav-icon {\n\t margin-left:32 - 24px;\n\t\t .opacity(100);\n\t\t}\n\t}\n\t.tl-slidenav-next:active {\n\t\t.tl-slidenav-icon {\n\t\t\tmargin-left: 0px;\n\t\t .opacity(100);\n\t\t}\n\t}\n\t.tl-slidenav-previous:hover {\n\t\t.tl-slidenav-icon {\n\t\t\t//margin-left: 0px;\n\t\t\tmargin-left: 100 - 20px;\n\t\t\t.opacity(100);\n\t\t}\n\t}\n\t.tl-slidenav-previous:active {\n\t\t.tl-slidenav-icon {\n\t\t .opacity(100);\n\t\t margin-left: -4px;\n\t\t}\n\t}\n\n}\n\n.tl-layout-portrait.tl-mobile {\n\t.tl-slidenav-next:hover {\n\t\t.tl-slidenav-icon {\n\t\t .opacity(33);\n\t\t}\n\t}\n\t.tl-slidenav-next:active {\n\t\t.tl-slidenav-icon {\n\t\t .opacity(100);\n\t\t}\n\t}\n\t.tl-slidenav-previous:hover {\n\t\t.tl-slidenav-icon {\n\t\t\t.opacity(33);\n\t\t}\n\t}\n\t.tl-slidenav-previous:active {\n\t\t.tl-slidenav-icon {\n\t\t .opacity(100);\n\n\t\t}\n\t}\n}\n\n.tl-mobile, .tl-skinny.tl-mobile, .tl-skinny.tl-layout-landscape.tl-mobile, .tl-skinny.tl-layout-portrait.tl-mobile {\n\t.tl-slidenav-previous, .tl-slidenav-next {\n\t\tdisplay:none;\n\t}\n}","/* StorySlider\n================================================== */\n\n/* SLIDER CONTAINERS\n================================================== */\n.tl-storyslider {\n\twidth:100%;\n\theight:100%;\n\toverflow:hidden;\n\t.user-select(none);\n\tposition:relative;\n\tbox-sizing:content-box;\n\t//.box-shadow(1px 1px 7px rgba(0,0,0,.30));\n\n\tz-index:8;\n\timg, embed, object, video, iframe {\n\t\tmax-width: 100%;\n\t\tposition:relative;\n\t}\n\t.tl-slider-background {\n\t\tposition:absolute;\n\t\ttop:0;\n\t\tleft:0;\n\t\twidth:100%;\n\t\theight:100%;\n\t\tz-index:1;\n\n\t}\n\t.tl-slider-touch-mask {\n\t\twidth:100%;\n\t\theight:100%;\n\t\tz-index:25;\n\n\t\ttop:0px;\n\t\tleft:0px;\n\t\tposition: absolute;\n\t}\n\t.tl-slider-container-mask {\n\t\ttext-align: center;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\t//overflow: scroll;\n\t\tposition: relative;\n\t\tz-index:5;\n\t\t.tl-slider-container {\n\t\t\tposition: absolute;\n\t\t\ttop: 0px;\n\t\t\tleft: 0px;\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t\ttext-align: center;\n\n\t\t\t.tl-slider-item-container {\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t\tdisplay:table-cell;\n\t\t\t\tvertical-align:middle;\n\n\t\t\t}\n\t\t}\n\t}\n\n}\n\n/* Skinny\n================================================== */\n.tl-skinny {\n\t.tl-storyslider {\n\t\t.tl-slider-container-mask {\n\n\t\t\t.tl-slider-container {\n\t\t\t\t.tl-slider-item-container {\n\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t}\n}\n\n/* Mobile, iPhone\n================================================== */\n.tl-mobile {\n\t.tl-storyslider {\n\n\t}\n}\n\n/* Mobile, iPhone and skinny\n================================================== */\n.tl-mobile.tl-skinny {\n\t.tl-storyslider {\n\n\t}\n}\n","/* Requires Variables.less\n================================================== */\n.tl-media {\n\t//display:table-cell;\n\t//vertical-align:middle;\n\twidth:100%;\n\tmin-width:50%;\n\theight:100%;\n\tfloat: left;\n\tmargin-top:auto;\n\tmargin-bottom:auto;\n\tposition:relative;\n\t//margin-right:auto;\n\n\t.tl-media-content-container {\n\t\t&.tl-media-content-container-text {\n\t\t\tborder-right: 1px solid @ui-background-color-darker;\n\t\t\tpadding-right:20px;\n\t\t}\n\t\t.tl-media-content{\n\t\t\tposition: relative;\n\t\t\t.clearfix();\n\n\t\t\t.tl-media-loaderror {\n\t\t\t\tp {\n\t\t\t\t\tcolor:@ui-background-color;\n\t\t\t\t\tspan {\n\t\t\t\t\t\tcolor:@ui-background-color;\n\t\t\t\t\t}\n\t\t\t\t\ttext-align:center;\n\t\t\t\t\tem {\n\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t[class^=\"tl-icon-\"], [class*=\" tl-icon-\"] {\n\t\t\t\t\tfont-size:@base-font-size-xlarge;\n\t\t\t\t\tcolor:@ui-background-color;\n\t\t\t\t\ttext-align:center;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\timg, embed, object, video {\n\t\t\t\tmax-width: 100%;\n\t\t\t\tmax-height:100%;\n\t\t\t}\n\n\t\t}\n\t}\n}\n\n/* Media Only Slides\n================================================== */\n.tl-slide-media-only {\n\t.tl-media {\n\t\t.tl-media-content-container {\n\t\t\t&.tl-media-content-container-text {\n\t\t\t\tborder-right: none;\n\t\t\t\tpadding-right:0;\n\t\t\t}\n\t\t}\n\t}\n\n}\n\n/* Media Shodow\n================================================== */\n\n.tl-media-shadow {\n\tposition: relative;\n\tz-index: 1;\n\t//display:block;\n\t//background:@color-background;\n\t//.box-shadow(1px 1px 7px rgba(0,0,0,.50));\n\t.box-shadow(0 12px 10px -10px rgba(0,0,0,.60));\n\n}\n\n.tl-slide.tl-full-image-background, .tl-slide.tl-full-color-background {\n\ta, .vcard a {\n\t\ttext-shadow: 1px 1px 1px #000;\n\t\tcolor: lighten(@color-theme, 90%);\n\t}\n\ta:hover{\n\t\ttext-decoration: underline;\n\t\tcolor: @color-theme;\n\t}\n}\n/* Credit\n================================================== */\n.tl-credit {\n\tcolor: #999999;\n\ttext-align: right;\n\tdisplay: block;\n\tmargin: 0 auto;\n\tmargin-top: 6px;\n\tfont-size: @base-font-size-small - 1;\n\tline-height: 13px;\n}\n\n/* Caption\n================================================== */\n.tl-caption {\n\ttext-align: left;\n\tmargin-right: auto;\n\tmargin-left: auto;\n\tmargin-top: 10px;\n\tcolor: #666666;\n\tfont-size: @base-font-size-small;\n\tline-height: 14px;\n\ttext-rendering: optimizeLegibility;\n\tword-wrap: break-word;\n}\n\n/* Full Image Background\n================================================== */\n.tl-full-image-background, .tl-full-color-background {\n\n\t.tl-media-shadow:before, .tl-media-shadow:after {\n\t\tbackground: none;\n\t\t.box-shadow(0 0px 0px #000);\n\t}\n\n}\n.tl-full-image-background {\n\n}\n\n.tl-full-color-background {\n\n}\n\n\n/* Skinny\n================================================== */\n.tl-skinny {\n\t.tl-media {\n\t\twidth:100%;\n\t\theight:auto;\n\t\tfloat: none;\n\t\tdisplay:block;\n\t\t.tl-media-content-container {\n\t\t\t&.tl-media-content-container-text {\n\t\t\t\tborder-right: 0;\n\t\t\t\tpadding-right:0;\n\t\t\t}\n\t\t\t.tl-media-content{\n\n\t\t\t}\n\n\t\t\t.tl-credit, .tl-caption {\n\t\t\t\tmargin-top: 2px;\n\t\t\t\tpadding-left:10px;\n\t\t\t\tpadding-right:10px;\n\t\t\t\tfont-size:8px;\n\t\t\t}\n\t\t\t.tl-credit {\n\t\t\t\tmargin-top: 0px;\n\t\t\t}\n\t\t}\n\t}\n}\n\n\n\n/* Mobile, iPhone\n================================================== */\n.tl-mobile {\n\n}\n\n/* Mobile, iPhone and skinny\n================================================== */\n.tl-mobile.tl-skinny {\n\t.tl-media {\n\t\twidth:100%;\n\t\theight:auto;\n\t\tfloat: none;\n\t\tdisplay:block;\n\n\t\t.tl-media-content-container {\n\t\t\t&.tl-media-content-container-text {\n\t\t\t\tborder-right: 0;\n\t\t\t\tpadding-right:0;\n\t\t\t}\n\t\t\t.tl-media-content{\n\n\t\t\t}\n\t\t\t.tl-credit {\n\n\t\t\t}\n\t\t\t.tl-caption {\n\n\t\t\t}\n\n\t\t}\n\t}\n}\n","/* Requires Variables.less\n================================================== */\n\n.tl-text {\n\twidth:50%;\n\tmax-width:50%;\n\tmin-width:120px;\n\tpadding: 0 20px 0 20px;\n\tdisplay:table-cell;\n\tvertical-align:middle;\n\ttext-align: left;\n\t//float:left;\n\ttext-shadow: none;\n\tcolor:@color-text;\n\tp {\n\t\tcolor:@color-text;\n\t}\n\t.tl-text-content-container {\n\t\t.tl-text-content{\n\n\t\t}\n\t}\n\th2.tl-headline-title, h2.tl-headline {\n\t\tmargin-top:0;\n\t}\n\t.tl-headline-date, h3.tl-headline-date {\n\t\tfont-family:@font-main;\n\t\tfont-size:@base-font-size;\n\t\tline-height: @base-font-size;\n\t\tfont-weight: normal;\n\t\tmargin:0 0 3px 0;\n\t\tcolor: lighten(@color-text,25);\n\t\tsmall {\n\t\t\tfont-size:@base-font-size;\n\t\t\tline-height: @base-font-size;\n\t\t\tfont-weight: normal;\n\t\t\tcolor: lighten(@color-text,25);\n\t\t}\n\t}\n\t.tl-text-date {\n\t\tdisplay:inline-block;\n\t\tfont-family:@font-main;\n\t\tfont-weight:normal;\n\t\tmargin-top:10px;\n\t\tfont-size:12px;\n\t\tcolor: lighten(@color-text,25);\n\t\t&:after {\n\t\t\t//margin-left:3px;\n\t\t\t//color:#999;\n\t\t\t//font-weight:normal;\n\t\t}\n\t}\n\n}\n\n// When the background is an image\n.tl-full-image-background, .tl-full-color-background {\n\t.tl-text, .tl-text p {\n\t\tcolor: @color-text-inverted !important;\n\t\ttext-shadow: 1px 1px 2px #000;\n\t\t.tl-headline-date, h3.tl-headline-date {\n\t\t\tcolor: @color-text-inverted !important;\n\t\t\tsmall {\n\t\t\t\tcolor: @color-text-inverted !important;\n\t\t\t}\n\t\t}\n\t\ta:hover {\n\t\t\ttext-decoration: underline;\n\t\t\tcolor: @color-theme;\n\t\t}\n\t}\n}\n\n\n/* Skinny\n================================================== */\n.tl-skinny {\n\t.tl-text {\n\t\twidth:100%;\n\t\tmax-width:100%;\n\t\tmin-width:auto;\n\t\tfloat:none;\n\t\tmargin-top:20px;\n\t\t.tl-text-content-container {\n\t\t\t.tl-text-content{\n\n\t\t\t}\n\t\t}\n\t\th2.tl-headline-title, h2.tl-headline {\n\t\t\t//word-break: break-all;\n\t\t\tfont-size:32px;\n\t\t\tline-height:36px;\n\t\t}\n\t}\n}\n\n/* Medium\n================================================== */\n.tl-medium {\n\t.tl-text {\n\t\th2.tl-headline-title, h2.tl-headline {\n\t\t\t//word-break: break-all;\n\t\t\tfont-size:32px;\n\t\t\tline-height:36px;\n\t\t}\n\t}\n}\n\n/* Mobile, iPhone\n================================================== */\n.tl-mobile {\n\n}\n\n/* Mobile, iPhone and skinny\n================================================== */\n.tl-mobile.tl-skinny {\n\n}\n",".tl-media {\n\t.tl-media-image {\n\t\t\n\t}\n\n}\n\n.tl-mobile.tl-skinny {\n\t.tl-media {\n\t\t.tl-media-image {\n\t\t\tmax-height:250px !important;\n\t\t}\n\n\t}\n}",".tl-media {\n\t.tl-media-twitter {\n\t\ttext-align:left;\n\t\t//margin-left: auto;\n\t\t//margin-right: auto;\n\t\t//margin-bottom:@base-space;\n\t\tclear:both;\n\t\tblockquote {\n\t\t\tmargin:0;\n\t\t\tmargin-right: \t@base-spacing;\n\t\t\tfont-size: \t\t@base-font-size;\n\t\t\tline-height:\tfloor(@base-font-size * @base-line-height);\n\t\t\tcolor:\t\t\t@color-foreground;\n\t\t\tp {\n\t\t\t\tfont-size: \t\t@base-font-size-xlarge;\n\t\t\t\tline-height: \tfloor(@base-font-size-xlarge * 1.1);\n\t\t\t\tcolor:\t\t\t@color-dark;\n\t\t\t}\n\t\t\t.quote-mark {\n\t\t\t\t\n\t\t\t}\n\t\t}\n\t\tblockquote p:before {\n\t\t\tdisplay:none;\n\t\t}\n\t\tblockquote p:after {\n\t\t\tdisplay:none;\n\t\t}\n\t\t\n\t\t.tl-icon-twitter {\n\t\t\tcolor:#55ACEE;\n\t\t}\n\t\t.vcard {\n\t\t\ta:hover, a.tl-date:hover {\n\t\t\t\ttext-decoration: none;\n\t\t\t\tcolor:#55ACEE;\n\t\t\t\t.fn, .nickname {\n\t\t\t\t\tcolor:#55ACEE;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t\n\t\t\n\n\t}\n\n}\n.tl-slide-media-only {\n\t.tl-media {\n\t\t.tl-media-twitter {\n\t\t\twidth:80%;\n\t\t\tmargin-left:auto;\n\t\t\tmargin-right:auto;\n\t\t}\n\t}\n}\n.tl-mobile.tl-skinny {\n\t.tl-media {\n\t\t.tl-media-twitter {\n\t\t\t\n\t\t\tblockquote {\n\t\t\t\tp {\n\t\t\t\t\tfont-size: \t\t@base-font-size;\n\t\t\t\t\tline-height:\tfloor(@base-font-size * @base-line-height);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t}\n}\n.tl-skinny {\n\t\n\t.tl-media {\n\t\t.tl-media-twitter {\n\t\t\tmargin-left:10px;\n\t\t\tmargin-right:10px;\n\t\t\tblockquote {\n\t\t\t\tp {\n\t\t\t\t\tfont-size: \t\t@base-font-size-large;\n\t\t\t\t\tline-height:\tfloor(@base-font-size-large * 1.1);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t}\n}\n",".tl-media {\n\t.tl-media-blockquote {\n\t\ttext-align:left;\n\t\tclear:both;\n\t\t\n\t\tblockquote {\n\t\t\tmargin:0;\n\t\t\tmargin-right: \t@base-spacing;\n\t\t\ttext-align: \tleft;\n\t\t\tfont-size: \t\t@base-font-size-xlarge;\n\t\t\tline-height: \tfloor(@base-font-size-xlarge * 1.1);\n\t\t\tcolor:\t\t\t@color-foreground;\n\t\t\tp {\n\t\t\t\tfont-size: \t\t@base-font-size-xlarge;\n\t\t\t\tline-height: \tfloor(@base-font-size-xlarge * 1.1);\n\t\t\t\tcolor:\t\t\t@color-foreground;\n\t\t\t\t&:before, &:after {\n\t\t\t\t\tdisplay:inline-block;\n\t\t\t\t\tfont-size: \t\tfloor(@base-font-size-xlarge * 1.3);\n\t\t\t\t\t//line-height: \tfloor(@base-font-size-xlarge * 1.1);\n\t\t\t\t\t//color:\t\t\tlighten(@color-foreground,50);\n\t\t\t\t\t//width:@base-font-size-xlarge;\n\t\t\t\t\t//height:@base-font-size-xlarge;\n\t\t\t\t}\n\t\t\t\t&:before {\n\t\t\t\t\tcontent: open-quote;\n\t\t\t\t\tmargin-right:5px;\n\t\t\t\t}\n\t\t\t\t&:after {\n\t\t\t\t\tcontent: close-quote;\n\t\t\t\t\tmargin-left:3px;\n\t\t\t\t} \n\t\t\t}\n\t\t\tcite {\n\t\t\t\tfont-size: \t\t@base-font-size;\n\t\t\t\tline-height:\tfloor(@base-font-size * @base-line-height);\n\t\t\t\t//color:\t\t\t@color-foreground;\n\t\t\t\tcolor: \t\t\tlighten(@color-foreground, 40%);\n\t\t\t\ttext-align: \tright;\n\t\t\t\tmargin-top: \t@base-spacing;\n\t\t\t}\n\n\t\t}\n\n\n\t}\n\n}\n.tl-slide-media-only {\n\t.tl-media {\n\t\t.tl-media-blockquote {\n\t\t\tborder-right: 0;\n\t\t\twidth:80%;\n\t\t\tmargin-left:auto;\n\t\t\tmargin-right:auto;\n\t\t}\n\t}\n}\n// Skinnier\n@media only screen and (max-width: 800px), only screen and (max-device-width: 800px) {\n\t.tl-media {\n\t\t.tl-media-blockquote {\n\t\t\t\n\t\t\tblockquote {\n\t\t\t\tp {\n\t\t\t\t\tfont-size: \t\t@base-font-size-large;\n\t\t\t\t\tline-height:\tfloor(@base-font-size-large * 1.1);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t}\n}\n// Mobile, iPhone and skinny\n@media only screen and (max-width: 500px), only screen and (max-device-width: 500px) {\n\t.tl-media {\n\t\t.tl-media-blockquote {\n\t\t\t\n\t\t\tblockquote {\n\t\t\t\tp {\n\t\t\t\t\tfont-size: \t\t@base-font-size;\n\t\t\t\t\tline-height:\tfloor(@base-font-size * @base-line-height);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t}\n}",".tl-media {\n\t.tl-media-instagram {\n\t\t\n\t}\n\n}\n\n\n.tl-mobile.tl-skinny {\n\t.tl-media {\n\t\t.tl-media-instagram {\n\t\t\tmax-height:250px !important;\n\t\t}\n\n\t}\n}",".tl-media {\n\t.tl-media-profile {\n\t\tborder-radius: 50%;\n\t}\n\n}\n\n// Mobile, iPhone and skinny\n@media only screen and (max-width: 500px), only screen and (max-device-width: 500px) {\n\t.tl-media {\n\t\t.tl-media-profile {\n\t\t\n\t\t}\n\n\t}\n}",".tl-media {\n\t.tl-media-iframe {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tiframe {\n\t\t\twidth: 100%;\n\t\t\theight: 100%;\n\t\t}\n\t}\n\n}\n\n// Mobile, iPhone and skinny\n@media only screen and (max-width: 500px), only screen and (max-device-width: 500px) {\n\t.tl-media {\n\t\t.tl-media-iframe {\n\t\t\n\t\t}\n\n\t}\n}",".tl-media {\n\t.tl-media-wikipedia {\n\t\t//font-size: @base-font;\n\t\t//line-height: @base-line;\n\t\ttext-align:left;\n\t\tmargin-left: auto;\n\t\tmargin-right: auto;\n\t\t//margin-bottom:@base-space;\n\t\tclear:both;\n\t\t.tl-icon-wikipedia {\n\t\t\tfont-size:32px;\n\t\t\tmargin-right:10px;\n\t\t\t//margin-bottom:10px;\n\t\t\tfloat:left;\n\t\t\tpadding-top:3px;\n\t\t\t//padding-right:10px;\n\n\t\t\t//border-right: 1px solid @ui-background-color-darker;\n\t\t}\n\t\t.tl-wikipedia-pageimage {\n\t\t\tfloat:left;\n\t\t\tmargin-right:10px;\n\t\t\tmargin-bottom:5px;\n\t\t\tmargin-top:5px;\n\t\t}\n\t\t.tl-wikipedia-title {\n\t\t\tmargin-left:60px;\n\t\t\tpadding-left:10px;\n\t\t\tborder-left: 1px solid @ui-background-color-darker;\n\t\t\tmargin-bottom:10px;\n\t\t}\n\t\t.tl-wikipedia-source {\n\t\t\t//margin-bottom:@base-space;\n\t\t\tfont-size: 13px;\n\t\t\tline-height: 15px;\n\t\t\tfont-style: italic;\n\t\t\t//margin-top:10px;\n\t\t\tmargin-top:3px;\n\t\t\tdisplay:block;\n\t\t\t//margin-left:70px;\n\t\t\tcolor:fadeout(@color-dark, 50);\n\t\t}\n\t\th4 {\n\t\t\tmargin-top:0px;\n\t\t\t//border-bottom: 1px solid @color-line;\n\t\t\tmargin-bottom:0px;\n\t\t\t//margin-left:70px;\n\t\t}\n\t\th4 a {\n\t\t\tcolor:@color-dark; //@color-theme;\n\t\t\ttext-decoration: none;\n\t\t}\n\n\t\tp {\n\t\t\tfont-size: 13px;\n\t\t\tline-height: 19px;\n\t\t}\n\n\t}\n\n}\n.tl-slide-media-only {\n\t.tl-media {\n\t\t.tl-media-wikipedia {\n\t\t\tborder-right: 0;\n\t\t\tborder-top: 1px solid @ui-background-color-darker;\n\t\t\twidth:80%;\n\t\t\tmargin-left:auto;\n\t\t\tmargin-right:auto;\n\t\t\tmargin-top:25px;\n\t\t\tpadding-top:25px;\n\t\t}\n\t}\n}\n.tl-slide.tl-full-image-background, .tl-slide.tl-full-color-background {\n\t.tl-media {\n\t\t.tl-media-wikipedia {\n\t\t\tpadding:20px;\n\t\t\t.background-color-opacity(0,0,0, 60);\n\t\t\t.border-radius(7px);\n\t\t\th4 a {\n\t\t\t\t.slide-text-shadow();\n\t\t\t}\n\t\t\ta:hover{\n\t\t\t\ttext-decoration: underline;\n\t\t\t\tcolor: @color-theme;\n\t\t\t}\n\t\t\t.tl-wikipedia-title {\n\t\t\t\tborder-color: fadeout(@ui-background-color-darker,75);\n\t\t\t}\n\t\t\t.tl-wikipedia-source {\n\t\t\t\tcolor:fadeout(@ui-background-color-darker,15);\n\t\t\t}\n\t\t}\n\t}\n}\n// Mobile, iPhone and skinny\n.tl-mobile.tl-skinny, .tl-skinny{\n\t.tl-media {\n\t\t.tl-media-wikipedia {\n\t\t\tmargin-left: 10px;\n\t\t\tmargin-right: 10px;\n\t\t}\n\n\t}\n}\n",".tl-media {\n\t.tl-media-website {\n\t\t//font-size: @base-font;\n\t\t//line-height: @base-line;\n\t\ttext-align:left;\n\t\tmargin-left: auto;\n\t\tmargin-right: auto;\n\t\t//margin-bottom:@base-space;\n\t\tclear:both;\n\t\t.tl-media-website-description {\n\t\t\t//margin-bottom:@base-space;\n\t\t\tfont-size: 16px;\n\t\t\tline-height: 19px;\n\t\t\tfont-style: italic;\n\t\t\tmargin-bottom:10px;\n\t\t\ttext-transform: uppercase;\n\t\t}\n\t\th4 {\n\t\t\tmargin-top:0px;\n\t\t\t//border-bottom: 1px solid @color-line;\n\t\t\tmargin-bottom:0px;\n\t\t\tline-height:1;\n\t\t}\n\t\th4 a {\n\t\t\tcolor:@color-dark; //@color-theme;\n\t\t\ttext-decoration: none;\n\t\t}\n\n\t\tp {\n\t\t\tfont-size: 13px;\n\t\t\tline-height: 19px;\n\t\t}\n\n\t}\n\t.tl-media-content-container {\n\t\t.tl-media-content {\n\t\t\t.tl-media-website {\n\t\t\t\timg {\n\t\t\t\t\tfloat: right;\n\t\t\t\t\tmax-width: 120px;\n\t\t\t\t\tmax-height: 120px;\n\t\t\t\t\tmargin: 4px 0 0 15px;\n\t\t\t\t\t&.tl-media-website-icon {\n\t\t\t\t\t\tmax-width: 16px;\n\t\t\t\t\t\tmax-height: 16px;\n\t\t\t\t\t\tfloat:none;\n\t\t\t\t\t\tmargin:0;\n\t\t\t\t\t\tmargin-right:3px;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t}\n\t\t}\n\t}\n\n}\n.tl-slide.tl-full-image-background, .tl-slide.tl-full-color-background {\n\t.tl-media {\n\t\t.tl-media-website {\n\t\t\tpadding:20px;\n\t\t\t.background-color-opacity(0,0,0, 60);\n\t\t\t.border-radius(7px);\n\t\t\th4 a {\n\t\t\t\t.slide-text-shadow();\n\t\t\t}\n\t\t\ta:hover{\n\t\t\t\ttext-decoration: underline;\n\t\t\t\tcolor: @color-theme;\n\t\t\t}\n\t\t}\n\t}\n}\n// Mobile, iPhone and skinny\n.tl-mobile.tl-skinny {\n\t.tl-media {\n\t\t.tl-media-website {\n\t\t\tmargin-left: 10px;\n\t\t\tmargin-right: 10px;\n\t\t}\n\n\t}\n}\n","/*!\n\tTimeline JS 3\n\n\tDesigned and built by Zach Wise for the Northwestern University Knight Lab\n\n\tThis Source Code Form is subject to the terms of the Mozilla Public\n\tLicense, v. 2.0. If a copy of the MPL was not distributed with this\n\tfile, You can obtain one at https://mozilla.org/MPL/2.0/.\n\n*/\n\n/* Includes\n================================================== */\n\n@import \"core/Mixins.less\"; \t\t// Less shortcuts and functions\n@import \"core/Reset.less\"; \t\t\t// CSS Reset\n@import \"Typography.less\";\n\n// Icons\n@import \"icons/Icons.less\";\n\n//\tTL\n@import \"core/TL.less\";\n\n//\tComponents\n@import \"ui/TL.MenuBar.less\";\n@import \"ui/TL.MenuBar.Button.less\";\n@import \"ui/TL.Message.less\";\n\n@import \"timenav/TL.TimeNav.less\";\n@import \"timenav/TL.TimeMarker.less\";\n@import \"timenav/TL.TimeEra.less\";\n@import \"timenav/TL.TimeGroup.less\";\n@import \"timenav/TL.TimeAxis.less\";\n\n@import \"animation/TL.Animate.less\";\n\n@import \"slider/TL.Slide.less\";\n@import \"slider/TL.SlideNav.less\";\n@import \"slider/TL.StorySlider.less\";\n\n@import \"media/TL.Media.less\";\n@import \"media/types/TL.Media.Text.less\";\n@import \"media/types/TL.Media.Image.less\";\n@import \"media/types/TL.Media.Twitter.less\";\n@import \"media/types/TL.Media.Blockquote.less\";\n@import \"media/types/TL.Media.Flickr.less\";\n@import \"media/types/TL.Media.Instagram.less\";\n@import \"media/types/TL.Media.Profile.less\";\n@import \"media/types/TL.Media.YouTube.less\";\n@import \"media/types/TL.Media.IFrame.less\";\n@import \"media/types/TL.Media.Wikipedia.less\";\n@import \"media/types/TL.Media.Website.less\";\n\n/* Timeline\n================================================== */\n\n.tl-timeline {\n\twidth:100%;\n\theight:100%;\n\tfont-size: 16px;\n\tline-height: normal;\n\toverflow:hidden;\n\tposition: relative;\n\t.user-select(none);\n\tbackground-color:@color-background;\n\tcolor:@color-text;\n\t-webkit-box-sizing: content-box;\n\t-moz-box-sizing: content-box;\n\tbox-sizing: content-box;\n\n\t&.tl-timeline-embed {\n\t\tbox-sizing:border-box;\n\t\tborder-top: 1px solid darken(@ui-background-color-darker, 10);\n\t\tborder-bottom: 1px solid darken(@ui-background-color-darker, 10);\n\t\tborder-radius: 0;\n\t}\n\n\t&.tl-timeline-full-embed {\n\t\tbox-sizing:border-box;\n\t\tborder: 1px solid darken(@ui-background-color-darker, 10);\n\t\tborder-radius: 8px;\n\t}\n}\n\n/* Portrait\n================================================== */\n.tl-layout-portrait {\n\t.tl-storyslider {\n\t\t//padding-top:10px;\n\t\t.box-shadow(0px -3px 6px rgba(0,0,0,.20));\n\t}\n}\n\n.tl-rtl{\n\t.tl-text-content, .tl-headline, .tl-media-blockquote, .tl-headline-date, .tl-timeline blockquote p, .tl-media-website, .tl-media-wikipedia, .tl-media .tl-media-blockquote blockquote, .blockquote, blockquote p, .tl-text-content p{\n\t\ttext-align: right;\n\t\tdirection: rtl;\n\t}\n\n\t.tl-slide-media-only{\n\t\t.tl-headline, .tl-headline-date{\n\t\t\ttext-align: center;\n\t\t}\n\t}\n\n\t.tl-timemarker-text{\n\t\tmargin-right: 35px;\n\t}\n\n\t.tl-timemarker-content-container .tl-timemarker-content .tl-timemarker-media-container{\n\t\tfloat:right;\n\t}\n\n\t.tl-caption {\n\t\ttext-align: right;\n\t}\n\n\t.tl-credit {\n\t\ttext-align: left;\n\t}\n\n}\n"],"sourceRoot":""} \ No newline at end of file diff --git a/helpdesk/static/helpdesk/vendor/timeline3/embed/compare.html b/helpdesk/static/helpdesk/vendor/timeline3/embed/compare.html new file mode 100644 index 00000000..5119994a --- /dev/null +++ b/helpdesk/static/helpdesk/vendor/timeline3/embed/compare.html @@ -0,0 +1,91 @@ + + +
+2) {\n this.media_id = found[2];\n } else {\n self.loadErrorDisplay(self._(\"twitterembed_invalidurl_err\"));\n return;\n }\n }\n\n // API URL\n api_url = \"https://api.twitter.com/1/statuses/oembed.json?id=\" + this.media_id + \"&omit_script=true&include_entities=true&callback=?\";\n\n // API Call\n ajax({\n type: 'GET',\n url: api_url,\n dataType: 'json', //json data type\n success: function(d) {\n self.createMedia(d);\n },\n error: function(xhr, type) {\n var error_text = \"\";\n error_text += self._(\"twitter_load_err\") + \"\";\n tweetuser = d.author_url.split(\"twitter.com\\/\")[1];\n tweet_status_temp = d.html.split(\"<\\/p>\\—\")[1].split(\"\")[0];\n tweet_status_date = tweet_status_temp.split(\"\\\"\\>\")[1].split(\"<\\/a>\")[0];\n\n // Open links in new window\n tweet_text = tweet_text.replace(/\";\n tweet += \"\" + tweet_status_date + \"\";\n tweet += \"
\" + self.media_id + \"
\" + type;\n self.loadErrorDisplay(error_text);\n }\n });\n\n }\n\n createMedia(d) {\n var tweet = \"\",\n tweet_text = \"\",\n tweetuser = \"\",\n tweet_status_temp = \"\",\n tweet_status_url = \"\",\n tweet_status_date = \"\",\n self = this;\n\n //\tTWEET CONTENT\n tweet_text = d.html.split(\"<\\/p>\\—\")[0] + \"
\";\n } else {\n markup = \"\"\n }\n this._el.content_item.innerHTML = markup\n this.onLoaded();\n }\n\n // Update Media Display\n _updateMediaDisplay() {\n this._el.content_item.style.height = this.options.height + \"px\";\n }\n\n\n}","import { Media } from \"../Media\";\nimport * as Browser from \"../../core/Browser\"\n\nexport default class Audio extends Media {\n _loadMedia() {\n // Loading Message\n this.loadingMessage();\n\n // Create media?\n if (!this.options.background) {\n this.createMedia();\n }\n\n // After loaded\n this.onLoaded();\n }\n\n createMedia() {\n var self = this,\n audio_class = \"tl-media-item tl-media-audio tl-media-shadow\";\n\n // Link\n if (this.data.link) {\n this._el.content_link = this.domCreate(\"a\", \"\", this._el.content);\n this._el.content_link.href = this.data.link;\n this._el.content_link.target = \"_blank\";\n this._el.content_item = this.domCreate(\"audio\", audio_class, this._el.content_link);\n } else {\n this._el.content_item = this.domCreate(\"audio\", audio_class, this._el.content);\n }\n\n this._el.content_item.controls = true;\n this._el.source_item = this.domCreate(\"source\", \"\", this._el.content_item);\n\n // Media Loaded Event\n this._el.content_item.addEventListener('load', function(e) {\n self.onMediaLoaded();\n });\n\n this._el.source_item.src = this.data.url;\n this._el.source_item.type = this._getType(this.data.url, this.data.mediatype.match_str);\n this._el.content_item.innerHTML += \"Your browser doesn't support HTML5 audio with \" + this._el.source_item.type;\n }\n\n _updateMediaDisplay(layout) {\n if (Browser.firefox) {\n this._el.content_item.style.width = \"auto\";\n }\n }\n\n _getType(url, reg) {\n var ext = url.match(reg);\n var type = \"audio/\"\n switch (ext[1]) {\n case \"mp3\":\n type += \"mpeg\";\n break;\n case \"wav\":\n type += \"wav\";\n break;\n case \"m4a\":\n type += \"mp4\";\n break;\n default:\n type = \"audio\";\n break;\n }\n return type\n }\n\n}","import { Media } from \"../Media\";\nimport * as Browser from \"../../core/Browser\"\n\nexport default class Video extends Media {\n _loadMedia() {\n // Loading Message\n this.loadingMessage();\n\n // Create media?\n if (!this.options.background) {\n this.createMedia();\n }\n\n // After loaded\n this.onLoaded();\n }\n\n createMedia() {\n var self = this,\n video_class = \"tl-media-item tl-media-video tl-media-shadow\";\n\n // Link\n if (this.data.link) {\n this._el.content_link = this.domCreate(\"a\", \"\", this._el.content);\n this._el.content_link.href = this.data.link;\n this._el.content_link.target = \"_blank\";\n this._el.content_item = this.domCreate(\"video\", video_class, this._el.content_link);\n } else {\n this._el.content_item = this.domCreate(\"video\", video_class, this._el.content);\n }\n\n this._el.content_item.controls = true;\n this._el.source_item = this.domCreate(\"source\", \"\", this._el.content_item);\n\n // Media Loaded Event\n this._el.content_item.addEventListener('load', function(e) {\n self.onMediaLoaded();\n });\n\n this._el.source_item.src = this.data.url;\n this._el.source_item.type = this._getType(this.data.url, this.data.mediatype.match_str);\n this._el.content_item.innerHTML += \"Your browser doesn't support HTML5 video with \" + this._el.source_item.type;\n }\n\n _updateMediaDisplay(layout) {\n if (Browser.firefox) {\n this._el.content_item.style.width = \"auto\";\n }\n }\n\n _getType(url, reg) {\n var ext = url.match(reg);\n var type = \"video/\"\n switch (ext[1]) {\n case \"mp4\":\n type += \"mp4\";\n break;\n default:\n type = \"video\";\n break;\n }\n return type\n }\n\n}","import { Media } from \"../Media\";\nimport { ratio, trace } from \"../../core/Util\";\n\nexport default class Wistia extends Media {\n\n _loadMedia() {\n var api_url,\n self = this;\n\n // Create Dom element\n this._el.content_item = this.domCreate(\"div\", \"tl-media-item tl-media-iframe tl-media-wistia tl-media-shadow\", this._el.content);\n\n // Get Media ID\n this.media_id = this.data.url.split(/https?:\\/\\/(.+)?(wistia\\.com|wi\\.st)\\/medias\\/(.*)/)[3];\n trace(`Wistia: media_id: ${this.media_id}`)\n // API URL\n api_url = \"https://fast.wistia.com/embed/iframe/\" + this.media_id + \"?version=v1&controlsVisibleOnLoad=true&playerColor=aae3d8\";\n\n this.player = this.domCreate(\"iframe\", \"\", this._el.content_item);\n\n // Media Loaded Event\n this.player.addEventListener('load', function(e) {\n self.onMediaLoaded();\n });\n\n this.player.width = \"100%\";\n this.player.height = \"100%\";\n this.player.frameBorder = \"0\";\n this.player.src = api_url;\n\n this.player.setAttribute('allowfullscreen', '');\n this.player.setAttribute('webkitallowfullscreen', '');\n this.player.setAttribute('mozallowfullscreen', '');\n\n // After Loaded\n this.onLoaded();\n }\n\n // Update Media Display\n _updateMediaDisplay() {\n this._el.content_item.style.height = ratio.r16_9({ w: this._el.content_item.offsetWidth }) + \"px\";\n }\n\n _stopMedia() {\n try {\n this.player.contentWindow.postMessage(JSON.stringify({ method: \"pause\" }), \"https://player.vimeo.com\");\n } catch (err) {\n trace(err);\n }\n }\n}","/*\n Determines the type of media the url string is.\n returns an object with .type and .id\n You can add new media types by adding a regex\n to match and the media class name to use to\n render the media\n\n The image_only parameter indicates that the\n call only wants an image-based media type\n that can be resolved to an image URL.\n================================================== */\n\nimport Image from \"./types/Image\"\nimport YouTube from \"./types/YouTube\"\nimport GoogleMap from \"./types/GoogleMap\"\nimport Blockquote from \"./types/Blockquote\"\nimport Wikipedia from \"./types/Wikipedia\"\nimport SoundCloud from \"./types/SoundCloud\"\nimport Vimeo from \"./types/Vimeo\"\nimport DailyMotion from \"./types/DailyMotion\"\nimport Vine from \"./types/Vine\"\nimport Twitter from \"./types/Twitter\"\nimport TwitterEmbed from \"./types/TwitterEmbed\"\nimport Flickr from \"./types/Flickr\"\nimport DocumentCloud from \"./types/DocumentCloud\"\nimport Instagram from \"./types/Instagram\"\nimport Profile from \"./types/Profile\"\nimport GoogleDoc from \"./types/GoogleDoc\"\nimport Spotify from \"./types/Spotify\"\nimport IFrame from \"./types/IFrame\"\nimport Imgur from \"./types/Imgur\"\nimport PDF from \"./types/PDF\"\nimport Audio from \"./types/Audio\"\nimport Video from \"./types/Video\"\nimport Wistia from \"./types/Wistia\"\n\n/**\n * Given a JavaScript Object for an event from a TimelineConfig,\n * determine the appropriate subclass of Media which can handle creating and showing an \n * embed in the \"media\" section of that event's slide.\n *\n * When the `image_only` argument is true, the input `url_or_text` will only be\n * tested against patterns which are known to return images suitable for use as\n * thumbnails and backgrounds. Media classes returned when image_only is true should \n * implement the getImageURL() function\n *\n * @param {Object} m\n * @param {Boolean} image_only\n * \n * @returns {Object} a JS object which represents the match, including a `type`, `name`, \n * `match_str`, and `cls`. These are all string values, except `cls`, which\n * is a JavaScript class which can be used to instantiate a media embed\n * or thumbnail.\n */\n\nexport function lookupMediaType(m, image_only) {\n var media = {},\n media_types = [{\n type: \"youtube\",\n name: \"YouTube\",\n match_str: \"^(https?:)?\\/*(www.)?youtube|youtu\\.be\",\n cls: YouTube\n },\n {\n type: \"vimeo\",\n name: \"Vimeo\",\n match_str: \"^(https?:)?\\/*(player.)?vimeo\\.com\",\n cls: Vimeo\n },\n {\n type: \"dailymotion\",\n name: \"DailyMotion\",\n match_str: \"^(https?:)?\\/*(www.)?dailymotion\\.com\",\n cls: DailyMotion\n },\n {\n type: \"vine\",\n name: \"Vine\",\n match_str: \"^(https?:)?\\/*(www.)?vine\\.co\",\n cls: Vine\n },\n {\n type: \"soundcloud\",\n name: \"SoundCloud\",\n match_str: \"^(https?:)?\\/*(player.)?soundcloud\\.com\",\n cls: SoundCloud\n },\n {\n type: \"twitter\",\n name: \"Twitter\",\n match_str: \"^(https?:)?\\/*(www.)?twitter\\.com\",\n cls: Twitter\n },\n {\n type: \"twitterembed\",\n name: \"TwitterEmbed\",\n match_str: \"1) {\n\t\t\t\tthis._text.className = \"tl-headline tl-headline-fadeout\";\n\t\t\t} else {\n\t\t\t\tthis._text.className = \"tl-headline\";\n\t\t\t}\n\t\t\tthis._text.style.height = (text_lines * text_line_height) + \"px\";\n\t\t}\n\n\t}\n\n\tsetWidth(w) {\n\t\tif (this.data.end_date) {\n\t\t\tthis._el.container.style.width = w + \"px\";\n\n\t\t\tif (w > this.options.marker_width_min) {\n\t\t\t\tthis._el.content_container.style.width = w + \"px\";\n\t\t\t\tthis._el.content_container.className = \"tl-timemarker-content-container tl-timemarker-content-container-long\";\n\t\t\t} else {\n\t\t\t\tthis._el.content_container.style.width = this.options.marker_width_min + \"px\";\n\t\t\t\tthis._el.content_container.className = \"tl-timemarker-content-container\";\n\t\t\t}\n\t\t}\n\n\t}\n\n\tsetClass(n) {\n\t\tthis._el.container.className = n;\n\t}\n\n\tsetRowPosition(n, remainder) {\n\t\tthis.setPosition({ top: n });\n\t\tthis._el.timespan.style.height = remainder + \"px\";\n\t}\n\n\t/*\tEvents\n\t================================================== */\n\t_onMarkerClick(e) {\n\t\tthis.fire(\"markerclick\", { unique_id: this.data.unique_id });\n\t}\n\n\t/*\tPrivate Methods\n\t================================================== */\n\t_initLayout() {\n\t\t// Create Layout\n\t\tthis._el.container = DOM.create(\"div\", \"tl-timemarker\");\n\t\tif (this.data.unique_id) {\n\t\t\tthis._el.container.id = this.data.unique_id + \"-marker\";\n\t\t}\n\n\t\tif (this.data.end_date) {\n\t\t\tthis.has_end_date = true;\n\t\t\tthis._el.container.className = 'tl-timemarker tl-timemarker-with-end';\n\t\t}\n\n\t\tthis._el.timespan = DOM.create(\"div\", \"tl-timemarker-timespan\", this._el.container);\n\t\tthis._el.timespan_content = DOM.create(\"div\", \"tl-timemarker-timespan-content\", this._el.timespan);\n\t\tthis._el.content_container = DOM.create(\"div\", \"tl-timemarker-content-container\", this._el.container);\n\n\t\tthis._el.content = DOM.create(\"div\", \"tl-timemarker-content\", this._el.content_container);\n\n\t\tthis._el.line_left = DOM.create(\"div\", \"tl-timemarker-line-left\", this._el.timespan);\n\t\tthis._el.line_right = DOM.create(\"div\", \"tl-timemarker-line-right\", this._el.timespan);\n\n\t\t// Thumbnail or Icon\n\t\tif (this.data.media) {\n\t\t\tthis._el.media_container = DOM.create(\"div\", \"tl-timemarker-media-container\", this._el.content);\n\t\t\t// ugh. needs an overhaul\n\t\t\tvar mtd = { url: this.data.media.thumbnail };\n\t\t\tvar thumbnail_media_type = (this.data.media.thumbnail) ? lookupMediaType(mtd, true) : null;\n\t\t\tif (thumbnail_media_type) {\n\t\t\t\tvar thumbnail_media = new thumbnail_media_type.cls(mtd);\n\t\t\t\tthumbnail_media.on(\"loaded\", function () {\n\t\t\t\t\tthis._el.media = DOM.create(\"img\", \"tl-timemarker-media\", this._el.media_container);\n\t\t\t\t\tthis._el.media.src = thumbnail_media.getImageURL();\n\t\t\t\t}.bind(this));\n\t\t\t\tthumbnail_media.loadMedia();\n\t\t\t} else {\n\t\t\t\tvar media_type = lookupMediaType(this.data.media).type;\n\t\t\t\tthis._el.media = DOM.create(\"span\", \"tl-icon-\" + media_type, this._el.media_container);\n\t\t\t}\n\n\t\t}\n\n\n\t\t// Text\n\t\tthis._el.text = DOM.create(\"div\", \"tl-timemarker-text\", this._el.content);\n\t\tthis._text = DOM.create(\"h2\", \"tl-headline\", this._el.text);\n\t\tif (this.data.text.headline && this.data.text.headline != \"\") {\n\t\t\tthis._text.innerHTML = unlinkify(this.data.text.headline);\n\t\t} else if (this.data.text.text && this.data.text.text != \"\") {\n\t\t\tthis._text.innerHTML = unlinkify(this.data.text.text);\n\t\t} else if (this.data.media && this.data.media.caption && this.data.media.caption != \"\") {\n\t\t\tthis._text.innerHTML = unlinkify(this.data.media.caption);\n\t\t}\n\n\n\n\t\t// Fire event that the slide is loaded\n\t\tthis.onLoaded();\n\n\t}\n\n\t_initEvents() {\n\t\tDOMEvent.addListener(this._el.container, 'click', this._onMarkerClick, this);\n\t}\n\n\t// Update Display\n\t_updateDisplay(width, height, layout) {\n\n\t\tif (width) {\n\t\t\tthis.options.width = width;\n\t\t}\n\n\t\tif (height) {\n\t\t\tthis.options.height = height;\n\t\t}\n\n\t}\n\n}\n\n\nclassMixin(TimeMarker, Events, DOMMixins)\n","import { classMixin, mergeData } from \"../core/Util\"\nimport Events from \"../core/Events\"\nimport { easeInOutQuint, easeOutStrong } from \"../animation/Ease\";\nimport { Animate } from \"../animation/Animate\"\nimport { touch as BROWSER_TOUCH } from \"../core/Browser\";\nimport { DOMEvent } from \"../dom/DOMEvent\"\n\nexport default class Swipable {\n\n\tconstructor(drag_elem, move_elem, options) {\n\t\t\n\t\t// DOM ELements \n\t\tthis._el = {\n\t\t\tdrag: drag_elem,\n\t\t\tmove: drag_elem\n\t\t};\n\n\t\tthis.mousedrag = {\n\t\t\tdown:\t\t\"mousedown\",\n\t\t\tup:\t\t\t\"mouseup\",\n\t\t\tleave:\t\t\"mouseleave\",\n\t\t\tmove:\t\t\"mousemove\"\n\t\t}\n\n\t\tthis.touchdrag = {\n\t\t\tdown:\t\t\"touchstart\",\n\t\t\tup:\t\t\t\"touchend\",\n\t\t\tleave:\t\t\"mouseleave\",\n\t\t\tmove:\t\t\"touchmove\"\n\t\t}\n\n\t\tif (move_elem) {\n\t\t\tthis._el.move = move_elem;\n\t\t}\n\t\t\n\t\t//Options\n\t\tthis.options = {\n\t\t\tsnap: false,\n\t\t\tenable:\t{\n\t\t\t\tx: true,\n\t\t\t\ty: true\n\t\t\t},\n\t\t\tconstraint: {\n\t\t\t\ttop: false,\n\t\t\t\tbottom: false,\n\t\t\t\tleft: 0,\n\t\t\t\tright: false\n\t\t\t},\n\t\t\tmomentum_multiplier: \t2000,\n\t\t\tduration: \t\t\t\t1000,\n\t\t\tease: \t\t\t\t\teaseInOutQuint\n\t\t};\n\t\t\n\t\t\n\t\t// Animation Object\n\t\tthis.animator = null;\n\t\t\n\t\t// Drag Event Type\n\t\tthis.dragevent = this.mousedrag;\n\t\t\n\t\tif (BROWSER_TOUCH) {\n\t\t\tthis.dragevent = this.touchdrag;\n\t\t}\n\t\t\n\t\t// Draggable Data\n\t\tthis.data = {\n\t\t\tsliding:\t\tfalse,\n\t\t\tdirection: \t\t\"none\",\n\t\t\tpagex: {\n\t\t\t\tstart:\t\t0,\n\t\t\t\tend:\t\t0\n\t\t\t},\n\t\t\tpagey: {\n\t\t\t\tstart:\t\t0,\n\t\t\t\tend:\t\t0\n\t\t\t},\n\t\t\tpos: {\n\t\t\t\tstart: {\n\t\t\t\t\tx: 0,\n\t\t\t\t\ty:0\n\t\t\t\t},\n\t\t\t\tend: {\n\t\t\t\t\tx: 0,\n\t\t\t\t\ty:0\n\t\t\t\t}\n\t\t\t},\n\t\t\tnew_pos: {\n\t\t\t\tx: 0,\n\t\t\t\ty: 0\n\t\t\t},\n\t\t\tnew_pos_parent: {\n\t\t\t\tx: 0,\n\t\t\t\ty: 0\n\t\t\t},\n\t\t\ttime: {\n\t\t\t\tstart:\t\t0,\n\t\t\t\tend:\t\t0\n\t\t\t},\n\t\t\ttouch:\t\t\tfalse\n\t\t};\n\t\t\n\t\t// Merge Data and Options\n\t\tmergeData(this.options, options);\n\t\t\n\t\t\n\t}\n\t\n\tenable(e) {\n\t\tDOMEvent.addListener(this._el.drag, this.dragevent.down, this._onDragStart, this);\n\t\tDOMEvent.addListener(this._el.drag, this.dragevent.up, this._onDragEnd, this);\n\t\t\n\t\tthis.data.pos.start = 0; \n\t\tthis._el.move.style.left = this.data.pos.start.x + \"px\";\n\t\tthis._el.move.style.top = this.data.pos.start.y + \"px\";\n\t\tthis._el.move.style.position = \"absolute\";\n\t\t//this._el.move.style.zIndex = \"11\";\n\t\t//this._el.move.style.cursor = \"move\";\n\t}\n\t\n\tdisable() {\n\t\tDOMEvent.removeListener(this._el.drag, this.dragevent.down, this._onDragStart, this);\n\t\tDOMEvent.removeListener(this._el.drag, this.dragevent.up, this._onDragEnd, this);\n\t}\n\t\n\tstopMomentum() {\n\t\tif (this.animator) {\n\t\t\tthis.animator.stop();\n\t\t}\n\n\t}\n\t\n\tupdateConstraint(c) {\n\t\tthis.options.constraint = c;\n\t\t\n\t\t// Temporary until issues are fixed\n\t\t\n\t}\n\t\n\t/*\tPrivate Methods\n\t================================================== */\n\t_onDragStart(e) {\n\t\t\n\t\tif (this.animator) {\n\t\t\tthis.animator.stop();\n\t\t}\n\t\t\n\t\tif (BROWSER_TOUCH) {\n\t\t\tif (e.originalEvent) {\n\t\t\t\tthis.data.pagex.start = e.originalEvent.touches[0].screenX;\n\t\t\t\tthis.data.pagey.start = e.originalEvent.touches[0].screenY;\n\t\t\t} else {\n\t\t\t\tthis.data.pagex.start = e.targetTouches[0].screenX;\n\t\t\t\tthis.data.pagey.start = e.targetTouches[0].screenY;\n\t\t\t}\n\t\t} else {\n\t\t\tthis.data.pagex.start = e.pageX;\n\t\t\tthis.data.pagey.start = e.pageY;\n\t\t}\n\t\t\n\t\t// Center element to finger or mouse\n\t\tif (this.options.enable.x) {\n\t\t\t//this._el.move.style.left = this.data.pagex.start - (this._el.move.offsetWidth / 2) + \"px\";\n\t\t}\n\t\t\n\t\tif (this.options.enable.y) {\n\t\t\t//this._el.move.style.top = this.data.pagey.start - (this._el.move.offsetHeight / 2) + \"px\";\n\t\t}\n\t\t\n\t\tthis.data.pos.start = {x:this._el.move.offsetLeft, y:this._el.move.offsetTop};\n\t\t\n\t\t\n\t\tthis.data.time.start \t\t\t= new Date().getTime();\n\t\t\n\t\tthis.fire(\"dragstart\", this.data);\n\t\tDOMEvent.addListener(this._el.drag, this.dragevent.move, this._onDragMove, this);\n\t\tDOMEvent.addListener(this._el.drag, this.dragevent.leave, this._onDragEnd, this);\n\t}\n\t\n\t_onDragEnd(e) {\n\t\tthis.data.sliding = false;\n\t\tDOMEvent.removeListener(this._el.drag, this.dragevent.move, this._onDragMove, this);\n\t\tDOMEvent.removeListener(this._el.drag, this.dragevent.leave, this._onDragEnd, this);\n\t\tthis.fire(\"dragend\", this.data);\n\t\t\n\t\t// momentum\n\t\tthis._momentum();\n\t}\n\t\n\t_onDragMove(e) {\n\t\tvar change = {\n\t\t\tx:0,\n\t\t\ty:0\n\t\t}\n\t\t//e.preventDefault();\n\t\tthis.data.sliding = true;\n\t\t\n\t\tif (BROWSER_TOUCH) {\n\t\t\tif (e.originalEvent) {\n\t\t\t\tthis.data.pagex.end = e.originalEvent.touches[0].screenX;\n\t\t\t\tthis.data.pagey.end = e.originalEvent.touches[0].screenY;\n\t\t\t} else {\n\t\t\t\tthis.data.pagex.end = e.targetTouches[0].screenX;\n\t\t\t\tthis.data.pagey.end = e.targetTouches[0].screenY;\n\t\t\t}\n\n\t\t} else {\n\t\t\tthis.data.pagex.end = e.pageX;\n\t\t\tthis.data.pagey.end = e.pageY;\n\t\t}\n\t\t\n\t\tchange.x = this.data.pagex.start - this.data.pagex.end;\n\t\tchange.y = this.data.pagey.start - this.data.pagey.end;\n\t\t\n\t\tthis.data.pos.end = {x:this._el.drag.offsetLeft, y:this._el.drag.offsetTop};\n\t\t\n\t\tthis.data.new_pos.x = -(change.x - this.data.pos.start.x);\n\t\tthis.data.new_pos.y = -(change.y - this.data.pos.start.y );\n\t\t\n\t\tif (this.options.enable.x && ( Math.abs(change.x) > Math.abs(change.y) ) ) {\n\t\t\te.preventDefault();\n\t\t\tthis._el.move.style.left = this.data.new_pos.x + \"px\";\n\t\t}\n\t\t\n\t\tif (this.options.enable.y && ( Math.abs(change.y) > Math.abs(change.y) ) ) {\n\t\t\te.preventDefault();\n\t\t\tthis._el.move.style.top = this.data.new_pos.y + \"px\";\n\t\t}\n\t\t\n\t\tthis.fire(\"dragmove\", this.data);\n\t}\n\t\n\t_momentum() {\n\t\tvar pos_adjust = {\n\t\t\t\tx: 0,\n\t\t\t\ty: 0,\n\t\t\t\ttime: 0\n\t\t\t},\n\t\t\tpos_change = {\n\t\t\t\tx: 0,\n\t\t\t\ty: 0,\n\t\t\t\ttime: 0\n\t\t\t},\n\t\t\tswipe_detect = {\n\t\t\t\tx: false,\n\t\t\t\ty: false\n\t\t\t},\n\t\t\tswipe = false,\n\t\t\tswipe_direction = \"\";\n\t\t\n\t\t\n\t\tthis.data.direction = null;\n\t\t\n\t\tpos_adjust.time = (new Date().getTime() - this.data.time.start) * 10;\n\t\tpos_change.time = (new Date().getTime() - this.data.time.start) * 10;\n\t\t\n\t\tpos_change.x = this.options.momentum_multiplier * (Math.abs(this.data.pagex.end) - Math.abs(this.data.pagex.start));\n\t\tpos_change.y = this.options.momentum_multiplier * (Math.abs(this.data.pagey.end) - Math.abs(this.data.pagey.start));\n\t\t\n\t\tpos_adjust.x = Math.round(pos_change.x / pos_change.time);\n\t\tpos_adjust.y = Math.round(pos_change.y / pos_change.time);\n\t\t\n\t\tthis.data.new_pos.x = Math.min(this.data.new_pos.x + pos_adjust.x);\n\t\tthis.data.new_pos.y = Math.min(this.data.new_pos.y + pos_adjust.y);\n\t\t\n\t\tif (!this.options.enable.x) {\n\t\t\tthis.data.new_pos.x = this.data.pos.start.x;\n\t\t} else if (this.options.constraint.left && this.data.new_pos.x > this.options.constraint.left) {\n\t\t\tthis.data.new_pos.x = this.options.constraint.left;\n\t\t}\n\t\t\n\t\tif (!this.options.enable.y) {\n\t\t\tthis.data.new_pos.y = this.data.pos.start.y;\n\t\t} else if (this.data.new_pos.y < 0) {\n\t\t\tthis.data.new_pos.y = 0;\n\t\t}\n\t\t\n\t\t// Detect Swipe\n\t\tif (pos_change.time < 2000) {\n\t\t\tswipe = true;\n\t\t}\n\t\t\n\t\t\n\t\tif (this.options.enable.x && this.options.enable.y) {\n\t\t\tif (Math.abs(pos_change.x) > Math.abs(pos_change.y)) {\n\t\t\t\tswipe_detect.x = true;\n\t\t\t} else {\n\t\t\t\tswipe_detect.y = true;\n\t\t\t}\n\t\t} else if (this.options.enable.x) {\n\t\t\tif (Math.abs(pos_change.x) > Math.abs(pos_change.y)) {\n\t\t\t\tswipe_detect.x = true;\n\t\t\t}\n\t\t} else {\n\t\t\tif (Math.abs(pos_change.y) > Math.abs(pos_change.x)) {\n\t\t\t\tswipe_detect.y = true;\n\t\t\t}\n\t\t}\n\t\t\n\t\t// Detect Direction and long swipe\n\t\tif (swipe_detect.x) {\n\t\t\t\n\t\t\t// Long Swipe\n\t\t\tif (Math.abs(pos_change.x) > (this._el.drag.offsetWidth/2)) {\n\t\t\t\tswipe = true;\n\t\t\t}\n\t\t\t\n\t\t\tif (Math.abs(pos_change.x) > 10000) {\n\t\t\t\tthis.data.direction = \"left\";\n\t\t\t\tif (pos_change.x > 0) {\n\t\t\t\t\tthis.data.direction = \"right\";\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t\n\t\tif (swipe_detect.y) {\n\t\t\t\n\t\t\t// Long Swipe\n\t\t\tif (Math.abs(pos_change.y) > (this._el.drag.offsetHeight/2)) {\n\t\t\t\tswipe = true;\n\t\t\t}\n\t\t\t\n\t\t\tif (Math.abs(pos_change.y) > 10000) {\n\t\t\t\tthis.data.direction = \"up\";\n\t\t\t\tif (pos_change.y > 0) {\n\t\t\t\t\tthis.data.direction = \"down\";\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t\n\t\tif (pos_change.time < 1000 ) {\n\t\t\t\n\t\t} else {\n\t\t\tthis._animateMomentum();\n\t\t}\n\t\t\n\t\tif (swipe && this.data.direction) {\n\t\t\tthis.fire(\"swipe_\" + this.data.direction, this.data);\n\t\t} else if (this.data.direction) {\n\t\t\tthis.fire(\"swipe_nodirection\", this.data);\n\t\t} else if (this.options.snap) {\n\t\t\tthis.animator.stop();\n\t\t\t\n\t\t\tthis.animator = Animate(this._el.move, {\n\t\t\t\ttop: \t\tthis.data.pos.start.y,\n\t\t\t\tleft: \t\tthis.data.pos.start.x,\n\t\t\t\tduration: \tthis.options.duration,\n\t\t\t\teasing: \teaseOutStrong\n\t\t\t});\n\t\t}\n\t\t\n\t}\n\t\n\t\n\t_animateMomentum() {\n\t\tvar pos = {\n\t\t\t\tx: this.data.new_pos.x,\n\t\t\t\ty: this.data.new_pos.y\n\t\t\t},\n\t\t\tanimate = {\n\t\t\t\tduration: \tthis.options.duration,\n\t\t\t\teasing: \teaseOutStrong\n\t\t\t};\n\t\t\n\t\tif (this.options.enable.y) {\n\t\t\tif (this.options.constraint.top || this.options.constraint.bottom) {\n\t\t\t\tif (pos.y > this.options.constraint.bottom) {\n\t\t\t\t\tpos.y = this.options.constraint.bottom;\n\t\t\t\t} else if (pos.y < this.options.constraint.top) {\n\t\t\t\t\tpos.y = this.options.constraint.top;\n\t\t\t\t}\n\t\t\t}\n\t\t\tanimate.top = Math.floor(pos.y) + \"px\";\n\t\t}\n\t\t\n\t\tif (this.options.enable.x) {\n\t\t\tif (this.options.constraint.left && pos.x >= this.options.constraint.left) {\n\t\t\t\tpos.x = this.options.constraint.left;\n\t\t\t}\n\t\t\tif (this.options.constraint.right && pos.x < this.options.constraint.right) {\n\t\t\t\tpos.x = this.options.constraint.right;\n\t\t\t}\n\n\t\t\tanimate.left = Math.floor(pos.x) + \"px\";\n\t\t}\n\t\t\n\t\tthis.animator = Animate(this._el.move, animate);\n\t\t\n\t\tthis.fire(\"momentum\", this.data);\n\t}\n}\n\nclassMixin(Swipable, Events)","import { classMixin, mergeData, findNextGreater, findNextLesser, isEven, findArrayNumberByUniqueID, trace } from \"../core/Util\"\nimport Events from \"../core/Events\"\nimport { DOMMixins } from \"../dom/DOMMixins\"\nimport { DOMEvent } from \"../dom/DOMEvent\"\nimport * as DOM from \"../dom/DOM\"\nimport { easeInOutQuint } from \"../animation/Ease\";\nimport { TimeScale } from \"./TimeScale\"\nimport { TimeGroup } from \"./TimeGroup\"\nimport { TimeEra } from \"./TimeEra\"\nimport { TimeAxis } from \"./TimeAxis\"\nimport { TimeMarker } from \"./TimeMarker\"\nimport Swipable from \"../ui/Swipable\"\nimport { Animate } from \"../animation/Animate\"\n\n\n\nexport class TimeNav {\n\n constructor(elem, timeline_config, options, language) {\n this.language = language // just passing through for TimeAxis. Is this a bad code smell?\n // DOM ELEMENTS\n this._el = {\n parent: {},\n container: {},\n slider: {},\n slider_background: {},\n line: {},\n marker_container_mask: {},\n marker_container: {},\n marker_item_container: {},\n timeaxis: {},\n timeaxis_background: {},\n attribution: {}\n };\n\n this.collapsed = false;\n\n if (typeof elem === 'object') {\n this._el.container = elem;\n } else {\n this._el.container = DOM.get(elem);\n }\n\n this.config = timeline_config;\n\n //Options\n this.options = {\n width: 600,\n height: 600,\n duration: 1000,\n ease: easeInOutQuint,\n has_groups: false,\n optimal_tick_width: 50,\n scale_factor: 2, // How many screen widths wide should the timeline be\n marker_padding: 5,\n timenav_height_min: 150, // Minimum timenav height\n marker_height_min: 30, // Minimum Marker Height\n marker_width_min: 100, // Minimum Marker Width\n zoom_sequence: [0.5, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89] // Array of Fibonacci numbers for TimeNav zoom levels http://www.maths.surrey.ac.uk/hosted-sites/R.Knott/Fibonacci/fibtable.html\n };\n\n // Animation\n this.animator = null;\n\n // Ready state\n this.ready = false;\n\n // Markers Array\n this._markers = [];\n\n // Eras Array\n this._eras = [];\n this.has_eras = false;\n\n // Groups Array\n this._groups = [];\n\n // Row Height\n this._calculated_row_height = 100;\n\n // Current Marker\n this.current_id = \"\";\n\n // TimeScale\n this.timescale = {};\n\n // TimeAxis\n this.timeaxis = {};\n\n // Max Rows\n this.max_rows = 6;\n\n // Animate CSS\n this.animate_css = false;\n\n // Swipe Object\n this._swipable;\n\n // Merge Data and Options\n mergeData(this.options, options);\n\n }\n\n init() {\n this._initLayout();\n this._initEvents();\n this._initData();\n this.updateDisplay();\n\n this._onLoaded();\n }\n\n /*\tPublic\n ================================================== */\n positionMarkers(fast) {\n // POSITION X\n for (var i = 0; i < this._markers.length; i++) {\n var pos = this.timescale.getPositionInfo(i);\n if (fast) {\n this._markers[i].setClass(\"tl-timemarker tl-timemarker-fast\");\n } else {\n this._markers[i].setClass(\"tl-timemarker\");\n }\n this._markers[i].setPosition({ left: pos.start });\n this._markers[i].setWidth(pos.width);\n };\n }\n\n /*\tUpdate Display\n ================================================== */\n updateDisplay(width, height, animate) {\n let reposition_markers = false;\n if (width) {\n if (this.options.width == 0 && width > 0) {\n reposition_markers = true;\n }\n this.options.width = width;\n }\n if (height && height != this.options.height) {\n this.options.height = height;\n this.timescale = this._getTimeScale();\n }\n\n // Size Markers\n this._assignRowsToMarkers();\n\n // Size swipable area\n this._el.slider_background.style.width = this.timescale.getPixelWidth() + this.options.width + \"px\";\n this._el.slider_background.style.left = -(this.options.width / 2) + \"px\";\n this._el.slider.style.width = this.timescale.getPixelWidth() + this.options.width + \"px\";\n\n // Update Swipable constraint\n this._swipable.updateConstraint({ top: false, bottom: false, left: (this.options.width / 2), right: -(this.timescale.getPixelWidth() - (this.options.width / 2)) });\n\n if (reposition_markers) {\n this._drawTimeline()\n }\n // Go to the current slide\n this.goToId(this.current_id, true);\n }\n\n\n /*\tTimeScale\n ================================================== */\n _getTimeScale() {\n /* maybe the establishing config values (marker_height_min and max_rows) should be\n separated from making a TimeScale object, which happens in another spot in this file with duplicate mapping of properties of this TimeNav into the TimeScale options object? */\n // Set Max Rows\n var marker_height_min = 0;\n try {\n marker_height_min = parseInt(this.options.marker_height_min);\n } catch (e) {\n trace(\"Invalid value for marker_height_min option.\");\n marker_height_min = 30;\n }\n if (marker_height_min == 0) {\n trace(\"marker_height_min option must not be zero.\")\n marker_height_min = 30;\n }\n this.max_rows = Math.round((this.options.height - this._el.timeaxis_background.offsetHeight - (this.options.marker_padding)) / marker_height_min);\n if (this.max_rows < 1) {\n this.max_rows = 1;\n }\n return new TimeScale(this.config, {\n display_width: this._el.container.offsetWidth,\n screen_multiplier: this.options.scale_factor,\n max_rows: this.max_rows\n\n });\n }\n\n _updateTimeScale(new_scale) {\n this.options.scale_factor = new_scale;\n this._updateDrawTimeline();\n }\n\n zoomIn() { // move the the next \"higher\" scale factor\n var new_scale = findNextGreater(this.options.zoom_sequence, this.options.scale_factor);\n this.setZoomFactor(new_scale);\n }\n\n zoomOut() { // move the the next \"lower\" scale factor\n var new_scale = findNextLesser(this.options.zoom_sequence, this.options.scale_factor);\n this.setZoomFactor(new_scale);\n }\n\n setZoom(level) {\n var zoom_factor = this.options.zoom_sequence[level];\n if (typeof(zoom_factor) == 'number') {\n this.setZoomFactor(zoom_factor);\n } else {\n console.warn(\"Invalid zoom level. Please use an index number between 0 and \" + (this.options.zoom_sequence.length - 1));\n }\n }\n\n setZoomFactor(factor) {\n if (factor <= this.options.zoom_sequence[0]) {\n this.fire(\"zoomtoggle\", { zoom: \"out\", show: false });\n } else {\n this.fire(\"zoomtoggle\", { zoom: \"out\", show: true });\n }\n\n if (factor >= this.options.zoom_sequence[this.options.zoom_sequence.length - 1]) {\n this.fire(\"zoomtoggle\", { zoom: \"in\", show: false });\n } else {\n this.fire(\"zoomtoggle\", { zoom: \"in\", show: true });\n }\n\n if (factor == 0) {\n console.warn(\"Zoom factor must be greater than zero. Using 0.1\");\n factor = 0.1;\n }\n this.options.scale_factor = factor;\n //this._updateDrawTimeline(true);\n this.goToId(this.current_id, !this._updateDrawTimeline(true), true);\n }\n\n /*\tGroups\n ================================================== */\n _createGroups() {\n this._groups = [];\n var group_labels = this.timescale.getGroupLabels();\n\n if (group_labels) {\n this.options.has_groups = true;\n for (var i = 0; i < group_labels.length; i++) {\n this._createGroup(group_labels[i]);\n }\n }\n\n }\n\n _createGroup(group_label) {\n var group = new TimeGroup(group_label);\n this._addGroup(group);\n this._groups.push(group);\n }\n\n _addGroup(group) {\n group.addTo(this._el.container);\n\n }\n\n _positionGroups() {\n if (this.options.has_groups) {\n var available_height = (this.options.height - this._el.timeaxis_background.offsetHeight),\n group_height = Math.floor((available_height / this.timescale.getNumberOfRows()) - this.options.marker_padding),\n group_labels = this.timescale.getGroupLabels();\n\n for (var i = 0, group_rows = 0; i < this._groups.length; i++) {\n var group_y = Math.floor(group_rows * (group_height + this.options.marker_padding));\n var group_hide = false;\n if (group_y > (available_height - this.options.marker_padding)) {\n group_hide = true;\n }\n\n this._groups[i].setRowPosition(group_y, this._calculated_row_height + this.options.marker_padding / 2);\n this._groups[i].setAlternateRowColor(isEven(i), group_hide);\n\n group_rows += this._groups[i].data.rows; // account for groups spanning multiple rows\n }\n }\n }\n\n /*\tMarkers\n ================================================== */\n _addMarker(marker) {\n marker.addTo(this._el.marker_item_container);\n marker.on('markerclick', this._onMarkerClick, this);\n marker.on('added', this._onMarkerAdded, this);\n }\n\n _createMarker(data, n) {\n var marker = new TimeMarker(data, this.options);\n this._addMarker(marker);\n if (n < 0) {\n this._markers.push(marker);\n } else {\n this._markers.splice(n, 0, marker);\n }\n }\n\n _createMarkers(array) {\n for (var i = 0; i < array.length; i++) {\n this._createMarker(array[i], -1);\n }\n }\n\n _removeMarker(marker) {\n marker.removeFrom(this._el.marker_item_container);\n //marker.off('added', this._onMarkerRemoved, this);\n }\n\n _destroyMarker(n) {\n this._removeMarker(this._markers[n]);\n this._markers.splice(n, 1);\n }\n\n _calculateMarkerHeight(h) {\n return ((h / this.timescale.getNumberOfRows()) - this.options.marker_padding);\n }\n\n _calculateRowHeight(h) {\n return (h / this.timescale.getNumberOfRows());\n }\n\n _calculateAvailableHeight() {\n return (this.options.height - this._el.timeaxis_background.offsetHeight - (this.options.marker_padding));\n }\n\n _calculateMinimumTimeNavHeight() {\n return (this.timescale.getNumberOfRows() * this.options.marker_height_min) + this._el.timeaxis_background.offsetHeight + (this.options.marker_padding);\n\n }\n\n getMinimumHeight() {\n return this._calculateMinimumTimeNavHeight();\n }\n\n _assignRowsToMarkers() {\n var available_height = this._calculateAvailableHeight(),\n marker_height = this._calculateMarkerHeight(available_height);\n\n\n this._positionGroups();\n\n this._calculated_row_height = this._calculateRowHeight(available_height);\n\n for (var i = 0; i < this._markers.length; i++) {\n\n // Set Height\n this._markers[i].setHeight(marker_height);\n\n //Position by Row\n var row = this.timescale.getPositionInfo(i).row;\n\n var marker_y = Math.floor(row * (marker_height + this.options.marker_padding)) + this.options.marker_padding;\n\n var remainder_height = available_height - marker_y + this.options.marker_padding;\n this._markers[i].setRowPosition(marker_y, remainder_height);\n };\n\n }\n\n _resetMarkersActive() {\n for (var i = 0; i < this._markers.length; i++) {\n this._markers[i].setActive(false);\n };\n }\n\n _findMarkerIndex(n) {\n var _n = -1;\n if (typeof n == 'string' || n instanceof String) {\n _n = findArrayNumberByUniqueID(n, this._markers, \"unique_id\", _n);\n }\n return _n;\n }\n\n /*\tERAS\n ================================================== */\n _createEras(array) {\n for (var i = 0; i < array.length; i++) {\n var data = array[i];\n var era = new TimeEra(data.start_date,\n data.end_date,\n data.headline,\n this.options);\n this._eras.push(era);\n era.addTo(this._el.marker_item_container);\n era.on('added', this._onEraAdded, this);\n }\n }\n\n _positionEras(fast) {\n\n var era_color = 0;\n // POSITION X\n for (var i = 0; i < this._eras.length; i++) {\n var pos = {\n start: 0,\n end: 0,\n width: 0\n };\n\n pos.start = this.timescale.getPosition(this._eras[i].start_date.getTime());\n pos.end = this.timescale.getPosition(this._eras[i].end_date.getTime());\n pos.width = pos.end - pos.start;\n\n if (fast) {\n this._eras[i].setClass(\"tl-timeera tl-timeera-fast\");\n } else {\n this._eras[i].setClass(\"tl-timeera\");\n }\n this._eras[i].setPosition({ left: pos.start });\n this._eras[i].setWidth(pos.width);\n\n era_color++;\n if (era_color > 5) {\n era_color = 0;\n }\n this._eras[i].setColor(era_color);\n };\n\n }\n\n /*\tPublic\n ================================================== */\n\n // Create a marker\n createMarker(d, n) {\n this._createMarker(d, n);\n }\n\n // Create many markers from an array\n createMarkers(array) {\n this._createMarkers(array);\n }\n\n // Destroy marker by index\n destroyMarker(n) {\n this._destroyMarker(n);\n }\n\n // Destroy marker by id\n destroyMarkerId(id) {\n this.destroyMarker(this._findMarkerIndex(id));\n }\n\n /*\tNavigation\n ================================================== */\n goTo(n, fast, css_animation) {\n var self = this,\n _ease = this.options.ease,\n _duration = this.options.duration,\n _n = (n < 0) ? 0 : n;\n\n // Set Marker active state\n this._resetMarkersActive();\n if (n >= 0 && n < this._markers.length) {\n this._markers[n].setActive(true);\n }\n // Stop animation\n if (this.animator) {\n this.animator.stop();\n }\n\n if (fast) {\n this._el.slider.className = \"tl-timenav-slider\";\n this._el.slider.style.left = -this._markers[_n].getLeft() + (this.options.width / 2) + \"px\";\n } else {\n if (css_animation) {\n this._el.slider.className = \"tl-timenav-slider tl-timenav-slider-animate\";\n this.animate_css = true;\n this._el.slider.style.left = -this._markers[_n].getLeft() + (this.options.width / 2) + \"px\";\n } else {\n this._el.slider.className = \"tl-timenav-slider\";\n this.animator = Animate(this._el.slider, {\n left: -this._markers[_n].getLeft() + (this.options.width / 2) + \"px\",\n duration: _duration,\n easing: _ease\n });\n }\n }\n\n if (n >= 0 && n < this._markers.length) {\n this.current_id = this._markers[n].data.unique_id;\n } else {\n this.current_id = '';\n }\n }\n\n goToId(id, fast, css_animation) {\n this.goTo(this._findMarkerIndex(id), fast, css_animation);\n }\n\n /*\tEvents\n ================================================== */\n _onLoaded() {\n this.ready = true;\n this.fire(\"loaded\", this.config);\n }\n\n _onMarkerAdded(e) {\n this.fire(\"dateAdded\", this.config);\n }\n\n _onEraAdded(e) {\n this.fire(\"eraAdded\", this.config);\n }\n\n _onMarkerRemoved(e) {\n this.fire(\"dateRemoved\", this.config);\n }\n\n _onMarkerClick(e) {\n // Go to the clicked marker\n this.goToId(e.unique_id);\n this.fire(\"change\", { unique_id: e.unique_id });\n }\n\n _onMouseScroll(e) {\n\n var delta = 0,\n scroll_to = 0,\n constraint = {\n right: -(this.timescale.getPixelWidth() - (this.options.width / 2)),\n left: this.options.width / 2\n };\n if (!e) {\n e = window.event;\n }\n if (e.originalEvent) {\n e = e.originalEvent;\n }\n\n // Webkit and browsers able to differntiate between up/down and left/right scrolling\n if (typeof e.wheelDeltaX != 'undefined') {\n delta = e.wheelDeltaY / 6;\n if (Math.abs(e.wheelDeltaX) > Math.abs(e.wheelDeltaY)) {\n delta = e.wheelDeltaX / 6;\n } else {\n //delta = e.wheelDeltaY/6;\n delta = 0;\n }\n }\n if (delta) {\n if (e.preventDefault) {\n e.preventDefault();\n }\n e.returnValue = false;\n }\n // Stop from scrolling too far\n scroll_to = parseInt(this._el.slider.style.left.replace(\"px\", \"\")) + delta;\n\n\n if (scroll_to > constraint.left) {\n scroll_to = constraint.left;\n } else if (scroll_to < constraint.right) {\n scroll_to = constraint.right;\n }\n\n if (this.animate_css) {\n this._el.slider.className = \"tl-timenav-slider\";\n this.animate_css = false;\n }\n\n this._el.slider.style.left = scroll_to + \"px\";\n\n }\n\n _onDragMove(e) {\n if (this.animate_css) {\n this._el.slider.className = \"tl-timenav-slider\";\n this.animate_css = false;\n }\n\n }\n\n /*\tPrivate Methods\n ================================================== */\n\n _drawTimeline(fast) {\n this.timescale = this._getTimeScale();\n this.timeaxis.drawTicks(this.timescale, this.options.optimal_tick_width);\n this.positionMarkers(fast);\n this._assignRowsToMarkers();\n this._createGroups();\n this._positionGroups();\n\n if (this.has_eras) {\n\n this._positionEras(fast);\n }\n }\n\n _updateDrawTimeline(check_update) {\n var do_update = false;\n\n // Check to see if redraw is needed\n if (check_update) {\n /* keep this aligned with _getTimeScale or reduce code duplication */\n var temp_timescale = new TimeScale(this.config, {\n display_width: this._el.container.offsetWidth,\n screen_multiplier: this.options.scale_factor,\n max_rows: this.max_rows\n\n });\n\n if (this.timescale.getMajorScale() == temp_timescale.getMajorScale() &&\n this.timescale.getMinorScale() == temp_timescale.getMinorScale()) {\n do_update = true;\n }\n } else {\n do_update = true;\n }\n\n // Perform update or redraw\n if (do_update) {\n this.timescale = this._getTimeScale();\n this.timeaxis.positionTicks(this.timescale, this.options.optimal_tick_width);\n this.positionMarkers();\n this._assignRowsToMarkers();\n this._positionGroups();\n if (this.has_eras) {\n this._positionEras();\n }\n this.updateDisplay();\n } else {\n this._drawTimeline(true);\n }\n\n return do_update;\n\n }\n\n\n /*\tInit\n ================================================== */\n _initLayout() {\n // Create Layout\n this._el.attribution = DOM.create('div', 'tl-attribution', this._el.container);\n this._el.line = DOM.create('div', 'tl-timenav-line', this._el.container);\n this._el.slider = DOM.create('div', 'tl-timenav-slider', this._el.container);\n this._el.slider_background = DOM.create('div', 'tl-timenav-slider-background', this._el.slider);\n this._el.marker_container_mask = DOM.create('div', 'tl-timenav-container-mask', this._el.slider);\n this._el.marker_container = DOM.create('div', 'tl-timenav-container', this._el.marker_container_mask);\n this._el.marker_item_container = DOM.create('div', 'tl-timenav-item-container', this._el.marker_container);\n this._el.timeaxis = DOM.create('div', 'tl-timeaxis', this._el.slider);\n this._el.timeaxis_background = DOM.create('div', 'tl-timeaxis-background', this._el.container);\n\n\n // Knight Lab Logo\n this._el.attribution.innerHTML = \"TimelineJS\"\n\n // Time Axis\n this.timeaxis = new TimeAxis(this._el.timeaxis, this.options, this.language);\n\n // Swipable\n this._swipable = new Swipable(this._el.slider_background, this._el.slider, {\n enable: { x: true, y: false },\n constraint: { top: false, bottom: false, left: (this.options.width / 2), right: false },\n snap: false\n });\n this._swipable.enable();\n\n }\n\n _initEvents() {\n // Drag Events\n this._swipable.on('dragmove', this._onDragMove, this);\n\n // Scroll Events\n DOMEvent.addListener(this._el.container, 'mousewheel', this._onMouseScroll, this);\n DOMEvent.addListener(this._el.container, 'DOMMouseScroll', this._onMouseScroll, this);\n }\n\n _initData() {\n // Create Markers and then add them\n this._createMarkers(this.config.events);\n\n if (this.config.eras && this.config.eras.length > 0) {\n this.has_eras = true;\n this._createEras(this.config.eras);\n }\n\n this._drawTimeline();\n\n }\n}\n\nclassMixin(TimeNav, Events, DOMMixins)","import { addClass } from \"../dom/DOMUtil\"\nimport { I18NMixins } from \"../language/I18NMixins\";\nimport Events from \"../core/Events\";\nimport { DOMMixins } from \"../dom/DOMMixins\";\nimport { classMixin, mergeData, trim } from \"../core/Util\"\nimport * as DOM from \"../dom/DOM\"\nimport { Animate } from \"../animation/Animate\"\nimport { easeInSpline } from \"../animation/Ease\"\nimport * as Browser from \"../core/Browser\"\nimport { lookupMediaType } from \"../media/MediaType\";\nimport { Text } from \"../media/Media\"\n\nexport class Slide {\n\n constructor(data, options, title_slide, language) {\n if (language) {\n this.setLanguage(language)\n }\n\n // DOM Elements\n this._el = {\n container: {},\n scroll_container: {},\n background: {},\n content_container: {},\n content: {}\n };\n\n // Components\n this._media = null;\n this._mediaclass = {};\n this._text = {};\n this._background_media = null;\n\n // State\n this._state = {\n loaded: false\n };\n\n this.has = {\n headline: false,\n text: false,\n media: false,\n title: false,\n background: {\n image: false,\n color: false,\n color_value: \"\"\n }\n }\n\n this.has.title = title_slide;\n\n // Data\n this.data = {\n unique_id: null,\n background: null,\n start_date: null,\n end_date: null,\n location: null,\n text: null,\n media: null,\n autolink: true\n };\n\n // Options\n this.options = {\n // animation\n duration: 1000,\n slide_padding_lr: 40,\n ease: easeInSpline,\n width: 600,\n height: 600,\n skinny_size: 650,\n media_name: \"\"\n };\n\n // Actively Displaying\n this.active = false;\n\n // Animation Object\n this.animator = {};\n\n // Merge Data and Options\n mergeData(this.options, options);\n mergeData(this.data, data);\n\n this._initLayout();\n this._initEvents();\n\n\n }\n\n /*\tAdding, Hiding, Showing etc\n ================================================== */\n show() {\n this.animator = Animate(this._el.slider_container, {\n left: -(this._el.container.offsetWidth * n) + \"px\",\n duration: this.options.duration,\n easing: this.options.ease\n });\n }\n\n hide() {\n\n }\n\n setActive(is_active) {\n this.active = is_active;\n\n if (this.active) {\n if (this.data.background) {\n this.fire(\"background_change\", this.has.background);\n }\n this.loadMedia();\n } else {\n this.stopMedia();\n }\n }\n\n addTo(container) {\n container.appendChild(this._el.container);\n //this.onAdd();\n }\n\n removeFrom(container) {\n container.removeChild(this._el.container);\n }\n\n updateDisplay(width, height, layout) {\n var content_width,\n content_padding_left = this.options.slide_padding_lr,\n content_padding_right = this.options.slide_padding_lr;\n\n if (width) {\n this.options.width = width;\n } else {\n this.options.width = this._el.container.offsetWidth;\n }\n\n content_width = this.options.width - (this.options.slide_padding_lr * 2);\n\n if (Browser.mobile && (this.options.width <= this.options.skinny_size)) {\n content_padding_left = 0;\n content_padding_right = 0;\n content_width = this.options.width;\n } else if (layout == \"landscape\") {\n\n } else if (this.options.width <= this.options.skinny_size) {\n content_padding_left = 50;\n content_padding_right = 50;\n content_width = this.options.width - content_padding_left - content_padding_right;\n } else {\n\n }\n\n this._el.content.style.paddingLeft = content_padding_left + \"px\";\n this._el.content.style.paddingRight = content_padding_right + \"px\";\n this._el.content.style.width = content_width + \"px\";\n\n if (height) {\n this.options.height = height;\n //this._el.scroll_container.style.height\t\t= this.options.height + \"px\";\n\n } else {\n this.options.height = this._el.container.offsetHeight;\n }\n\n if (this._media) {\n\n if (!this.has.text && this.has.headline) {\n this._media.updateDisplay(content_width, (this.options.height - this._text.headlineHeight()), layout);\n } else if (!this.has.text && !this.has.headline) {\n this._media.updateDisplay(content_width, this.options.height, layout);\n } else if (this.options.width <= this.options.skinny_size) {\n this._media.updateDisplay(content_width, this.options.height, layout);\n } else {\n this._media.updateDisplay(content_width / 2, this.options.height, layout);\n }\n }\n\n this._updateBackgroundDisplay();\n }\n\n loadMedia() {\n var self = this;\n\n if (this._media && !this._state.loaded) {\n this._media.loadMedia();\n this._state.loaded = true;\n }\n\n if (this._background_media && !this._background_media._state.loaded) {\n this._background_media.on(\"loaded\", function() {\n self._updateBackgroundDisplay();\n });\n this._background_media.loadMedia();\n }\n }\n\n stopMedia() {\n if (this._media && this._state.loaded) {\n this._media.stopMedia();\n }\n }\n\n getBackground() {\n return this.has.background;\n }\n\n scrollToTop() {\n this._el.container.scrollTop = 0;\n }\n\n getFormattedDate() {\n\n if (trim(this.data.display_date).length > 0) {\n return this.data.display_date;\n }\n var date_text = \"\";\n\n if (!this.has.title) {\n if (this.data.end_date) {\n date_text = \" — \" + this.data.end_date.getDisplayDate(this.getLanguage());\n }\n if (this.data.start_date) {\n date_text = this.data.start_date.getDisplayDate(this.getLanguage()) + date_text;\n }\n }\n return date_text;\n }\n\n /*\tEvents\n ================================================== */\n\n\n /*\tPrivate Methods\n ================================================== */\n _initLayout() {\n // Create Layout\n this._el.container = DOM.create(\"div\", \"tl-slide\");\n\n if (this.has.title) {\n this._el.container.className = \"tl-slide tl-slide-titleslide\";\n }\n\n if (this.data.unique_id) {\n this._el.container.id = this.data.unique_id;\n }\n this._el.scroll_container = DOM.create(\"div\", \"tl-slide-scrollable-container\", this._el.container);\n this._el.content_container = DOM.create(\"div\", \"tl-slide-content-container\", this._el.scroll_container);\n this._el.content = DOM.create(\"div\", \"tl-slide-content\", this._el.content_container);\n this._el.background = DOM.create(\"div\", \"tl-slide-background\", this._el.container);\n // Style Slide Background\n if (this.data.background) {\n if (this.data.background.url) {\n var media_type = lookupMediaType(this.data.background, true);\n if (media_type) {\n this._background_media = new media_type.cls(this.data.background, { background: 1 });\n\n this.has.background.image = true;\n this._el.container.className += ' tl-full-image-background';\n this.has.background.color_value = \"#000\";\n this._el.background.style.display = \"block\";\n }\n }\n if (this.data.background.color) {\n this.has.background.color = true;\n this._el.container.className += ' tl-full-color-background';\n this.has.background.color_value = this.data.background.color;\n //this._el.container.style.backgroundColor = this.data.background.color;\n //this._el.background.style.backgroundColor \t= this.data.background.color;\n //this._el.background.style.display \t\t\t= \"block\";\n }\n if (this.data.background.text_background) {\n this._el.container.className += ' tl-text-background';\n }\n\n }\n\n\n\n // Determine Assets for layout and loading\n if (this.data.media && this.data.media.url && this.data.media.url != \"\") {\n this.has.media = true;\n }\n if (this.data.text && this.data.text.text) {\n this.has.text = true;\n }\n if (this.data.text && this.data.text.headline) {\n this.has.headline = true;\n }\n\n // Create Media\n if (this.has.media) {\n // Determine the media type\n this.data.media.mediatype = lookupMediaType(this.data.media);\n this.options.media_name = this.data.media.mediatype.name;\n this.options.media_type = this.data.media.mediatype.type;\n this.options.autolink = this.data.autolink;\n\n // Create a media object using the matched class name\n this._media = new this.data.media.mediatype.cls(this.data.media, this.options, this.getLanguage());\n }\n\n // Create Text\n if (this.has.text || this.has.headline) {\n this._text = new Text(this.data.text, { title: this.has.title, language: this.options.language, autolink: this.data.autolink });\n this._text.addDateText(this.getFormattedDate());\n }\n\n\n\n // Add to DOM\n if (!this.has.text && !this.has.headline && this.has.media) {\n addClass(this._el.container, 'tl-slide-media-only');\n this._media.addTo(this._el.content);\n } else if (this.has.headline && this.has.media && !this.has.text) {\n addClass(this._el.container, 'tl-slide-media-only');\n this._text.addTo(this._el.content);\n this._media.addTo(this._el.content);\n } else if (this.has.text && this.has.media) {\n this._media.addTo(this._el.content);\n this._text.addTo(this._el.content);\n } else if (this.has.text || this.has.headline) {\n addClass(this._el.container, 'tl-slide-text-only');\n this._text.addTo(this._el.content);\n }\n\n // Fire event that the slide is loaded\n this.onLoaded();\n\n }\n\n _initEvents() {\n\n }\n\n _updateBackgroundDisplay() {\n if (this._background_media && this._background_media._state.loaded) {\n this._el.background.style.backgroundImage = \"url('\" + this._background_media.getImageURL(this.options.width, this.options.height) + \"')\";\n }\n }\n\n}\nclassMixin(Slide, I18NMixins, Events, DOMMixins)","import Events from \"../core/Events\";\nimport { DOMMixins } from \"../dom/DOMMixins\";\nimport { classMixin, mergeData, unlinkify } from \"../core/Util\"\nimport * as DOM from \"../dom/DOM\"\nimport { DOMEvent } from \"../dom/DOMEvent\"\nimport * as Browser from \"../core/Browser\"\n\nexport class SlideNav {\n\t\n\tconstructor(data, options, add_to_container) {\n\t\t// DOM ELEMENTS\n\t\tthis._el = {\n\t\t\tcontainer: {},\n\t\t\tcontent_container: {},\n\t\t\ticon: {},\n\t\t\ttitle: {},\n\t\t\tdescription: {}\n\t\t};\n\t\n\t\t// Media Type\n\t\tthis.mediatype = {};\n\t\t\n\t\t// Data\n\t\tthis.data = {\n\t\t\ttitle: \"Navigation\",\n\t\t\tdescription: \"Description\",\n\t\t\tdate: \"Date\"\n\t\t};\n\t\n\t\t//Options\n\t\tthis.options = {\n\t\t\tdirection: \t\t\t\"previous\"\n\t\t};\n\t\n\t\tthis.animator = null;\n\t\t\n\t\t// Merge Data and Options\n\t\tmergeData(this.options, options);\n\t\tmergeData(this.data, data);\n\t\t\n\t\t\n\t\tthis._el.container = DOM.create(\"div\", \"tl-slidenav-\" + this.options.direction);\n\t\t\n\t\tif (Browser.mobile) {\n\t\t\tthis._el.container.setAttribute(\"ontouchstart\",\" \");\n\t\t}\n\t\t\n\t\tthis._initLayout();\n\t\tthis._initEvents();\n\t\t\n\t\tif (add_to_container) {\n\t\t\tadd_to_container.appendChild(this._el.container);\n\t\t};\n\t\t\n\t}\n\t\n\t/*\tUpdate Content\n\t================================================== */\n\tupdate(slide) {\n\t\tvar d = {\n\t\t\ttitle: \"\",\n\t\t\tdescription: \"\",\n\t\t\tdate: slide.getFormattedDate()\n\t\t};\n\t\t\n\t\tif (slide.data.text) {\n\t\t\tif (slide.data.text.headline) {\n\t\t\t\td.title = slide.data.text.headline;\n\t\t\t}\n\t\t}\n\n\t\tthis._update(d);\n\t}\n\t\n\t/*\tColor\n\t================================================== */\n\tsetColor(inverted) {\n\t\tif (inverted) {\n\t\t\tthis._el.content_container.className = 'tl-slidenav-content-container tl-slidenav-inverted';\n\t\t} else {\n\t\t\tthis._el.content_container.className = 'tl-slidenav-content-container';\n\t\t}\n\t}\n\t\n\t/*\tEvents\n\t================================================== */\n\t_onMouseClick() {\n\t\tthis.fire(\"clicked\", this.options);\n\t}\n\t\n\t/*\tPrivate Methods\n\t================================================== */\n\t_update(d) {\n\t\t// update data\n\t\tthis.data = mergeData(this.data, d);\n\t\t\n\t\t// Title\n\t\tthis._el.title.innerHTML = unlinkify(this.data.title);\n\t\t\n\t\t// Date\n\t\tthis._el.description.innerHTML\t= unlinkify(this.data.date);\n\t}\n\t\n\t_initLayout () {\n\t\t\n\t\t// Create Layout\n\t\tthis._el.content_container\t\t\t= DOM.create(\"div\", \"tl-slidenav-content-container\", this._el.container);\n\t\tthis._el.icon\t\t\t\t\t\t= DOM.create(\"div\", \"tl-slidenav-icon\", this._el.content_container);\n\t\tthis._el.title = DOM.create(\"div\", \"tl-slidenav-title\", this._el.content_container);\n\t\tthis._el.description = DOM.create(\"div\", \"tl-slidenav-description\", this._el.content_container);\n\t\t\n\t\tthis._el.icon.innerHTML\t\t\t\t= \" \"\n\t\t\n\t\tthis._update();\n\t}\n\t\n\t_initEvents () {\n\t\tDOMEvent.addListener(this._el.container, 'click', this._onMouseClick, this);\n\t}\n\t\n\t\n}\n\nclassMixin(SlideNav, DOMMixins, Events)\n","import { I18NMixins } from \"../language/I18NMixins\";\nimport Events from \"../core/Events\";\nimport { easeInOutQuint } from \"../animation/Ease\"\nimport { classMixin, mergeData, unique_ID, findArrayNumberByUniqueID, hexToRgb, trace } from \"../core/Util\"\nimport { Animate } from \"../animation/Animate\"\nimport * as DOM from \"../dom/DOM\"\nimport { DOMEvent } from \"../dom/DOMEvent\"\nimport * as Browser from \"../core/Browser\"\nimport { addClass } from \"../dom/DOMUtil\"\nimport Swipable from \"../ui/Swipable\";\nimport Message from \"../ui/Message\"\nimport { Slide } from \"./Slide\"\nimport { SlideNav } from \"./SlideNav\"\n\nexport class StorySlider {\n constructor(elem, data, options, language) {\n\n if (language) {\n this.setLanguage(language)\n }\n\n // DOM ELEMENTS\n this._el = {\n container: {},\n background: {},\n slider_container_mask: {},\n slider_container: {},\n slider_item_container: {}\n };\n\n this._nav = {};\n this._nav.previous = {};\n this._nav.next = {};\n\n // Slide Spacing\n this.slide_spacing = 0;\n\n // Slides Array\n this._slides = [];\n\n // Swipe Object\n this._swipable;\n\n // Preload Timer\n this.preloadTimer;\n\n // Message\n this._message;\n\n // Current Slide\n this.current_id = '';\n\n // Data Object\n this.data = {};\n\n this.options = {\n id: \"\",\n layout: \"portrait\",\n width: 600,\n height: 600,\n default_bg_color: { r: 255, g: 255, b: 255 },\n slide_padding_lr: 40, // padding on slide of slide\n start_at_slide: 1,\n slide_default_fade: \"0%\", // landscape fade\n // animation\n duration: 1000,\n ease: easeInOutQuint,\n // interaction\n dragging: true,\n trackResize: true\n };\n\n // Main element ID\n if (typeof elem === 'object') {\n this._el.container = elem;\n this.options.id = unique_ID(6, \"tl\");\n } else {\n this.options.id = elem;\n this._el.container = DOM.get(elem);\n }\n\n if (!this._el.container.id) {\n this._el.container.id = this.options.id;\n }\n\n // Animation Object\n this.animator = null;\n\n // Merge Data and Options\n mergeData(this.options, options);\n mergeData(this.data, data);\n\n }\n\n init() {\n this._initLayout();\n this._initEvents();\n this._initData();\n this.updateDisplay();\n\n // Go to initial slide\n this.goTo(this.options.start_at_slide);\n\n this._onLoaded();\n }\n\n /* Slides\n ================================================== */\n _addSlide(slide) {\n slide.addTo(this._el.slider_item_container);\n slide.on('added', this._onSlideAdded, this);\n slide.on('background_change', this._onBackgroundChange, this);\n }\n\n _createSlide(d, title_slide, n) {\n var slide = new Slide(d, this.options, title_slide, this.getLanguage());\n this._addSlide(slide);\n if (n < 0) {\n this._slides.push(slide);\n } else {\n this._slides.splice(n, 0, slide);\n }\n }\n\n _createSlides(array) {\n for (var i = 0; i < array.length; i++) {\n if (array[i].unique_id == \"\") {\n array[i].unique_id = unique_ID(6, \"tl-slide\");\n }\n this._createSlide(array[i], false, -1);\n }\n }\n\n _removeSlide(slide) {\n slide.removeFrom(this._el.slider_item_container);\n slide.off('added', this._onSlideRemoved, this);\n slide.off('background_change', this._onBackgroundChange);\n }\n\n _destroySlide(n) {\n this._removeSlide(this._slides[n]);\n this._slides.splice(n, 1);\n }\n\n _findSlideIndex(n) {\n var _n = n;\n if (typeof n == 'string' || n instanceof String) {\n _n = findArrayNumberByUniqueID(n, this._slides, \"unique_id\");\n }\n return _n;\n }\n\n /*\tPublic\n ================================================== */\n updateDisplay(width, height, animate, layout) {\n var nav_pos, _layout;\n\n if (typeof layout === 'undefined') {\n _layout = this.options.layout;\n } else {\n _layout = layout;\n }\n\n this.options.layout = _layout;\n\n if (width) {\n this.options.width = width;\n } else {\n this.options.width = this._el.container.offsetWidth;\n }\n\n if (height) {\n this.options.height = height;\n } else {\n this.options.height = this._el.container.offsetHeight;\n }\n\n this.slide_spacing = this.options.width * 2;\n\n // position navigation\n nav_pos = (this.options.height / 2);\n this._nav.next.setPosition({ top: nav_pos });\n this._nav.previous.setPosition({ top: nav_pos });\n\n\n // Position slides\n for (var i = 0; i < this._slides.length; i++) {\n this._slides[i].updateDisplay(this.options.width, this.options.height, _layout);\n this._slides[i].setPosition({ left: (this.slide_spacing * i), top: 0 });\n\n };\n\n // Go to the current slide\n this.goToId(this.current_id, true, true);\n }\n\n\n // Create a slide\n createSlide(d, n) {\n this._createSlide(d, false, n);\n }\n\n // Create Many Slides from an array\n createSlides(array) {\n this._createSlides(array);\n }\n\n // Destroy slide by index\n destroySlide(n) {\n this._destroySlide(n);\n }\n\n // Destroy slide by id\n destroySlideId(id) {\n this.destroySlide(this._findSlideIndex(id));\n }\n\n /*\tNavigation\n ================================================== */\n goTo(n, fast, displayupdate) {\n n = parseInt(n);\n if (isNaN(n)) n = 0;\n\n var self = this;\n\n this.changeBackground({ color_value: \"\", image: false });\n\n // Clear Preloader Timer\n if (this.preloadTimer) {\n clearTimeout(this.preloadTimer);\n }\n\n // Set Slide Active State\n for (var i = 0; i < this._slides.length; i++) {\n this._slides[i].setActive(false);\n }\n\n if (n < this._slides.length && n >= 0) {\n this.current_id = this._slides[n].data.unique_id;\n\n // Stop animation\n if (this.animator) {\n this.animator.stop();\n }\n if (this._swipable) {\n this._swipable.stopMomentum();\n }\n\n if (fast) {\n this._el.slider_container.style.left = -(this.slide_spacing * n) + \"px\";\n this._onSlideChange(displayupdate);\n } else {\n this.animator = Animate(this._el.slider_container, {\n left: -(this.slide_spacing * n) + \"px\",\n duration: this.options.duration,\n easing: this.options.ease,\n complete: this._onSlideChange(displayupdate)\n });\n }\n\n // Set Slide Active State\n this._slides[n].setActive(true);\n\n // Update Navigation and Info\n if (this._slides[n + 1]) {\n this.showNav(this._nav.next, true);\n this._nav.next.update(this._slides[n + 1]);\n } else {\n this.showNav(this._nav.next, false);\n }\n if (this._slides[n - 1]) {\n this.showNav(this._nav.previous, true);\n this._nav.previous.update(this._slides[n - 1]);\n } else {\n this.showNav(this._nav.previous, false);\n }\n\n // Preload Slides\n this.preloadTimer = setTimeout(function() {\n self.preloadSlides(n);\n }, this.options.duration);\n }\n }\n\n goToId(id, fast, displayupdate) {\n this.goTo(this._findSlideIndex(id), fast, displayupdate);\n }\n\n preloadSlides(n) {\n if (this._slides[n + 1]) {\n this._slides[n + 1].loadMedia();\n this._slides[n + 1].scrollToTop();\n }\n if (this._slides[n + 2]) {\n this._slides[n + 2].loadMedia();\n this._slides[n + 2].scrollToTop();\n }\n if (this._slides[n - 1]) {\n this._slides[n - 1].loadMedia();\n this._slides[n - 1].scrollToTop();\n }\n if (this._slides[n - 2]) {\n this._slides[n - 2].loadMedia();\n this._slides[n - 2].scrollToTop();\n }\n }\n\n next() {\n var n = this._findSlideIndex(this.current_id);\n if ((n + 1) < (this._slides.length)) {\n this.goTo(n + 1);\n } else {\n this.goTo(n);\n }\n }\n\n previous() {\n var n = this._findSlideIndex(this.current_id);\n if (n - 1 >= 0) {\n this.goTo(n - 1);\n } else {\n this.goTo(n);\n }\n }\n\n showNav(nav_obj, show) {\n\n if (this.options.width <= 500 && Browser.mobile) {\n\n } else {\n if (show) {\n nav_obj.show();\n } else {\n nav_obj.hide();\n }\n\n }\n }\n\n\n\n changeBackground(bg) {\n var bg_color = { r: 256, g: 256, b: 256 },\n bg_color_rgb;\n\n if (bg.color_value && bg.color_value != \"\") {\n bg_color = hexToRgb(bg.color_value);\n if (!bg_color) {\n trace(\"Invalid color value \" + bg.color_value);\n bg_color = this.options.default_bg_color;\n }\n } else {\n bg_color = this.options.default_bg_color;\n bg.color_value = \"rgb(\" + bg_color.r + \" , \" + bg_color.g + \", \" + bg_color.b + \")\";\n }\n\n bg_color_rgb = bg_color.r + \",\" + bg_color.g + \",\" + bg_color.b;\n this._el.background.style.backgroundImage = \"none\";\n\n\n if (bg.color_value) {\n this._el.background.style.backgroundColor = bg.color_value;\n } else {\n this._el.background.style.backgroundColor = \"transparent\";\n }\n\n if (bg_color.r < 255 || bg_color.g < 255 || bg_color.b < 255 || bg.image) {\n this._nav.next.setColor(true);\n this._nav.previous.setColor(true);\n } else {\n this._nav.next.setColor(false);\n this._nav.previous.setColor(false);\n }\n }\n /*\tPrivate Methods\n ================================================== */\n\n // Update Display\n\n // Reposition and redraw slides\n _updateDrawSlides() {\n var _layout = this.options.layout;\n\n for (var i = 0; i < this._slides.length; i++) {\n this._slides[i].updateDisplay(this.options.width, this.options.height, _layout);\n this._slides[i].setPosition({ left: (this.slide_spacing * i), top: 0 });\n };\n\n this.goToId(this.current_id, true, false);\n }\n\n\n /*\tInit\n ================================================== */\n _initLayout() {\n\n addClass(this._el.container, 'tl-storyslider');\n\n // Create Layout\n this._el.slider_container_mask = DOM.create('div', 'tl-slider-container-mask', this._el.container);\n this._el.background = DOM.create('div', 'tl-slider-background tl-animate', this._el.container);\n this._el.slider_container = DOM.create('div', 'tl-slider-container tlanimate', this._el.slider_container_mask);\n this._el.slider_item_container = DOM.create('div', 'tl-slider-item-container', this._el.slider_container);\n\n\n // Update Size\n this.options.width = this._el.container.offsetWidth;\n this.options.height = this._el.container.offsetHeight;\n\n // Create Navigation\n this._nav.previous = new SlideNav({ title: \"Previous\", description: \"description\" }, { direction: \"previous\" });\n this._nav.next = new SlideNav({ title: \"Next\", description: \"description\" }, { direction: \"next\" });\n\n // add the navigation to the dom\n this._nav.next.addTo(this._el.container);\n this._nav.previous.addTo(this._el.container);\n\n\n\n this._el.slider_container.style.left = \"0px\";\n\n if (Browser.touch) {\n //this._el.slider_touch_mask = DOM.create('div', 'tl-slider-touch-mask', this._el.slider_container_mask);\n this._swipable = new Swipable(this._el.slider_container_mask, this._el.slider_container, {\n enable: { x: true, y: false },\n snap: true\n });\n this._swipable.enable();\n\n // Message\n this._message = new Message(this._el.container, {\n message_class: \"tl-message-full\",\n message_icon_class: \"tl-icon-swipe-left\"\n },\n this.getLanguage());\n this._message.updateMessage(this._(\"swipe_to_navigate\"));\n this._message.addTo(this._el.container);\n }\n\n }\n\n _initEvents() {\n this._nav.next.on('clicked', this._onNavigation, this);\n this._nav.previous.on('clicked', this._onNavigation, this);\n\n if (this._message) {\n this._message.on('clicked', this._onMessageClick, this);\n }\n\n if (this._swipable) {\n this._swipable.on('swipe_left', this._onNavigation, this);\n this._swipable.on('swipe_right', this._onNavigation, this);\n this._swipable.on('swipe_nodirection', this._onSwipeNoDirection, this);\n }\n\n\n }\n\n _initData() {\n if (this.data.title) {\n this._createSlide(this.data.title, true, -1);\n }\n this._createSlides(this.data.events);\n }\n\n /*\tEvents\n ================================================== */\n _onBackgroundChange(e) {\n var n = this._findSlideIndex(this.current_id);\n var slide_background = this._slides[n].getBackground();\n this.changeBackground(e);\n this.fire(\"colorchange\", slide_background);\n }\n\n _onMessageClick(e) {\n this._message.hide();\n }\n\n _onSwipeNoDirection(e) {\n this.goToId(this.current_id);\n }\n\n _onNavigation(e) {\n\n if (e.direction == \"next\" || e.direction == \"left\") {\n this.next();\n } else if (e.direction == \"previous\" || e.direction == \"right\") {\n this.previous();\n }\n this.fire(\"nav_\" + e.direction, this.data);\n }\n\n _onSlideAdded(e) {\n trace(\"slideadded\")\n this.fire(\"slideAdded\", this.data);\n }\n\n _onSlideRemoved(e) {\n this.fire(\"slideRemoved\", this.data);\n }\n\n _onSlideChange(displayupdate) {\n if (!displayupdate) {\n this.fire(\"change\", { unique_id: this.current_id });\n }\n }\n\n _onMouseClick(e) {\n\n }\n\n _fireMouseEvent(e) {\n if (!this._loaded) {\n return;\n }\n\n var type = e.type;\n type = (type === 'mouseenter' ? 'mouseover' : (type === 'mouseleave' ? 'mouseout' : type));\n\n if (!this.hasEventListeners(type)) {\n return;\n }\n\n if (type === 'contextmenu') {\n DOMEvent.preventDefault(e);\n }\n\n this.fire(type, {\n latlng: \"something\", //this.mouseEventToLatLng(e),\n layerPoint: \"something else\" //this.mouseEventToLayerPoint(e)\n });\n }\n\n _onLoaded() {\n this.fire(\"loaded\", this.data);\n }\n\n\n}\n\nclassMixin(StorySlider, I18NMixins, Events)","import * as DOM from \"../dom/DOM\"\nimport * as Browser from \"../core/Browser\"\nimport Events from \"../core/Events\";\nimport { DOMMixins } from \"../dom/DOMMixins\"\nimport { easeInOutQuint } from \"../animation/Ease\"\nimport { classMixin, mergeData } from \"../core/Util\"\nimport { addClass, removeClass } from \"../dom/DOMUtil\"\nimport { DOMEvent } from \"../dom/DOMEvent\"\n\nexport class MenuBar {\n\tconstructor(elem, parent_elem, options) {\n\t\t// DOM ELEMENTS\n\t\tthis._el = {\n\t\t\tparent: {},\n\t\t\tcontainer: {},\n\t\t\tbutton_backtostart: {},\n\t\t\tbutton_zoomin: {},\n\t\t\tbutton_zoomout: {},\n\t\t\tarrow: {},\n\t\t\tline: {},\n\t\t\tcoverbar: {},\n\t\t\tgrip: {}\n\t\t};\n\n\t\tthis.collapsed = false;\n\n\t\tif (typeof elem === 'object') {\n\t\t\tthis._el.container = elem;\n\t\t} else {\n\t\t\tthis._el.container = DOM.get(elem);\n\t\t}\n\n\t\tif (parent_elem) {\n\t\t\tthis._el.parent = parent_elem;\n\t\t}\n\n\t\t//Options\n\t\tthis.options = {\n\t\t\twidth: \t\t\t\t\t600,\n\t\t\theight: \t\t\t\t600,\n\t\t\tduration: \t\t\t\t1000,\n\t\t\tease: \t\t\t\t\teaseInOutQuint,\n\t\t\tmenubar_default_y: \t\t0\n\t\t};\n\n\t\t// Animation\n\t\tthis.animator = {};\n\n\t\t// Merge Data and Options\n\t\tmergeData(this.options, options);\n\n\t\tthis._initLayout();\n\t\tthis._initEvents();\n\t}\n\n\t/*\tPublic\n\t================================================== */\n\tshow(d) {\n\n\t\tvar duration = this.options.duration;\n\t\tif (d) {\n\t\t\tduration = d;\n\t\t}\n\t}\n\n\thide(top) {\n\t}\n\n\ttoogleZoomIn(show) {\n\t\tif (show) {\n removeClass(this._el.button_zoomin,'tl-menubar-button-inactive');\n\t\t} else {\n addClass(this._el.button_zoomin,'tl-menubar-button-inactive');\n\t\t}\n\t}\n\n\ttoogleZoomOut(show) {\n\t\tif (show) {\n removeClass(this._el.button_zoomout,'tl-menubar-button-inactive');\n\t\t} else {\n addClass(this._el.button_zoomout,'tl-menubar-button-inactive');\n\t\t}\n\t}\n\n\tsetSticky(y) {\n\t\tthis.options.menubar_default_y = y;\n\t}\n\n\t/*\tColor\n\t================================================== */\n\tsetColor(inverted) {\n\t\tif (inverted) {\n\t\t\tthis._el.container.className = 'tl-menubar tl-menubar-inverted';\n\t\t} else {\n\t\t\tthis._el.container.className = 'tl-menubar';\n\t\t}\n\t}\n\n\t/*\tUpdate Display\n\t================================================== */\n\tupdateDisplay(w, h, a, l) {\n\t\tthis._updateDisplay(w, h, a, l);\n\t}\n\n\n\t/*\tEvents\n\t================================================== */\n\t_onButtonZoomIn(e) {\n\t\tthis.fire(\"zoom_in\", e);\n\t}\n\n\t_onButtonZoomOut(e) {\n\t\tthis.fire(\"zoom_out\", e);\n\t}\n\n\t_onButtonBackToStart(e) {\n\t\tthis.fire(\"back_to_start\", e);\n\t}\n\n\n\t/*\tPrivate Methods\n\t================================================== */\n\t_initLayout () {\n\n\t\t// Create Layout\n\t\tthis._el.button_zoomin = DOM.create('span', 'tl-menubar-button', this._el.container);\n\t\tthis._el.button_zoomout = DOM.create('span', 'tl-menubar-button', this._el.container);\n\t\tthis._el.button_backtostart = DOM.create('span', 'tl-menubar-button', this._el.container);\n\n\t\tif (Browser.mobile) {\n\t\t\tthis._el.container.setAttribute(\"ontouchstart\",\" \");\n\t\t}\n\n\t\tthis._el.button_backtostart.innerHTML\t\t= \"\";\n\t\tthis._el.button_zoomin.innerHTML\t\t\t= \"\";\n\t\tthis._el.button_zoomout.innerHTML\t\t\t= \"\";\n\n\n\t}\n\n\t_initEvents () {\n\t\tDOMEvent.addListener(this._el.button_backtostart, 'click', this._onButtonBackToStart, this);\n\t\tDOMEvent.addListener(this._el.button_zoomin, 'click', this._onButtonZoomIn, this);\n\t\tDOMEvent.addListener(this._el.button_zoomout, 'click', this._onButtonZoomOut, this);\n\t}\n\n\t// Update Display\n\t_updateDisplay(width, height, animate) {\n\n\t\tif (width) {\n\t\t\tthis.options.width = width;\n\t\t}\n\t\tif (height) {\n\t\t\tthis.options.height = height;\n\t\t}\n\t}\n\n}\n\nclassMixin(MenuBar, DOMMixins, Events)\n","import * as DOM from \"../dom/DOM\"\nimport { addClass } from \"../dom/DOMUtil\"\nimport { hexToRgb, mergeData, classMixin, isTrue, trace, addTraceHandler } from \"../core/Util\";\nimport { easeInOutQuint, easeOutStrong } from \"../animation/Ease\";\nimport Message from \"../ui/Message\"\nimport { Language, fallback } from \"../language/Language\"\nimport { I18NMixins } from \"../language/I18NMixins\";\nimport Events from \"../core/Events\";\nimport { makeConfig } from \"../core/ConfigFactory\"\nimport { TimelineConfig } from \"../core/TimelineConfig\"\nimport { TimeNav } from \"../timenav/TimeNav\"\nimport * as Browser from \"../core/Browser\"\nimport { Animate } from \"../animation/Animate\"\nimport { StorySlider } from \"../slider/StorySlider\"\nimport { MenuBar } from \"../ui/MenuBar\"\nimport { loadCSS, loadJS } from \"../core/Load\";\n\nlet script_src_url = null;\nif (document) {\n let script_tags = document.getElementsByTagName('script');\n if (script_tags && script_tags.length > 0) {\n script_src_url = script_tags[script_tags.length - 1].src;\n }\n}\n\nfunction make_keydown_handler(timeline) {\n return function(event) {\n if (timeline.config) {\n var keyName = event.key;\n var currentSlide = timeline._getSlideIndex(self.current_id);\n var _n = timeline.config.events.length - 1;\n var lastSlide = timeline.config.title ? _n + 1 : _n;\n var firstSlide = 0;\n\n if (keyName == 'ArrowLeft') {\n if (currentSlide != firstSlide) {\n timeline.goToPrev();\n }\n } else if (keyName == 'ArrowRight') {\n if (currentSlide != lastSlide) {\n timeline.goToNext();\n }\n }\n }\n }\n}\n\n/**\n * Primary entry point for using TimelineJS.\n * @constructor\n * @param {HTMLElement|string} elem - the HTML element, or its ID, to which \n * the Timeline should be bound\n * @param {object} - a JavaScript object conforming to the TimelineJS \n * configuration format\n * @param {object} [options] - a JavaScript object specifying \n * presentation options\n */\nclass Timeline {\n constructor(elem, data, options) {\n if (!options) {\n options = {}\n }\n this.ready = false;\n this._el = {\n container: DOM.get(elem),\n storyslider: {},\n timenav: {},\n menubar: {}\n };\n\n if (options.lang && !options.language) {\n options.language = options.lang;\n }\n\n /** @type {Language} */\n this.language = fallback;\n\n /** @type {StorySlider} */\n this._storyslider = {};\n\n /** @type {TimeNav} */\n this._timenav = {};\n\n /** @type {MenuBar} */\n this._menubar = {};\n\n // Loaded State\n this._loaded = { storyslider: false, timenav: false };\n\n /** @type {TimelineConfig} */\n this.config = null;\n\n this.options = {\n script_path: \"https://cdn.knightlab.com/libs/timeline3/latest/js/\", // as good a default as any\n height: this._el.container.offsetHeight,\n width: this._el.container.offsetWidth,\n debug: false,\n font: 'default',\n is_embed: false,\n is_full_embed: false,\n hash_bookmark: false,\n default_bg_color: { r: 255, g: 255, b: 255 },\n scale_factor: 2, // How many screen widths wide should the timeline be\n layout: \"landscape\", // portrait or landscape\n timenav_position: \"bottom\", // timeline on top or bottom\n optimal_tick_width: 60, // optimal distance (in pixels) between ticks on axis\n base_class: \"tl-timeline\", // removing tl-timeline will break all default stylesheets...\n timenav_height: null,\n timenav_height_percentage: 25, // Overrides timenav height as a percentage of the screen\n timenav_mobile_height_percentage: 40, // timenav height as a percentage on mobile devices\n timenav_height_min: 175, // Minimum timenav height\n marker_height_min: 30, // Minimum Marker Height\n marker_width_min: 100, // Minimum Marker Width\n marker_padding: 5, // Top Bottom Marker Padding\n start_at_slide: 0,\n start_at_end: false,\n menubar_height: 0,\n skinny_size: 650,\n medium_size: 800,\n use_bc: false, // Use declared suffix on dates earlier than 0\n // animation\n duration: 1000,\n ease: easeInOutQuint,\n // interaction\n dragging: true,\n trackResize: true,\n map_type: \"stamen:toner-lite\",\n slide_padding_lr: 100, // padding on slide of slide\n slide_default_fade: \"0%\", // landscape fade\n zoom_sequence: [0.5, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89], // Array of Fibonacci numbers for TimeNav zoom levels\n language: \"en\",\n ga_property_id: null,\n track_events: ['back_to_start', 'nav_next', 'nav_previous', 'zoom_in', 'zoom_out'],\n theme: null,\n // sheets_proxy value should be suitable for simply postfixing with the Google Sheets CSV URL\n // as in include trailing slashes, or '?url=' or whatever. No support right now for anything but\n // postfixing. The default proxy should work in most cases, but only for TimelineJS sheets.\n sheets_proxy: 'https://sheets-proxy.knightlab.com/proxy/',\n soundcite: false,\n };\n\n // Animation Objects\n this.animator_timenav = null;\n this.animator_storyslider = null;\n this.animator_menubar = null;\n\n // Ideally we'd set the language here, but we're bootstrapping and may hit problems\n // before we're able to load it. if it weren't a remote resource, we could probably \n // do it.\n this.message = new Message(this._el.container, { message_class: \"tl-message-full\" });\n\n // Merge Options\n if (typeof(options.default_bg_color) == \"string\") {\n var parsed = hexToRgb(options.default_bg_color); // will clear it out if its invalid\n if (parsed) {\n options.default_bg_color = parsed;\n } else {\n delete options.default_bg_color\n trace(\"Invalid default background color. Ignoring.\");\n }\n }\n mergeData(this.options, options);\n\n if (!(this.options.script_path)) {\n this.options.script_path = this.determineScriptPath()\n }\n\n if (options.soundcite) {\n this.on('ready', () => {\n trace(\"Loading Soundcite resources \")\n loadCSS('https://cdn.knightlab.com/libs/soundcite/latest/css/player.css')\n loadJS('https://cdn.knightlab.com/libs/soundcite/latest/js/soundcite.min.js')\n })\n }\n\n // load font, theme\n this._loadStyles()\n\n\n document.addEventListener(\"keydown\", make_keydown_handler(this));\n window.addEventListener(\"resize\", function(e) {\n this.updateDisplay();\n }.bind(this));\n\n if (this.options.debug) {\n addTraceHandler(console.log)\n }\n\n // Apply base class to container\n addClass(this._el.container, 'tl-timeline');\n\n if (this.options.is_embed) {\n addClass(this._el.container, 'tl-timeline-embed');\n }\n\n if (this.options.is_full_embed) {\n addClass(this._el.container, 'tl-timeline-full-embed');\n }\n\n this._loadLanguage(data);\n\n }\n\n _loadStyles() {\n let font_css_url = null,\n theme_css_url = null;\n\n if (this.options.font && (\n this.options.font.indexOf('http') == 0 ||\n this.options.font.match(/\\.css$/))) {\n font_css_url = this.options.font\n } else if (this.options.font) {\n let fragment = '../css/fonts/font.' + this.options.font.toLowerCase() + '.css'\n font_css_url = new URL(fragment, this.options.script_path).toString()\n }\n\n if (font_css_url) {\n loadCSS(font_css_url)\n }\n\n if (this.options.theme && (\n this.options.theme.indexOf('http') == 0 ||\n this.options.theme.match(/\\.css$/))) {\n theme_css_url = this.options.theme\n } else if (this.options.theme) {\n let fragment = '../css/themes/timeline.theme.' + this.options.theme.toLowerCase() + '.css'\n theme_css_url = new URL(fragment, this.options.script_path).toString()\n }\n\n if (theme_css_url) {\n loadCSS(theme_css_url)\n }\n\n\n }\n\n\n _loadLanguage(data) {\n try {\n var lang = this.options.language\n var script_path = this.options.script_path\n this.language = new Language(lang, script_path)\n this.message.setLanguage(this.language)\n this.options.language = this.language // easiest way to make language available to I18NMixins\n this.showMessage(this._('loading_timeline'))\n this._initData(data)\n } catch (e) {\n this.showMessage(this._translateError(e))\n }\n }\n\n /**\n * Initialize the data for this timeline. If data is a URL, pass it to ConfigFactory\n * to get a TimelineConfig; if data is a TimelineConfig, just use it; otherwise, \n * assume it's a JSON object in the right format, and wrap it in a new TimelineConfig.\n * @param {string|TimelineConfig|object} data\n */\n _initData(data) {\n if (typeof data == 'string') {\n makeConfig(data, {\n callback: function(config) {\n this.setConfig(config);\n }.bind(this),\n sheets_proxy: this.options.sheets_proxy\n });\n } else if (TimelineConfig == data.constructor) {\n this.setConfig(data);\n } else {\n this.setConfig(new TimelineConfig(data));\n }\n }\n\n /**\n * Given an input, if it is a Timeline Error object, look up the\n * appropriate error in the current language and return it, optionally \n * with detail that also comes in the object. Alternatively, pass back\n * the input, which is expected to be a string ready to display.\n * @param {Error|string} e - an Error object which can be localized, \n * or a string message\n */\n _translateError(e) {\n\n if (e.hasOwnProperty('stack')) {\n trace(e.stack);\n }\n if (e.message_key) {\n return this._(e.message_key) + (e.detail ? ' [' + e.detail + ']' : '')\n }\n return e;\n\n }\n\n /**\n * Display a message in the Timeline window.\n * @param {string} msg \n */\n showMessage(msg) {\n if (this.message) {\n this.message.updateMessage(msg);\n } else {\n trace(\"No message display available.\")\n trace(msg);\n }\n }\n /**\n * Not ideal, but if users don't specify the script path, we try to figure it out.\n * The script path is needed to load other languages\n */\n determineScriptPath() {\n let src = null;\n if (script_src_url) { // did we get it when this loaded?\n src = script_src_url;\n } else {\n let script_tag = document.getElementById('timeline-script-tag')\n if (script_tag) {\n src = script_tag.src\n }\n }\n\n if (!src) {\n let script_tags = document.getElementsByTagName('script');\n for (let index = script_tags.length - 1; index >= 0; index--) {\n if (script_tags[index].src) {\n src = script_tags[index].src\n break // if we haven't found anything else, use the latest loaded script\n }\n }\n }\n\n if (src) {\n // +1 to include the trailing slash or concatting for dynamic CSS load won't work.\n return src.substr(0, src.lastIndexOf('/') + 1);\n }\n return '';\n }\n\n\n setConfig(config) {\n this.config = config;\n if (this.config.isValid()) {\n // don't validate if it's already problematic to avoid clutter\n this.config.validate();\n this._validateOptions();\n }\n if (this.config.isValid()) {\n try {\n if (document.readyState === 'loading') { // Loading hasn't finished yet\n document.addEventListener('DOMContentLoaded', this._onDataLoaded.bind(this));\n } else {\n this._onDataLoaded();\n }\n } catch (e) {\n this.showMessage(\"\" + this._('error') + \": \" + this._translateError(e));\n }\n } else {\n var translated_errs = [];\n\n for (var i = 0, errs = this.config.getErrors(); i < errs.length; i++) {\n translated_errs.push(this._translateError(errs[i]));\n }\n\n this.showMessage(\"\" + this._('error') + \": \" + translated_errs.join('
'));\n // should we set 'self.ready'? if not, it won't resize,\n // but most resizing would only work\n // if more setup happens\n }\n }\n\n _onDataLoaded() {\n this.fire(\"dataloaded\");\n this._initLayout();\n this._initEvents();\n this._initAnalytics();\n if (this.message) {\n this.message.hide();\n }\n let callback = (entries, observer) => {\n if (entries.reduce((accum, curr) => accum || curr.isIntersecting, false)) {\n this.updateDisplay()\n }\n }\n let observer = new IntersectionObserver(callback.bind(this))\n observer.observe(this._el.container)\n this.ready = true;\n this.fire(\"ready\")\n\n }\n\n _initLayout() {\n var self = this;\n\n this.message.removeFrom(this._el.container);\n this._el.container.innerHTML = \"\";\n\n // Create Layout\n if (this.options.timenav_position == \"top\") {\n this._el.timenav = DOM.create('div', 'tl-timenav', this._el.container);\n this._el.storyslider = DOM.create('div', 'tl-storyslider', this._el.container);\n } else {\n this._el.storyslider = DOM.create('div', 'tl-storyslider', this._el.container);\n this._el.timenav = DOM.create('div', 'tl-timenav', this._el.container);\n }\n\n this._el.menubar = DOM.create('div', 'tl-menubar', this._el.container);\n\n\n // Initial Default Layout\n this.options.width = this._el.container.offsetWidth;\n this.options.height = this._el.container.offsetHeight;\n // this._el.storyslider.style.top = \"1px\";\n\n // Set TimeNav Height\n this.options.timenav_height = this._calculateTimeNavHeight(this.options.timenav_height);\n\n // Create TimeNav\n this._timenav = new TimeNav(this._el.timenav, this.config, this.options, this.language);\n this._timenav.on('loaded', this._onTimeNavLoaded, this);\n this._timenav.options.height = this.options.timenav_height;\n this._timenav.init();\n\n // intial_zoom cannot be applied before the timenav has been created\n if (this.options.initial_zoom) {\n // at this point, this.options refers to the merged set of options\n this.setZoom(this.options.initial_zoom);\n }\n\n // Create StorySlider\n this._storyslider = new StorySlider(this._el.storyslider, this.config, this.options, this.language);\n this._storyslider.on('loaded', this._onStorySliderLoaded, this);\n this._storyslider.init();\n\n // Create Menu Bar\n this._menubar = new MenuBar(this._el.menubar, this._el.container, this.options);\n\n // LAYOUT\n if (this.options.layout == \"portrait\") {\n this.options.storyslider_height = (this.options.height - this.options.timenav_height - 1);\n } else {\n this.options.storyslider_height = (this.options.height - 1);\n }\n\n\n // Update Display\n this._updateDisplay(this._timenav.options.height, true, 2000);\n\n }\n\n _initEvents() {\n // TimeNav Events\n this._timenav.on('change', this._onTimeNavChange, this);\n this._timenav.on('zoomtoggle', this._onZoomToggle, this);\n\n // StorySlider Events\n this._storyslider.on('change', this._onSlideChange, this);\n this._storyslider.on('colorchange', this._onColorChange, this);\n this._storyslider.on('nav_next', this._onStorySliderNext, this);\n this._storyslider.on('nav_previous', this._onStorySliderPrevious, this);\n\n // Menubar Events\n this._menubar.on('zoom_in', this._onZoomIn, this);\n this._menubar.on('zoom_out', this._onZoomOut, this);\n this._menubar.on('back_to_start', this._onBackToStart, this);\n\n }\n\n _onColorChange(e) {\n this.fire(\"color_change\", { unique_id: this.current_id }, this);\n }\n\n _onSlideChange(e) {\n if (this.current_id != e.unique_id) {\n this.current_id = e.unique_id;\n this._timenav.goToId(this.current_id);\n this._onChange(e);\n }\n }\n\n _onTimeNavChange(e) {\n if (this.current_id != e.unique_id) {\n this.current_id = e.unique_id;\n this._storyslider.goToId(this.current_id);\n this._onChange(e);\n }\n }\n\n _onZoomToggle(e) {\n if (e.zoom == \"in\") {\n this._menubar.toogleZoomIn(e.show);\n } else if (e.zoom == \"out\") {\n this._menubar.toogleZoomOut(e.show);\n }\n\n }\n\n\n\n _onChange(e) {\n this.fire(\"change\", { unique_id: this.current_id }, this);\n if (this.options.hash_bookmark && this.current_id) {\n this._updateHashBookmark(this.current_id);\n }\n }\n\n _onBackToStart(e) {\n this._storyslider.goTo(0);\n this.fire(\"back_to_start\", { unique_id: this.current_id }, this);\n }\n\n _onZoomIn(e) {\n this._timenav.zoomIn();\n this.fire(\"zoom_in\", { zoom_level: this._timenav.options.scale_factor }, this);\n }\n\n _onZoomOut(e) {\n this._timenav.zoomOut();\n this.fire(\"zoom_out\", { zoom_level: this._timenav.options.scale_factor }, this);\n }\n\n _onTimeNavLoaded() {\n this._loaded.timenav = true;\n this._onLoaded();\n }\n\n _onStorySliderLoaded() {\n this._loaded.storyslider = true;\n this._onLoaded();\n }\n\n _onStorySliderNext(e) {\n this.fire(\"nav_next\", e);\n }\n\n _onStorySliderPrevious(e) {\n this.fire(\"nav_previous\", e);\n }\n\n\n _updateDisplay(timenav_height, animate, d) {\n var duration = this.options.duration,\n display_class = this.options.base_class,\n menu_position = 0,\n self = this;\n\n if (d) {\n duration = d;\n }\n\n // Update width and height\n this.options.width = this._el.container.offsetWidth;\n this.options.height = this._el.container.offsetHeight;\n\n // Check if skinny\n if (this.options.width <= this.options.skinny_size) {\n display_class += \" tl-skinny\";\n this.options.layout = \"portrait\";\n } else if (this.options.width <= this.options.medium_size) {\n display_class += \" tl-medium\";\n this.options.layout = \"landscape\";\n } else {\n this.options.layout = \"landscape\";\n }\n\n // Detect Mobile and Update Orientation on Touch devices\n if (Browser.touch) {\n this.options.layout = Browser.orientation();\n }\n\n if (Browser.mobile) {\n display_class += \" tl-mobile\";\n // Set TimeNav Height\n this.options.timenav_height = this._calculateTimeNavHeight(timenav_height, this.options.timenav_mobile_height_percentage);\n } else {\n // Set TimeNav Height\n this.options.timenav_height = this._calculateTimeNavHeight(timenav_height);\n }\n\n // LAYOUT\n if (this.options.layout == \"portrait\") {\n // Portrait\n display_class += \" tl-layout-portrait\";\n\n } else {\n // Landscape\n display_class += \" tl-layout-landscape\";\n\n }\n\n // Set StorySlider Height\n this.options.storyslider_height = (this.options.height - this.options.timenav_height);\n\n // Positon Menu\n if (this.options.timenav_position == \"top\") {\n menu_position = (Math.ceil(this.options.timenav_height) / 2) - (this._el.menubar.offsetHeight / 2) - (39 / 2);\n } else {\n menu_position = Math.round(this.options.storyslider_height + 1 + (Math.ceil(this.options.timenav_height) / 2) - (this._el.menubar.offsetHeight / 2) - (35 / 2));\n }\n\n\n if (animate) {\n\n this._el.timenav.style.height = Math.ceil(this.options.timenav_height) + \"px\";\n\n // Animate StorySlider\n if (this.animator_storyslider) {\n this.animator_storyslider.stop();\n }\n this.animator_storyslider = Animate(this._el.storyslider, {\n height: this.options.storyslider_height + \"px\",\n duration: duration / 2,\n easing: easeOutStrong\n });\n\n // Animate Menubar\n if (this.animator_menubar) {\n this.animator_menubar.stop();\n }\n\n this.animator_menubar = Animate(this._el.menubar, {\n top: menu_position + \"px\",\n duration: duration / 2,\n easing: easeOutStrong\n });\n\n } else {\n // TimeNav\n this._el.timenav.style.height = Math.ceil(this.options.timenav_height) + \"px\";\n\n // StorySlider\n this._el.storyslider.style.height = this.options.storyslider_height + \"px\";\n\n // Menubar\n this._el.menubar.style.top = menu_position + \"px\";\n }\n\n if (this.message) {\n this.message.updateDisplay(this.options.width, this.options.height);\n }\n // Update Component Displays\n this._timenav.updateDisplay(this.options.width, this.options.timenav_height, animate);\n this._storyslider.updateDisplay(this.options.width, this.options.storyslider_height, animate, this.options.layout);\n\n if (this.options.language.direction == 'rtl') {\n display_class += ' tl-rtl';\n }\n\n\n // Apply class\n this._el.container.className = display_class;\n\n }\n\n /**\n * Compute the height of the navigation section of the Timeline, taking \n * into account the possibility of an explicit height or height \n * percentage, but also honoring the `timenav_height_min` option \n * value. If `timenav_height` is specified it takes precedence over \n * `timenav_height_percentage` but in either case, if the resultant \n * pixel height is less than `options.timenav_height_min` then the \n * value of `options.timenav_height_min` will be returned. (A minor \n * adjustment is made to the returned value to account for marker \n * padding.)\n * \n * @param {number} [timenav_height] - an integer value for the desired height in pixels\n * @param {number} [timenav_height_percentage] - an integer between 1 and 100\n */\n _calculateTimeNavHeight(timenav_height, timenav_height_percentage) {\n\n var height = 0;\n\n if (timenav_height) {\n height = timenav_height;\n } else {\n if (this.options.timenav_height_percentage || timenav_height_percentage) {\n if (timenav_height_percentage) {\n height = Math.round((this.options.height / 100) * timenav_height_percentage);\n } else {\n height = Math.round((this.options.height / 100) * this.options.timenav_height_percentage);\n }\n\n }\n }\n\n // Set new minimum based on how many rows needed\n if (this._timenav.ready) {\n if (this.options.timenav_height_min < this._timenav.getMinimumHeight()) {\n this.options.timenav_height_min = this._timenav.getMinimumHeight();\n }\n }\n\n // If height is less than minimum set it to minimum\n if (height < this.options.timenav_height_min) {\n height = this.options.timenav_height_min;\n }\n\n height = height - (this.options.marker_padding * 2);\n\n return height;\n }\n\n _validateOptions() {\n // assumes that this.options and this.config have been set.\n var INTEGER_PROPERTIES = ['timenav_height', 'timenav_height_min', 'marker_height_min', 'marker_width_min', 'marker_padding', 'start_at_slide', 'slide_padding_lr'];\n\n for (var i = 0; i < INTEGER_PROPERTIES.length; i++) {\n var opt = INTEGER_PROPERTIES[i];\n var value = this.options[opt];\n let valid = true;\n if (typeof(value) == 'number') {\n valid = (value == parseInt(value))\n } else if (typeof(value) == \"string\") {\n valid = (value.match(/^\\s*(\\-?\\d+)?\\s*$/));\n }\n if (!valid) {\n this.config.logError({ message_key: 'invalid_integer_option', detail: opt });\n }\n }\n }\n\n /**\n * Given a slide identifier, return the zero-based positional index of\n * that slide. If this timeline has a 'title' slide, it is at position 0\n * and all other slides are numbered after that. If there is no 'title' \n * slide, then the first event slide is at position 0.\n * @param {String} id \n */\n _getSlideIndex(id) {\n if (this.config) {\n if (this.config.title && this.config.title.unique_id == id) {\n return 0;\n }\n for (var i = 0; i < this.config.events.length; i++) {\n if (id == this.config.events[i].unique_id) {\n return this.config.title ? i + 1 : i;\n }\n }\n }\n return -1;\n }\n\n /**\n * Given a slide identifier, return the zero-based positional index of that slide.\n * Does not take the existence of a 'title' slide into account, so if there is a title\n * slide, this value should be one less than calling `_getSlideIndex` with the same\n * identifier. If there is no title slide, `_getSlideIndex` and `_getEventIndex` \n * should return the same value.\n * TODO: does it really make sense to have both `_getSlideIndex` and `_getEventIndex`?\n * @param {String} id \n */\n _getEventIndex(id) {\n for (var i = 0; i < this.config.events.length; i++) {\n if (id == this.config.events[i].unique_id) {\n return i;\n }\n }\n return -1;\n }\n\n _onTimeNavLoaded() {\n this._loaded.timenav = true;\n this._onLoaded();\n }\n\n _onStorySliderLoaded() {\n this._loaded.storyslider = true;\n this._onLoaded();\n }\n\n _onLoaded() {\n if (this._loaded.storyslider && this._loaded.timenav) {\n this.fire(\"loaded\", this.config);\n // Go to proper slide\n if (this.options.hash_bookmark && window.location.hash != \"\") {\n this.goToId(window.location.hash.replace(\"#event-\", \"\"));\n } else {\n if (isTrue(this.options.start_at_end) || this.options.start_at_slide > this.config.events.length) {\n this.goToEnd();\n } else {\n this.goTo(this.options.start_at_slide);\n }\n if (this.options.hash_bookmark) {\n this._updateHashBookmark(this.current_id);\n }\n }\n\n }\n }\n\n // Update hashbookmark in the url bar\n _updateHashBookmark(id) {\n var hash = \"#\" + \"event-\" + id.toString();\n window.history.replaceState(null, \"Browsing TimelineJS\", hash);\n this.fire(\"hash_updated\", { unique_id: this.current_id, hashbookmark: \"#\" + \"event-\" + id.toString() }, this);\n }\n\n\n /*\n PUBLIC API\n This has been minimally tested since most people use TimelineJS as an embed.\n If we hear from people who are trying to use TimelineJS this way, we will do\n what we can to make sure it works correctly, and will appreciate help!\n */\n zoomIn() {\n this._timenav.zoomIn();\n }\n\n zoomOut() {\n this._timenav.zoomOut();\n }\n\n setZoom(level) {\n this._timenav.setZoom(level);\n }\n\n // Goto slide with id\n goToId(id) {\n if (this.current_id != id) {\n this.current_id = id;\n this._timenav.goToId(this.current_id);\n this._storyslider.goToId(this.current_id, false, true);\n this.fire(\"change\", { unique_id: this.current_id }, this);\n }\n }\n\n // Goto slide n\n goTo(n) {\n if (this.config.title) {\n if (n == 0) {\n this.goToId(this.config.title.unique_id);\n } else {\n this.goToId(this.config.events[n - 1].unique_id);\n }\n } else {\n this.goToId(this.config.events[n].unique_id);\n }\n }\n\n // Goto first slide\n goToStart() {\n this.goTo(0);\n }\n\n // Goto last slide\n goToEnd() {\n var _n = this.config.events.length - 1;\n this.goTo(this.config.title ? _n + 1 : _n);\n }\n\n // Goto previous slide\n goToPrev() {\n this.goTo(this._getSlideIndex(this.current_id) - 1);\n }\n\n // Goto next slide\n goToNext() {\n this.goTo(this._getSlideIndex(this.current_id) + 1);\n }\n\n /* Event manipulation\n ================================================== */\n\n // Add an event\n add(data) {\n var unique_id = this.config.addEvent(data);\n\n var n = this._getEventIndex(unique_id);\n var d = this.config.events[n];\n\n this._storyslider.createSlide(d, this.config.title ? n + 1 : n);\n this._storyslider._updateDrawSlides();\n\n this._timenav.createMarker(d, n);\n this._timenav._updateDrawTimeline(false);\n\n this.fire(\"added\", { unique_id: unique_id });\n }\n\n // Remove an event\n remove(n) {\n if (n >= 0 && n < this.config.events.length) {\n // If removing the current, nav to new one first\n if (this.config.events[n].unique_id == this.current_id) {\n if (n < this.config.events.length - 1) {\n this.goTo(n + 1);\n } else {\n this.goTo(n - 1);\n }\n }\n\n var event = this.config.events.splice(n, 1);\n delete this.config.event_dict[event[0].unique_id];\n this._storyslider.destroySlide(this.config.title ? n + 1 : n);\n this._storyslider._updateDrawSlides();\n\n this._timenav.destroyMarker(n);\n this._timenav._updateDrawTimeline(false);\n\n this.fire(\"removed\", { unique_id: event[0].unique_id });\n }\n }\n\n removeId(id) {\n this.remove(this._getEventIndex(id));\n }\n\n /* Get slide data\n ================================================== */\n\n getData(n) {\n if (this.config.title) {\n if (n == 0) {\n return this.config.title;\n } else if (n > 0 && n <= this.config.events.length) {\n return this.config.events[n - 1];\n }\n } else if (n >= 0 && n < this.config.events.length) {\n return this.config.events[n];\n }\n return null;\n }\n\n getDataById(id) {\n return this.getData(this._getSlideIndex(id));\n }\n\n /* Get slide object\n ================================================== */\n\n getSlide(n) {\n if (n >= 0 && n < this._storyslider._slides.length) {\n return this._storyslider._slides[n];\n }\n return null;\n }\n\n getSlideById(id) {\n return this.getSlide(this._getSlideIndex(id));\n }\n\n getCurrentSlide() {\n return this.getSlideById(this.current_id);\n }\n\n updateDisplay() {\n if (this.ready) {\n this._updateDisplay();\n } else {\n trace('updateDisplay called but timeline is not in ready state')\n }\n }\n\n _initGoogleAnalytics() {\n (function(i, s, o, g, r, a, m) {\n i['GoogleAnalyticsObject'] = r;\n i[r] = i[r] || function() {\n (i[r].q = i[r].q || []).push(arguments)\n }, i[r].l = 1 * new Date();\n a = s.createElement(o), m = s.getElementsByTagName(o)[0];\n a.async = 1;\n a.src = g;\n m.parentNode.insertBefore(a, m)\n })(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');\n\n ga('create', this.options.ga_property_id, 'auto');\n ga('set', 'anonymizeIp', true);\n }\n\n _initAnalytics() {\n if (this.options.ga_property_id === null) { return; }\n this._initGoogleAnalytics();\n ga('send', 'pageview');\n var events = this.options.track_events;\n for (let i = 0; i < events.length; i++) {\n var event_ = events[i];\n this.addEventListener(event_, function(e) {\n ga('send', 'event', e.type, 'clicked');\n });\n }\n }\n\n\n}\n\nclassMixin(Timeline, I18NMixins, Events)\n\nexport { Timeline }","require('../less/TL.Timeline.less')\nexport { Timeline }\nfrom \"./timeline/Timeline\"\nexport { parseGoogleSpreadsheetURL }\nfrom \"./core/ConfigFactory\"\nexport { lookupMediaType }\nfrom \"./media/MediaType\""],"sourceRoot":""} \ No newline at end of file diff --git a/helpdesk/templates/helpdesk/ticket_list.html b/helpdesk/templates/helpdesk/ticket_list.html index fdf35a7d..c9a57d23 100644 --- a/helpdesk/templates/helpdesk/ticket_list.html +++ b/helpdesk/templates/helpdesk/ticket_list.html @@ -5,7 +5,12 @@ {% block helpdesk_title %}{% trans "Tickets" %}{% endblock %} {% block helpdesk_head %} + + {% if helpdesk_settings.HELPDESK_USE_CDN %} + {% else %} + + {% endif %} {% endblock %} {% block h1_title %}Tickets @@ -315,7 +320,12 @@ {% block helpdesk_js %} + + {% if helpdesk_settings.HELPDESK_USE_CDN %} + {% else %} + + {% endif %}