Difference between revisions of "Team:Bielefeld-CeBiTec/Basic Navbar"

Line 18: Line 18:
 
     document.documentElement.scrollTop = 0; // For IE and Firefox
 
     document.documentElement.scrollTop = 0; // For IE and Firefox
 
}
 
}
 +
 +
 +
 +
 +
 +
 +
<script>
 +
 +
/*!
 +
* Bootstrap v3.3.7 (http://getbootstrap.com)
 +
* Copyright 2011-2018 Twitter, Inc.
 +
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 +
*/
 +
 +
/*!
 +
* Generated using the Bootstrap Customizer (<none>)
 +
* Config saved to config.json and <none>
 +
*/
 +
if (typeof jQuery === 'undefined') {
 +
  throw new Error('Bootstrap\'s JavaScript requires jQuery')
 +
}
 +
+function ($) {
 +
  'use strict';
 +
  var version = $.fn.jquery.split(' ')[0].split('.')
 +
  if ((version[0] < 2 && version[1] < 9) || (version[0] == 1 && version[1] == 9 && version[2] < 1) || (version[0] > 3)) {
 +
    throw new Error('Bootstrap\'s JavaScript requires jQuery version 1.9.1 or higher, but lower than version 4')
 +
  }
 +
}(jQuery);
 +
 +
/* ========================================================================
 +
* Bootstrap: dropdown.js v3.3.7
 +
* http://getbootstrap.com/javascript/#dropdowns
 +
* ========================================================================
 +
* Copyright 2011-2016 Twitter, Inc.
 +
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 +
* ======================================================================== */
 +
 +
 +
+function ($) {
 +
  'use strict';
 +
 +
  // DROPDOWN CLASS DEFINITION
 +
  // =========================
 +
 +
  var backdrop = '.dropdown-backdrop'
 +
  var toggle  = '[data-toggle="dropdown"]'
 +
  var Dropdown = function (element) {
 +
    $(element).on('click.bs.dropdown', this.toggle)
 +
  }
 +
 +
  Dropdown.VERSION = '3.3.7'
 +
 +
  function getParent($this) {
 +
    var selector = $this.attr('data-target')
 +
 +
    if (!selector) {
 +
      selector = $this.attr('href')
 +
      selector = selector && /#[A-Za-z]/.test(selector) && selector.replace(/.*(?=#[^\s]*$)/, '') // strip for ie7
 +
    }
 +
 +
    var $parent = selector && $(selector)
 +
 +
    return $parent && $parent.length ? $parent : $this.parent()
 +
  }
 +
 +
  function clearMenus(e) {
 +
    if (e && e.which === 3) return
 +
    $(backdrop).remove()
 +
    $(toggle).each(function () {
 +
      var $this        = $(this)
 +
      var $parent      = getParent($this)
 +
      var relatedTarget = { relatedTarget: this }
 +
 +
      if (!$parent.hasClass('open')) return
 +
 +
      if (e && e.type == 'click' && /input|textarea/i.test(e.target.tagName) && $.contains($parent[0], e.target)) return
 +
 +
      $parent.trigger(e = $.Event('hide.bs.dropdown', relatedTarget))
 +
 +
      if (e.isDefaultPrevented()) return
 +
 +
      $this.attr('aria-expanded', 'false')
 +
      $parent.removeClass('open').trigger($.Event('hidden.bs.dropdown', relatedTarget))
 +
    })
 +
  }
 +
 +
  Dropdown.prototype.toggle = function (e) {
 +
    var $this = $(this)
 +
 +
    if ($this.is('.disabled, :disabled')) return
 +
 +
    var $parent  = getParent($this)
 +
    var isActive = $parent.hasClass('open')
 +
 +
    clearMenus()
 +
 +
    if (!isActive) {
 +
      if ('ontouchstart' in document.documentElement && !$parent.closest('.navbar-nav').length) {
 +
        // if mobile we use a backdrop because click events don't delegate
 +
        $(document.createElement('div'))
 +
          .addClass('dropdown-backdrop')
 +
          .insertAfter($(this))
 +
          .on('click', clearMenus)
 +
      }
 +
 +
      var relatedTarget = { relatedTarget: this }
 +
      $parent.trigger(e = $.Event('show.bs.dropdown', relatedTarget))
 +
 +
      if (e.isDefaultPrevented()) return
 +
 +
      $this
 +
        .trigger('focus')
 +
        .attr('aria-expanded', 'true')
 +
 +
      $parent
 +
        .toggleClass('open')
 +
        .trigger($.Event('shown.bs.dropdown', relatedTarget))
 +
    }
 +
 +
    return false
 +
  }
 +
 +
  Dropdown.prototype.keydown = function (e) {
 +
    if (!/(38|40|27|32)/.test(e.which) || /input|textarea/i.test(e.target.tagName)) return
 +
 +
    var $this = $(this)
 +
 +
    e.preventDefault()
 +
    e.stopPropagation()
 +
 +
    if ($this.is('.disabled, :disabled')) return
 +
 +
    var $parent  = getParent($this)
 +
    var isActive = $parent.hasClass('open')
 +
 +
    if (!isActive && e.which != 27 || isActive && e.which == 27) {
 +
      if (e.which == 27) $parent.find(toggle).trigger('focus')
 +
      return $this.trigger('click')
 +
    }
 +
 +
    var desc = ' li:not(.disabled):visible a'
 +
    var $items = $parent.find('.dropdown-menu' + desc)
 +
 +
    if (!$items.length) return
 +
 +
    var index = $items.index(e.target)
 +
 +
    if (e.which == 38 && index > 0)                index--        // up
 +
    if (e.which == 40 && index < $items.length - 1) index++        // down
 +
    if (!~index)                                    index = 0
 +
 +
    $items.eq(index).trigger('focus')
 +
  }
 +
 +
 +
  // DROPDOWN PLUGIN DEFINITION
 +
  // ==========================
 +
 +
  function Plugin(option) {
 +
    return this.each(function () {
 +
      var $this = $(this)
 +
      var data  = $this.data('bs.dropdown')
 +
 +
      if (!data) $this.data('bs.dropdown', (data = new Dropdown(this)))
 +
      if (typeof option == 'string') data[option].call($this)
 +
    })
 +
  }
 +
 +
  var old = $.fn.dropdown
 +
 +
  $.fn.dropdown            = Plugin
 +
  $.fn.dropdown.Constructor = Dropdown
 +
 +
 +
  // DROPDOWN NO CONFLICT
 +
  // ====================
 +
 +
  $.fn.dropdown.noConflict = function () {
 +
    $.fn.dropdown = old
 +
    return this
 +
  }
 +
 +
 +
  // APPLY TO STANDARD DROPDOWN ELEMENTS
 +
  // ===================================
 +
 +
  $(document)
 +
    .on('click.bs.dropdown.data-api', clearMenus)
 +
    .on('click.bs.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
 +
    .on('click.bs.dropdown.data-api', toggle, Dropdown.prototype.toggle)
 +
    .on('keydown.bs.dropdown.data-api', toggle, Dropdown.prototype.keydown)
 +
    .on('keydown.bs.dropdown.data-api', '.dropdown-menu', Dropdown.prototype.keydown)
 +
 +
}(jQuery);
 +
 +
/* ========================================================================
 +
* Bootstrap: affix.js v3.3.7
 +
* http://getbootstrap.com/javascript/#affix
 +
* ========================================================================
 +
* Copyright 2011-2016 Twitter, Inc.
 +
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 +
* ======================================================================== */
 +
 +
 +
+function ($) {
 +
  'use strict';
 +
 +
  // AFFIX CLASS DEFINITION
 +
  // ======================
 +
 +
  var Affix = function (element, options) {
 +
    this.options = $.extend({}, Affix.DEFAULTS, options)
 +
 +
    this.$target = $(this.options.target)
 +
      .on('scroll.bs.affix.data-api', $.proxy(this.checkPosition, this))
 +
      .on('click.bs.affix.data-api',  $.proxy(this.checkPositionWithEventLoop, this))
 +
 +
    this.$element    = $(element)
 +
    this.affixed      = null
 +
    this.unpin        = null
 +
    this.pinnedOffset = null
 +
 +
    this.checkPosition()
 +
  }
 +
 +
  Affix.VERSION  = '3.3.7'
 +
 +
  Affix.RESET    = 'affix affix-top affix-bottom'
 +
 +
  Affix.DEFAULTS = {
 +
    offset: 0,
 +
    target: window
 +
  }
 +
 +
  Affix.prototype.getState = function (scrollHeight, height, offsetTop, offsetBottom) {
 +
    var scrollTop    = this.$target.scrollTop()
 +
    var position    = this.$element.offset()
 +
    var targetHeight = this.$target.height()
 +
 +
    if (offsetTop != null && this.affixed == 'top') return scrollTop < offsetTop ? 'top' : false
 +
 +
    if (this.affixed == 'bottom') {
 +
      if (offsetTop != null) return (scrollTop + this.unpin <= position.top) ? false : 'bottom'
 +
      return (scrollTop + targetHeight <= scrollHeight - offsetBottom) ? false : 'bottom'
 +
    }
 +
 +
    var initializing  = this.affixed == null
 +
    var colliderTop    = initializing ? scrollTop : position.top
 +
    var colliderHeight = initializing ? targetHeight : height
 +
 +
    if (offsetTop != null && scrollTop <= offsetTop) return 'top'
 +
    if (offsetBottom != null && (colliderTop + colliderHeight >= scrollHeight - offsetBottom)) return 'bottom'
 +
 +
    return false
 +
  }
 +
 +
  Affix.prototype.getPinnedOffset = function () {
 +
    if (this.pinnedOffset) return this.pinnedOffset
 +
    this.$element.removeClass(Affix.RESET).addClass('affix')
 +
    var scrollTop = this.$target.scrollTop()
 +
    var position  = this.$element.offset()
 +
    return (this.pinnedOffset = position.top - scrollTop)
 +
  }
 +
 +
  Affix.prototype.checkPositionWithEventLoop = function () {
 +
    setTimeout($.proxy(this.checkPosition, this), 1)
 +
  }
 +
 +
  Affix.prototype.checkPosition = function () {
 +
    if (!this.$element.is(':visible')) return
 +
 +
    var height      = this.$element.height()
 +
    var offset      = this.options.offset
 +
    var offsetTop    = offset.top
 +
    var offsetBottom = offset.bottom
 +
    var scrollHeight = Math.max($(document).height(), $(document.body).height())
 +
 +
    if (typeof offset != 'object')        offsetBottom = offsetTop = offset
 +
    if (typeof offsetTop == 'function')    offsetTop    = offset.top(this.$element)
 +
    if (typeof offsetBottom == 'function') offsetBottom = offset.bottom(this.$element)
 +
 +
    var affix = this.getState(scrollHeight, height, offsetTop, offsetBottom)
 +
 +
    if (this.affixed != affix) {
 +
      if (this.unpin != null) this.$element.css('top', '')
 +
 +
      var affixType = 'affix' + (affix ? '-' + affix : '')
 +
      var e        = $.Event(affixType + '.bs.affix')
 +
 +
      this.$element.trigger(e)
 +
 +
      if (e.isDefaultPrevented()) return
 +
 +
      this.affixed = affix
 +
      this.unpin = affix == 'bottom' ? this.getPinnedOffset() : null
 +
 +
      this.$element
 +
        .removeClass(Affix.RESET)
 +
        .addClass(affixType)
 +
        .trigger(affixType.replace('affix', 'affixed') + '.bs.affix')
 +
    }
 +
 +
    if (affix == 'bottom') {
 +
      this.$element.offset({
 +
        top: scrollHeight - height - offsetBottom
 +
      })
 +
    }
 +
  }
 +
 +
 +
  // AFFIX PLUGIN DEFINITION
 +
  // =======================
 +
 +
  function Plugin(option) {
 +
    return this.each(function () {
 +
      var $this  = $(this)
 +
      var data    = $this.data('bs.affix')
 +
      var options = typeof option == 'object' && option
 +
 +
      if (!data) $this.data('bs.affix', (data = new Affix(this, options)))
 +
      if (typeof option == 'string') data[option]()
 +
    })
 +
  }
 +
 +
  var old = $.fn.affix
 +
 +
  $.fn.affix            = Plugin
 +
  $.fn.affix.Constructor = Affix
 +
 +
 +
  // AFFIX NO CONFLICT
 +
  // =================
 +
 +
  $.fn.affix.noConflict = function () {
 +
    $.fn.affix = old
 +
    return this
 +
  }
 +
 +
 +
  // AFFIX DATA-API
 +
  // ==============
 +
 +
  $(window).on('load', function () {
 +
    $('[data-spy="affix"]').each(function () {
 +
      var $spy = $(this)
 +
      var data = $spy.data()
 +
 +
      data.offset = data.offset || {}
 +
 +
      if (data.offsetBottom != null) data.offset.bottom = data.offsetBottom
 +
      if (data.offsetTop    != null) data.offset.top    = data.offsetTop
 +
 +
      Plugin.call($spy, data)
 +
    })
 +
  })
 +
 +
}(jQuery);
 +
 +
/* ========================================================================
 +
* Bootstrap: collapse.js v3.3.7
 +
* http://getbootstrap.com/javascript/#collapse
 +
* ========================================================================
 +
* Copyright 2011-2016 Twitter, Inc.
 +
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 +
* ======================================================================== */
 +
 +
/* jshint latedef: false */
 +
 +
+function ($) {
 +
  'use strict';
 +
 +
  // COLLAPSE PUBLIC CLASS DEFINITION
 +
  // ================================
 +
 +
  var Collapse = function (element, options) {
 +
    this.$element      = $(element)
 +
    this.options      = $.extend({}, Collapse.DEFAULTS, options)
 +
    this.$trigger      = $('[data-toggle="collapse"][href="#' + element.id + '"],' +
 +
                          '[data-toggle="collapse"][data-target="#' + element.id + '"]')
 +
    this.transitioning = null
 +
 +
    if (this.options.parent) {
 +
      this.$parent = this.getParent()
 +
    } else {
 +
      this.addAriaAndCollapsedClass(this.$element, this.$trigger)
 +
    }
 +
 +
    if (this.options.toggle) this.toggle()
 +
  }
 +
 +
  Collapse.VERSION  = '3.3.7'
 +
 +
  Collapse.TRANSITION_DURATION = 350
 +
 +
  Collapse.DEFAULTS = {
 +
    toggle: true
 +
  }
 +
 +
  Collapse.prototype.dimension = function () {
 +
    var hasWidth = this.$element.hasClass('width')
 +
    return hasWidth ? 'width' : 'height'
 +
  }
 +
 +
  Collapse.prototype.show = function () {
 +
    if (this.transitioning || this.$element.hasClass('in')) return
 +
 +
    var activesData
 +
    var actives = this.$parent && this.$parent.children('.panel').children('.in, .collapsing')
 +
 +
    if (actives && actives.length) {
 +
      activesData = actives.data('bs.collapse')
 +
      if (activesData && activesData.transitioning) return
 +
    }
 +
 +
    var startEvent = $.Event('show.bs.collapse')
 +
    this.$element.trigger(startEvent)
 +
    if (startEvent.isDefaultPrevented()) return
 +
 +
    if (actives && actives.length) {
 +
      Plugin.call(actives, 'hide')
 +
      activesData || actives.data('bs.collapse', null)
 +
    }
 +
 +
    var dimension = this.dimension()
 +
 +
    this.$element
 +
      .removeClass('collapse')
 +
      .addClass('collapsing')[dimension](0)
 +
      .attr('aria-expanded', true)
 +
 +
    this.$trigger
 +
      .removeClass('collapsed')
 +
      .attr('aria-expanded', true)
 +
 +
    this.transitioning = 1
 +
 +
    var complete = function () {
 +
      this.$element
 +
        .removeClass('collapsing')
 +
        .addClass('collapse in')[dimension]('')
 +
      this.transitioning = 0
 +
      this.$element
 +
        .trigger('shown.bs.collapse')
 +
    }
 +
 +
    if (!$.support.transition) return complete.call(this)
 +
 +
    var scrollSize = $.camelCase(['scroll', dimension].join('-'))
 +
 +
    this.$element
 +
      .one('bsTransitionEnd', $.proxy(complete, this))
 +
      .emulateTransitionEnd(Collapse.TRANSITION_DURATION)[dimension](this.$element[0][scrollSize])
 +
  }
 +
 +
  Collapse.prototype.hide = function () {
 +
    if (this.transitioning || !this.$element.hasClass('in')) return
 +
 +
    var startEvent = $.Event('hide.bs.collapse')
 +
    this.$element.trigger(startEvent)
 +
    if (startEvent.isDefaultPrevented()) return
 +
 +
    var dimension = this.dimension()
 +
 +
    this.$element[dimension](this.$element[dimension]())[0].offsetHeight
 +
 +
    this.$element
 +
      .addClass('collapsing')
 +
      .removeClass('collapse in')
 +
      .attr('aria-expanded', false)
 +
 +
    this.$trigger
 +
      .addClass('collapsed')
 +
      .attr('aria-expanded', false)
 +
 +
    this.transitioning = 1
 +
 +
    var complete = function () {
 +
      this.transitioning = 0
 +
      this.$element
 +
        .removeClass('collapsing')
 +
        .addClass('collapse')
 +
        .trigger('hidden.bs.collapse')
 +
    }
 +
 +
    if (!$.support.transition) return complete.call(this)
 +
 +
    this.$element
 +
      [dimension](0)
 +
      .one('bsTransitionEnd', $.proxy(complete, this))
 +
      .emulateTransitionEnd(Collapse.TRANSITION_DURATION)
 +
  }
 +
 +
  Collapse.prototype.toggle = function () {
 +
    this[this.$element.hasClass('in') ? 'hide' : 'show']()
 +
  }
 +
 +
  Collapse.prototype.getParent = function () {
 +
    return $(this.options.parent)
 +
      .find('[data-toggle="collapse"][data-parent="' + this.options.parent + '"]')
 +
      .each($.proxy(function (i, element) {
 +
        var $element = $(element)
 +
        this.addAriaAndCollapsedClass(getTargetFromTrigger($element), $element)
 +
      }, this))
 +
      .end()
 +
  }
 +
 +
  Collapse.prototype.addAriaAndCollapsedClass = function ($element, $trigger) {
 +
    var isOpen = $element.hasClass('in')
 +
 +
    $element.attr('aria-expanded', isOpen)
 +
    $trigger
 +
      .toggleClass('collapsed', !isOpen)
 +
      .attr('aria-expanded', isOpen)
 +
  }
 +
 +
  function getTargetFromTrigger($trigger) {
 +
    var href
 +
    var target = $trigger.attr('data-target')
 +
      || (href = $trigger.attr('href')) && href.replace(/.*(?=#[^\s]+$)/, '') // strip for ie7
 +
 +
    return $(target)
 +
  }
 +
 +
 +
  // COLLAPSE PLUGIN DEFINITION
 +
  // ==========================
 +
 +
  function Plugin(option) {
 +
    return this.each(function () {
 +
      var $this  = $(this)
 +
      var data    = $this.data('bs.collapse')
 +
      var options = $.extend({}, Collapse.DEFAULTS, $this.data(), typeof option == 'object' && option)
 +
 +
      if (!data && options.toggle && /show|hide/.test(option)) options.toggle = false
 +
      if (!data) $this.data('bs.collapse', (data = new Collapse(this, options)))
 +
      if (typeof option == 'string') data[option]()
 +
    })
 +
  }
 +
 +
  var old = $.fn.collapse
 +
 +
  $.fn.collapse            = Plugin
 +
  $.fn.collapse.Constructor = Collapse
 +
 +
 +
  // COLLAPSE NO CONFLICT
 +
  // ====================
 +
 +
  $.fn.collapse.noConflict = function () {
 +
    $.fn.collapse = old
 +
    return this
 +
  }
 +
 +
 +
  // COLLAPSE DATA-API
 +
  // =================
 +
 +
  $(document).on('click.bs.collapse.data-api', '[data-toggle="collapse"]', function (e) {
 +
    var $this  = $(this)
 +
 +
    if (!$this.attr('data-target')) e.preventDefault()
 +
 +
    var $target = getTargetFromTrigger($this)
 +
    var data    = $target.data('bs.collapse')
 +
    var option  = data ? 'toggle' : $this.data()
 +
 +
    Plugin.call($target, option)
 +
  })
 +
 +
}(jQuery);
 +
 +
/* ========================================================================
 +
* Bootstrap: scrollspy.js v3.3.7
 +
* http://getbootstrap.com/javascript/#scrollspy
 +
* ========================================================================
 +
* Copyright 2011-2016 Twitter, Inc.
 +
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 +
* ======================================================================== */
 +
 +
 +
+function ($) {
 +
  'use strict';
 +
 +
  // SCROLLSPY CLASS DEFINITION
 +
  // ==========================
 +
 +
  function ScrollSpy(element, options) {
 +
    this.$body          = $(document.body)
 +
    this.$scrollElement = $(element).is(document.body) ? $(window) : $(element)
 +
    this.options        = $.extend({}, ScrollSpy.DEFAULTS, options)
 +
    this.selector      = (this.options.target || '') + ' .nav li > a'
 +
    this.offsets        = []
 +
    this.targets        = []
 +
    this.activeTarget  = null
 +
    this.scrollHeight  = 0
 +
 +
    this.$scrollElement.on('scroll.bs.scrollspy', $.proxy(this.process, this))
 +
    this.refresh()
 +
    this.process()
 +
  }
 +
 +
  ScrollSpy.VERSION  = '3.3.7'
 +
 +
  ScrollSpy.DEFAULTS = {
 +
    offset: 10
 +
  }
 +
 +
  ScrollSpy.prototype.getScrollHeight = function () {
 +
    return this.$scrollElement[0].scrollHeight || Math.max(this.$body[0].scrollHeight, document.documentElement.scrollHeight)
 +
  }
 +
 +
  ScrollSpy.prototype.refresh = function () {
 +
    var that          = this
 +
    var offsetMethod  = 'offset'
 +
    var offsetBase    = 0
 +
 +
    this.offsets      = []
 +
    this.targets      = []
 +
    this.scrollHeight = this.getScrollHeight()
 +
 +
    if (!$.isWindow(this.$scrollElement[0])) {
 +
      offsetMethod = 'position'
 +
      offsetBase  = this.$scrollElement.scrollTop()
 +
    }
 +
 +
    this.$body
 +
      .find(this.selector)
 +
      .map(function () {
 +
        var $el  = $(this)
 +
        var href  = $el.data('target') || $el.attr('href')
 +
        var $href = /^#./.test(href) && $(href)
 +
 +
        return ($href
 +
          && $href.length
 +
          && $href.is(':visible')
 +
          && [[$href[offsetMethod]().top + offsetBase, href]]) || null
 +
      })
 +
      .sort(function (a, b) { return a[0] - b[0] })
 +
      .each(function () {
 +
        that.offsets.push(this[0])
 +
        that.targets.push(this[1])
 +
      })
 +
  }
 +
 +
  ScrollSpy.prototype.process = function () {
 +
    var scrollTop    = this.$scrollElement.scrollTop() + this.options.offset
 +
    var scrollHeight = this.getScrollHeight()
 +
    var maxScroll    = this.options.offset + scrollHeight - this.$scrollElement.height()
 +
    var offsets      = this.offsets
 +
    var targets      = this.targets
 +
    var activeTarget = this.activeTarget
 +
    var i
 +
 +
    if (this.scrollHeight != scrollHeight) {
 +
      this.refresh()
 +
    }
 +
 +
    if (scrollTop >= maxScroll) {
 +
      return activeTarget != (i = targets[targets.length - 1]) && this.activate(i)
 +
    }
 +
 +
    if (activeTarget && scrollTop < offsets[0]) {
 +
      this.activeTarget = null
 +
      return this.clear()
 +
    }
 +
 +
    for (i = offsets.length; i--;) {
 +
      activeTarget != targets[i]
 +
        && scrollTop >= offsets[i]
 +
        && (offsets[i + 1] === undefined || scrollTop < offsets[i + 1])
 +
        && this.activate(targets[i])
 +
    }
 +
  }
 +
 +
  ScrollSpy.prototype.activate = function (target) {
 +
    this.activeTarget = target
 +
 +
    this.clear()
 +
 +
    var selector = this.selector +
 +
      '[data-target="' + target + '"],' +
 +
      this.selector + '[href="' + target + '"]'
 +
 +
    var active = $(selector)
 +
      .parents('li')
 +
      .addClass('active')
 +
 +
    if (active.parent('.dropdown-menu').length) {
 +
      active = active
 +
        .closest('li.dropdown')
 +
        .addClass('active')
 +
    }
 +
 +
    active.trigger('activate.bs.scrollspy')
 +
  }
 +
 +
  ScrollSpy.prototype.clear = function () {
 +
    $(this.selector)
 +
      .parentsUntil(this.options.target, '.active')
 +
      .removeClass('active')
 +
  }
 +
 +
 +
  // SCROLLSPY PLUGIN DEFINITION
 +
  // ===========================
 +
 +
  function Plugin(option) {
 +
    return this.each(function () {
 +
      var $this  = $(this)
 +
      var data    = $this.data('bs.scrollspy')
 +
      var options = typeof option == 'object' && option
 +
 +
      if (!data) $this.data('bs.scrollspy', (data = new ScrollSpy(this, options)))
 +
      if (typeof option == 'string') data[option]()
 +
    })
 +
  }
 +
 +
  var old = $.fn.scrollspy
 +
 +
  $.fn.scrollspy            = Plugin
 +
  $.fn.scrollspy.Constructor = ScrollSpy
 +
 +
 +
  // SCROLLSPY NO CONFLICT
 +
  // =====================
 +
 +
  $.fn.scrollspy.noConflict = function () {
 +
    $.fn.scrollspy = old
 +
    return this
 +
  }
 +
 +
 +
  // SCROLLSPY DATA-API
 +
  // ==================
 +
 +
  $(window).on('load.bs.scrollspy.data-api', function () {
 +
    $('[data-spy="scroll"]').each(function () {
 +
      var $spy = $(this)
 +
      Plugin.call($spy, $spy.data())
 +
    })
 +
  })
 +
 +
}(jQuery);
 +
 +
/* ========================================================================
 +
* Bootstrap: transition.js v3.3.7
 +
* http://getbootstrap.com/javascript/#transitions
 +
* ========================================================================
 +
* Copyright 2011-2016 Twitter, Inc.
 +
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 +
* ======================================================================== */
 +
 +
 +
+function ($) {
 +
  'use strict';
 +
 +
  // CSS TRANSITION SUPPORT (Shoutout: http://www.modernizr.com/)
 +
  // ============================================================
 +
 +
  function transitionEnd() {
 +
    var el = document.createElement('bootstrap')
 +
 +
    var transEndEventNames = {
 +
      WebkitTransition : 'webkitTransitionEnd',
 +
      MozTransition    : 'transitionend',
 +
      OTransition      : 'oTransitionEnd otransitionend',
 +
      transition      : 'transitionend'
 +
    }
 +
 +
    for (var name in transEndEventNames) {
 +
      if (el.style[name] !== undefined) {
 +
        return { end: transEndEventNames[name] }
 +
      }
 +
    }
 +
 +
    return false // explicit for ie8 (  ._.)
 +
  }
 +
 +
  // http://blog.alexmaccaw.com/css-transitions
 +
  $.fn.emulateTransitionEnd = function (duration) {
 +
    var called = false
 +
    var $el = this
 +
    $(this).one('bsTransitionEnd', function () { called = true })
 +
    var callback = function () { if (!called) $($el).trigger($.support.transition.end) }
 +
    setTimeout(callback, duration)
 +
    return this
 +
  }
 +
 +
  $(function () {
 +
    $.support.transition = transitionEnd()
 +
 +
    if (!$.support.transition) return
 +
 +
    $.event.special.bsTransitionEnd = {
 +
      bindType: $.support.transition.end,
 +
      delegateType: $.support.transition.end,
 +
      handle: function (e) {
 +
        if ($(e.target).is(this)) return e.handleObj.handler.apply(this, arguments)
 +
      }
 +
    }
 +
  })
 +
 +
}(jQuery);
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +
 
</script>
 
</script>
  

Revision as of 12:08, 29 July 2018

/* HQ CSS*/ .firstHeading { display: none; }

.mw-content-text { display: none; }

.logo_2018 { display: none; }

  1. globalWrapper {

padding: 0px; margin: 0px; padding-bottom: 0px; }

  1. content {

margin-left:0px; padding:0px; width:100%; margin-top: -7px; }


.mw-content-ltr ul, .mw-content-rtl .mw-content-ltr ul{ margin:0px; }

  1. top_title {

margin-bottom: 0px; }

  1. top_menu_14{

border-bottom: 0px solid black; }

  1. HQ_page p {

margin: 0; }

/*NAVBAR*/

@charset "UTF-8";

body{ margin-top:0px; }

.navigation { height: 70px; background: #002a5c; position: fixed; width:100%; text-decoration: none; }

.brand { position: absolute; padding-left: 20px; float: left; line-height: 70px; text-transform: uppercase; font-size: 1.4em; width: 300px; }

.logo-img{ width: 70%; margin-top: 1%; }

@media only screen and (max-width: 1350px) { .logo-img{ width: 70%; margin-top: 2%; }

.navigation{ position: absolute; }

}

@media only screen and (max-width: 790px) { .logo-img{ width: 70%; margin-top: 3%; }

.navigation{ position: absolute; }

}


.brand a, .brand a:visited { color: #ffffff; text-decoration: none; }

.nav-container { max-width: auto; margin: 0 auto; text-decoration: none; }

nav { float: right; text-decoration: none; } nav ul { list-style: none; margin: 0; padding: 0; text-decoration: none; } nav ul li { float: left; position: relative; text-decoration: none; } nav ul li a, nav ul li a:visited, nav ul li a:focus{ display: block; padding: 0 20px; line-height: 70px; background: #002a5c; color: #ffffff; text-decoration: none; margin-bottom:-4px; border-color:#002a5c; } nav ul li a:hover, nav ul li a:visited:hover { background: #4d9dff; color: #ffffff; text-decoration: none; } nav ul li a:not(:only-child):after, nav ul li a:visited:not(:only-child):after { padding-left: 4px; content: " ▾"; text-decoration: none; } nav ul li ul li { min-width: 190px; text-decoration: none; } nav ul li ul li a { padding: 15px; line-height: 20px; text-decoration: none; text-decoration: none; }

.nav-dropdown { position: absolute; display: none; z-index: 1; box-shadow: 0 3px 12px rgba(0, 0, 0, 0.15); text-decoration: none; }

/* Mobile navigation */ .nav-mobile { display: none; position: absolute; top: 0; right: 0; background: #002a5c; height: 70px; width: 70px; }

@media only screen and (max-width: 1350px) {


.nav-mobile { display: block; }

nav { width: 100%; padding: 70px 0 15px; } nav ul { display: none; max-height: 280px; overflow-y: auto; } nav ul li { float: none; } nav ul li a { padding: 15px; line-height: 20px; text-decoration: none; } nav ul li ul li a { padding-left: 30px; text-decoration: none; }

.nav-dropdown { position: static; } } @media screen and (min-width: 1351px) { .nav-list { display: block !important; } }

  1. nav-toggle {

position: absolute; left: 18px; top: 22px; cursor: pointer; padding: 10px 35px 16px 0px; max-height: 280px; overflow-y: auto; }

  1. nav-toggle span,
  2. nav-toggle span:before,
  3. nav-toggle span:after {

cursor: pointer; border-radius: 1px; height: 5px; width: 35px; background: #ffffff; position: absolute; display: block; content: ""; transition: all 300ms ease-in-out; }

  1. nav-toggle span:before {

top: -10px; }

  1. nav-toggle span:after {

bottom: -10px; }

  1. nav-toggle.active span {

background-color: transparent; }

  1. nav-toggle.active span:before, #nav-toggle.active span:after {

top: 0; }

  1. nav-toggle.active span:before {

transform: rotate(45deg); }

  1. nav-toggle.active span:after {

transform: rotate(-45deg); }

article { max-width: 1000px; margin: 0 auto; padding: 10px; line-height: 1.5; }

.article { max-width: 1000px; margin: 0 auto; padding: 10px; line-height: 1.5; padding-right: 5%; padding-left : 5%;

}

/* W3 Schools templates*/

.w3-top,.w3-bottom{position:fixed;width:100%;z-index:1;} .w3-top{top:0;} .w3-bottom{bottom:0;}

  1. footer{display:block;width:98%}

.w3-container:after,.w3-container:before{content:"";display:table;clear:both;width:98%;}

.w3-container{}

.w3-padding-32{padding-top:32px!important;padding-bottom:32px!important;}

.w3-center .w3-bar{display:inline-block;width:auto;}

.w3-center{text-align:center!important;}

.w3-black,.w3-hover-black:hover{color:#fff!important;background-color:#000!important;}

.w3-xlarge{font-size:24px!important;}


/*OWN STYLES*/

body { font-family: "Lato", sans-serif; }

@media only screen and (min-width: 1010px){ .main_content {

background-color: white; border: 1px solid #000000; border-radius: 0px; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.35); min-height: 100px; border-top: none; border-bottom: none; margin-left:25%; margin-right:25%; padding-bottom: 4%; min-height: 420px; position: sticky; margin-top: -100px; } }

@media only screen and (max-width: 1009px){ .main_content {

background-color: white; border: 1px solid #000000; border-radius: 0px; box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.35); min-height: 100px; border-top: none; border-bottom: none; margin-left:0; margin-right:0; padding-bottom: 4%; position: sticky; margin-top: -100px; } }


  1. container{

position: relative; min-height: 100%; height: 100%; }

.container{ padding-top:0px; background-color: #001633; }

.section{ margin: 1%; }

.half{ max-width: 48%; }

.half.left { float: left; margin-right: 1%; }

.half.right { float: right; margin-left: 1%;

}

article, .article { text-align: justify; display: block; margin: auto; font-size: 16px; padding-bottom: 20px; }

article, .article, .contentline { width: 90%; font-size: 16px; padding-bottom: 30px; }

.contentline article, .contentline .article { width: 100%; }

h1, h2, h3, h4, h5, h6 { width: 92%; margin: auto; margin-top: 0px; padding-top: 20px; padding-bottom: 15px; }

.p { text-align: justify; }

.title { font-size: 40px; padding-top: 5%; padding-left: 3%; padding-bottom: 40px; font-weight: bold; background-color: rgb(255,255,255); margin-top: -70px; position:sticky; line-height:1.5em; text-align:left; }

h2 { padding-left: 3%; font-size:14; }

br { display: block; /* makes it have a width */ content: ""; /* clears default height */ margin-top: 20px; /* change this to whatever height you want it */ }

p { font-size:14px; }

body { padding-top: 0px; }



article{ padding-right: 5%; padding-left : 5%; }

  1. page-arrow-top {

display: none; cursor: pointer; padding: 0; margin: 0; position: fixed; bottom: 20px; right: 50px; }

.half { width: 48%; }

.half.left { float: left; margin-right: 1%; }

.half.right { float: right; margin-left: 1%; }

.sidenavi{

margin-top: 50px; margin-left: 4%; display: block; position: -webkit-sticky; position: sticky; top: 150px; float: left; background-color: #001633; border-radius: 30px; border-color: white; border-style: solid; }


.side_list{ display: block; margin-right: 10px; margin-bottom: 15px; margin-top: 10px; margin-left: 10px; color: white; }

.side_link{ color: white; font-size: 20px; text-decoration:none; padding: 10px; }

.side_list > a:hover{ text-decoration:none; color: white; }

.side_list > a{ text-decoration:none; font-size: 18px; padding: 10px; width:100%; cursor: pointer; color: white; }


@media only screen and (max-width: 1150px){ .sidenavi{

margin-top: 50px; margin-left: 1%; display: block; position: -webkit-sticky; position: sticky; top: 150px; float: left; background-color: #001633; border-radius: 30px; border-color: white; border-style: solid; }

.side_list{ display: block; margin-right: 10px; margin-bottom: 15px; margin-top: 10px; margin-left: 10px; color: white; }

.side_link{ color: white; font-size: 10px; text-decoration:none; padding: 10px; }

.side_list > a:hover{ text-decoration:none; color: white; }

.side_list > a{ text-decoration:none; font-size: 16px; padding: 12px; width:100%; cursor: pointer; color: white; }

}


@media only screen and (max-width: 1685px){ .sidenavi{

margin-top: 50px; margin-left: 1%; display: block; position: -webkit-sticky; position: sticky; top: 150px; float: left; background-color: #001633; border-radius: 30px; border-color: white; border-style: solid; }

.side_list{ display: block; margin-right: 10px; margin-bottom: 15px; margin-top: 10px; margin-left: 10px; color: white; }

.side_link{ color: white; font-size: 10px; text-decoration:none; padding: 10px; }

.side_list > a:hover{ text-decoration:none; color: white; }

.side_list > a{ text-decoration:none; font-size: 16px; padding: 8px; width:100%; cursor: pointer; color: white; }

}


@media only screen and (max-width: 1300px){ .sidenavi{ display: none;

} }


figure { text-align: center; margin-bottom: 30px;

}

figcaption{ text-align: justify; font-size: 13px; margin-top:10px; }

.figure.eighty { width:80%; }

.figure.ten { width:10%; }

.figure.twenty { width:20%; }

.figure.thirty { width:30%; }

.figure.fourty { width:40%; }

.figure.fifty { width:50%; }

.figure.sixty { width:60%; }

.figure.seventy { width:70%; }

.figure.ninety { width:90%; }

.figure.hundred { width:100%; }


table, th, td { border: 1px solid black; border-collapse: collapse; font-size:17px; } th, td { padding: 15px; text-align: left; } table#t01 tr:first-child td{ background-color: #eee; }

table#t01 tr td:first-child { background-color: #eee; color: black; }


table.centern{ margin-left:15%; margin-right:15%; margin-top: 100px; margin-top: 5%; }

  1. HQ_page table {

border: 1px solid #ccc; border-collapse: collapse; width: 70%; margin: auto; margin-bottom: 0px; margin-top: 100px; margin-right: auto; margin-left: auto; }

hr { margin-top: 10%; margin-bottom: 20px; border: 0; text-align: center; border-top: 2px solid #000000; margin-left: auto; margin-right: auto;

}

.reftext { display: block; text-align: justify; margin-left: 5%; margin-right: 5%; font-size: 14px; padding-bottom: 20px; line-height: 20px; }

/*Footer*/ .fa-facebook-official:before { content: "\f230"; color: white; }


.fa-instagram:before { content: "\f230"; color: white; }

.fa-twitter:before { content: "\f230"; color: white; }

  1. myDIV {

margin-top: 10px; display:none; }

.refbtn{ background-color: white; border: none; font-size: 150%; font-weight: bold; color: black; margin-left: 5%; margin-bottom: 26px; margin-top: 30px;

}

a.shifted-anchor { display: block; position:relative; top: -100px; }

active{

text-decoration: none; }

html,body { background-color: #001633; }


  1. myVideo {

position: static; top:0; left:0 right: 0; bottom: 0; height: auto; margin-top: 70px; z-index:1; }


.title_picture{ width:100%; padding-top:40px; }


@-webkit-keyframes animateBubble { 0% { margin-top: 310%; } 100% { margin-top: 5%; } }

@-moz-keyframes animateBubble { 0% { margin-top: 310%; } 100% { margin-top: 5%; } }

@keyframes animateBubble { 0% { margin-top: 310%; } 100% { margin-top: 5%; } }


@-webkit-keyframes animateBubbleSeite { 0% { margin-top: 40px; } 100% { margin-top: -200%; } }

@-moz-keyframes animateBubbleSeite { 0% { margin-top: 40px; } 100% { margin-top: -200%; } }

@keyframes animateBubbleSeite { 0% { margin-top: 40px; } 100% { margin-top: -200%; } }


@-webkit-keyframes sideWays { 0% { margin-left:0px; } 100% { margin-left:50px; } }

@-moz-keyframes sideWays { 0% { margin-left:0px; } 100% { margin-left:50px; } }

@keyframes sideWays { 0% { margin-left:0px; } 100% { margin-left:50px; } }


.s1 { -webkit-animation: animateBubbleSeite 120s linear infinite, sideWays 2s ease-in-out infinite alternate; -moz-animation: animateBubbleSeite 120s linear infinite, sideWays 2s ease-in-out infinite alternate; animation: animateBubbleSeite 120s linear infinite, sideWays 2s ease-in-out infinite alternate;

left: 5%; top: 95%; z-index:1; overflow: hidden;

-webkit-transform: scale(0.1); -moz-transform: scale(0.1); transform: scale(0.1); }


.x1 { -webkit-animation: animateBubble 100s linear infinite, sideWays 2s ease-in-out infinite alternate; -moz-animation: animateBubble 100s linear infinite, sideWays 2s ease-in-out infinite alternate; animation: animateBubble 100s linear infinite, sideWays 2s ease-in-out infinite alternate;

left: -5%; top: 20%; z-index:1; overflow: hidden;

-webkit-transform: scale(0.1); -moz-transform: scale(0.1); transform: scale(0.1); }

.x2 { -webkit-animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate; -moz-animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate; animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate;

left: 5%; top: 20%; z-index:1; overflow: hidden; -webkit-transform: scale(0.2); -moz-transform: scale(0.2); transform: scale(0.2); }

.x3 { -webkit-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate; -moz-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate; animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate;

left: 10%; top: 20%; overflow: hidden; z-index:1; -webkit-transform: scale(0.2); -moz-transform: scale(0.2); transform: scale(0.2); }

.x4 { -webkit-animation: animateBubble 90s linear infinite, sideWays 3s ease-in-out infinite alternate; -moz-animation: animateBubble 90s linear infinite, sideWays 3s ease-in-out infinite alternate; animation: animateBubble 90s linear infinite, sideWays 3s ease-in-out infinite alternate;

left: 20%; top: 20%; overflow: hidden; z-index:1; -webkit-transform: scale(0.2); -moz-transform: scale(0.2); transform: scale(0.2); }

.x5 { -webkit-animation: animateBubble 70s linear infinite, sideWays 4s ease-in-out infinite alternate; -moz-animation: animateBubble 70s linear infinite, sideWays 4s ease-in-out infinite alternate; animation: animateBubble 70s linear infinite, sideWays 4s ease-in-out infinite alternate;

left: 30%; top: 20%; overflow: hidden; z-index:1; -webkit-transform: scale(0.1); -moz-transform: scale(0.1); transform: scale(0.1); }

.x6 { -webkit-animation: animateBubble 115s linear infinite, sideWays 2s ease-in-out infinite alternate; -moz-animation: animateBubble 115s linear infinite, sideWays 2s ease-in-out infinite alternate; animation: animateBubble 115s linear infinite, sideWays 2s ease-in-out infinite alternate;

left: 50%; top: 20%; overflow: hidden; z-index:1; -webkit-transform: scale(0.1); -moz-transform: scale(0.1); transform: scale(0.1); }

.x7 { -webkit-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate; -moz-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate; animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate;

left: 65%; top: 20%; overflow: hidden; z-index:1; -webkit-transform: scale(0.1); -moz-transform: scale(0.1); transform: scale(0.1); }

.x8 { -webkit-animation: animateBubble 100s linear infinite, sideWays 3s ease-in-out infinite alternate; -moz-animation: animateBubble 100s linear infinite, sideWays 3s ease-in-out infinite alternate; animation: animateBubble 100s linear infinite, sideWays 3s ease-in-out infinite alternate;

left: 80%; top: 20%; overflow: hidden; z-index:1; -webkit-transform: scale(0.2); -moz-transform: scale(0.2); transform: scale(0.2); }

.x9 { -webkit-animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate; -moz-animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate; animation: animateBubble 80s linear infinite, sideWays 4s ease-in-out infinite alternate;

left: 90%; top: 20%; overflow: hidden; z-index:1; -webkit-transform: scale(0.1); -moz-transform: scale(0.1); transform: scale(0.1); }

.x10 { -webkit-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate; -moz-animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate; animation: animateBubble 120s linear infinite, sideWays 2s ease-in-out infinite alternate;

left: 80%; top: 20%; overflow: hidden; z-index:1; -webkit-transform: scale(0.1); -moz-transform: scale(0.1); transform: scale(0.1); }


.bubble { -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;

-webkit-box-shadow: 0 20px 30px rgba(0, 0, 0, 0.2), inset 0px 10px 30px 5px rgba(255, 255, 255, 1); -moz-box-shadow: 0 20px 30px rgba(0, 0, 0, 0.2), inset 0px 10px 30px 5px rgba(255, 255, 255, 1); box-shadow: 0 20px 30px rgba(0, 0, 0, 0.2), inset 0px 10px 30px 5px rgba(255, 255, 255, 1);

height: 200px; position: absolute; width: 200px; }

.bubble:after { background: -moz-radial-gradient(center, ellipse cover, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 0%); /* FF3.6+ */ background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(255,255,255,0.5)), color-stop(0%,rgba(255,255,255,0))); /* Chrome,Safari4+ */ background: -webkit-radial-gradient(center, ellipse cover, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 0%); /* Chrome10+,Safari5.1+ */ background: -o-radial-gradient(center, ellipse cover, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 0%); /* Opera 12+ */ background: -ms-radial-gradient(center, ellipse cover, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 0%); /* IE10+ */ background: radial-gradient(ellipse at center, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 0%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;

-webkit-box-shadow: inset 0 20px 30px rgba(255, 255, 255, 0.3); -moz-box-shadow: inset 0 20px 30px rgba(255, 255, 255, 0.3); box-shadow: inset 0 20px 30px rgba(255, 255, 255, 0.3);

content: ""; height: 180px; left: 10px; position: absolute; width: 180px; }

@media only screen and (max-width: 1700px) {

.bubble.x1, .bubble.x2, .bubble.x8, .bubble.x9, .bubble.x10{ display:none; }


}


@media only screen and (max-width: 1200px) {

.bubble.x1, .bubble.x2, .bubble.x7, .bubble.x8, .bubble.x9, .bubble.x10{ display:none; } }


.timer_box{

   border: white;
   border-style: solid;
   padding-bottom: 125px;
   padding-left: 10px;
   padding_top:10px;
   marging-bottom: 100px;

}

  1. gold {
 float: left;
 font-size: 50px;
 margin-top: 10px;
 width: 50%;
 color:white;

text-align: center;

}

  1. gold_text {
 float: left;
 font-size: 20px;
 margin-top: 0px;
 width: 50%;
 color:white;

text-align: center; }

  1. silver {
 float: left;
 text-align: center;
 font-size: 50px;
 margin-top: 10px;
 width: 50%;
 color:white;

}

  1. silver_text {
 float: left;
 text-align: center;
 font-size: 20px;
 margin-top: 0px;
 width: 50%;
 color:white;

}

.img_text{ text-align:center; position:absolute; }

  1. home_imgs {
   margin-top:100px;
   width:60%;

}


@media only screen and (max-width: 1300px) {

  1. home_imgs{

width:70%;

}

  1. silver{

font-size: 30px;

}

  1. gold{

font-size: 30px;

}

  1. silver_text{

font-size: 20px;

}


  1. gold_text{

font-size: 20px; }

}


@media only screen and (max-width: 900px) {

.timer_box{

   border: white;
   border-style: solid;
   padding-bottom: 100px;
   padding-left: 10px;
   padding_top:10px;
   marging-bottom: 100px;

}

  1. home_imgs{

margin-top:50px; width:90%; }

  1. silver{

font-size: 20px;

}

  1. gold{

font-size: 20px;

}

  1. silver_text{

font-size: 15px;

}


  1. gold_text{

font-size: 15px; }

}


@media only screen and (max-width: 600px) {

.timer_box{

   border: white;
   border-style: solid;
   padding-bottom: 100px;
   padding-left: 10px;
   padding_top:10px;
   marging-bottom: 100px;

}

  1. home_imgs{

margin-top:15px; width:100%; }

  1. silver{

font-size: 15px;

}

  1. gold{

font-size: 15px;

}

  1. silver_text{

font-size: 10px;

}


  1. gold_text{

font-size: 10px; }

}


@media only screen and (max-width: 400px) {

.timer_box{

   border: white;
   border-style: solid;
   padding-bottom: 50px;
   padding-left: 10px;
   padding_top:10px;
   marging-bottom: 100px;

}

  1. home_imgs{

margin-top:5px; width:100%; }

  1. silver{

font-size: 10px;

}

  1. gold{

font-size: 10px;

}

  1. silver_text{

font-size: 5px;

}


  1. gold_text{

font-size: 5px; }

}