Header bump

Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
This commit is contained in:
John Molakvoæ (skjnldsv)
2018-03-05 21:08:50 +01:00
parent 36ce2c7d93
commit 2a0e5c2103
4 changed files with 683 additions and 221 deletions

View File

@@ -12,18 +12,18 @@
{% if theme_bootswatch_theme %}
{# BS2 needs "bootstrap-responsive.css". BS3 doesn't. #}
{% if theme_bootstrap_version == "3" %}
{% set theme_css_files = theme_css_files + [
'_static/bootswatch-' + bootstrap_version + '/' + theme_bootswatch_theme + '/bootstrap.min.css',
'_static/bootstrap-sphinx.css'
]
%}
{% set theme_css_files = theme_css_files + [
'_static/bootswatch-' + bootstrap_version + '/' + theme_bootswatch_theme + '/bootstrap.min.css',
'_static/bootstrap-sphinx.css'
]
%}
{% else %}
{% set theme_css_files = theme_css_files + [
'_static/bootswatch-' + bootstrap_version + '/' + theme_bootswatch_theme + '/bootstrap.min.css',
'_static/bootstrap-' + bootstrap_version + '/css/bootstrap-' + bootstrap_additional_css + '.min.css',
'_static/bootstrap-sphinx.css'
]
%}
{% set theme_css_files = theme_css_files + [
'_static/bootswatch-' + bootstrap_version + '/' + theme_bootswatch_theme + '/bootstrap.min.css',
'_static/bootstrap-' + bootstrap_version + '/css/bootstrap-' + bootstrap_additional_css + '.min.css',
'_static/bootstrap-sphinx.css'
]
%}
{% endif %}
{% else %}
{% set theme_css_files = theme_css_files + ['_static/main.min.css', '_static/styles.css']
@@ -36,10 +36,10 @@
{% set css_files = css_files + theme_css_files + bootswatch_css_custom %}
{% set script_files = script_files + [
'_static/js/jquery-1.11.0.min.js',
'_static/js/jquery-fix.js',
'_static/bootstrap-' + bootstrap_version + '/js/bootstrap.min.js',
'_static/bootstrap-sphinx.js'
'_static/js/jquery-1.11.0.min.js',
'_static/js/jquery-fix.js',
'_static/bootstrap-' + bootstrap_version + '/js/bootstrap.min.js',
'_static/bootstrap-sphinx.js'
]
%}
@@ -53,57 +53,56 @@
{# Sidebar: Rework into our Bootstrap nav section. #}
{% macro navBar() %}
<header class="banner navbar navbar-default navbar-static-top" role="banner">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="brand" href="http://nextcloud.com/" rel="home" title="Nextcloud.com"><img class="logo" src="{{ pathto('_static/img/logo.svg', 1) }}" itemprop="logo"></a>
</div>
<nav class="nav headroom--pinned" id="nav">
<!-- To finish -->
<div class="mobile-bg-container">
<div class="mobile-bg"></div>
</div>
<nav class="collapse navbar-collapse" role="navigation">
<ul id="menu-header" class="nav navbar-nav">
<li><a target="_blank" href="https://demo.nextcloud.com">Demo</a></li>
<li><a href="https://nextcloud.com/news/">News</a></li>
<li><a href="https://nextcloud.com/features/">Features</a></li>
<li><a href="https://nextcloud.com/about/">About us</a></li>
<li><a href="https://nextcloud.com/contribute/">Get involved</a></li>
<li><a href="https://nextcloud.com/support/">Support</a></li>
<li><a href="https://nextcloud.com/enterprise/">Enterprise</a></li>
<li class="menu-install"><a href="https://nextcloud.com/install/">Download</a></li>
</ul>
</nav>
</div>
</header>
<div class="container">
<div class="brand">
<a href="https://nextcloud.com/homepage"><div class="logo stopedAnimation"></div></a>
</div>
<div class="nav__sections-wrapper">
<ul class="nav__sections">
<li class="nav__section"><a href="https://nextcloud.com/files" class="nav__label">Features</a></li>
<li class="nav__section"><a href="https://help.nextcloud.com/" class="nav__label">Support</a></li>
<li class="nav__section"><a href="https://nextcloud.com/contribute" class="nav__label">Community</a></li>
<li class="nav__section"><a href="https://nextcloud.com/about" class="nav__label">About</a></li>
</ul>
<ul class="right-buttons">
<li class="ghost-btn"><a href="https://demo.nextcloud.com/" class="nav__label">Demo</a></li>
<li class="ghost-btn"><a href="https://nextcloud.com/install" class="nav__label">Download</a></li>
<li class="ghost-btn"><a href="https://nextcloud.com/enterprise/buy" class="nav__label">Buy</a></li>
</ul>
</div>
</div>
</nav>
{% endmacro %}
{% if theme_bootstrap_version == "3" %}
{%- macro bsidebar() %}
{%- if render_sidebar %}
<div class="{{ bs_span_prefix }}3">
<div id="sidebar" class="bs-sidenav" role="complementary">
{%- for sidebartemplate in sidebars %}
{%- include sidebartemplate %}
{%- endfor %}
</div>
</div>
{%- endif %}
{%- if render_sidebar %}
<div class="{{ bs_span_prefix }}3">
<div id="sidebar" class="bs-sidenav" role="complementary">
{%- for sidebartemplate in sidebars %}
{%- include sidebartemplate %}
{%- endfor %}
</div>
</div>
{%- endif %}
{%- endmacro %}
{% else %}
{%- macro bsidebar() %}
{%- if render_sidebar %}
<div class="{{ bs_span_prefix }}3">
<div id="sidebar" class="bs-sidenav well" data-spy="affix">
{%- for sidebartemplate in sidebars %}
{%- include sidebartemplate %}
{%- endfor %}
</div>
</div>
{%- endif %}
{%- if render_sidebar %}
<div class="{{ bs_span_prefix }}3">
<div id="sidebar" class="bs-sidenav well" data-spy="affix">
{%- for sidebartemplate in sidebars %}
{%- include sidebartemplate %}
{%- endfor %}
</div>
</div>
{%- endif %}
{%- endmacro %}
{% endif %}
@@ -117,16 +116,16 @@
<link rel="apple-touch-icon-precomposed" href="https://nextcloud.com/wp-content/themes/next/assets/img/common/favicon.png" />
<!-- Piwik -->
<script type="text/javascript">
var _paq = _paq || [];
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="//stats.nextcloud.com/";
_paq.push(['setTrackerUrl', u+'piwik.php']);
_paq.push(['setSiteId', 3]);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
})();
var _paq = _paq || [];
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="//stats.nextcloud.com/";
_paq.push(['setTrackerUrl', u+'piwik.php']);
_paq.push(['setSiteId', 3]);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<noscript><p><img src="//stats.nextcloud.com/piwik.php?idsite=3" style="border:0;" alt="" /></p></noscript>
<!-- End Piwik Code -->
@@ -143,26 +142,26 @@
<div class="wrap container not-front">
<div class="content row">
<main class="main">
<div class="row page-content-header">
<div class="col-md-8">
<h1><a href="{{ pathto(master_doc) }}">{{ project|e }}</a></h1>
<div class="doc-version-switch">
Versions:
{%- for v in doc_versions %}
<a href="https://docs.nextcloud.com/server/{{ v }}/{{current_doc}}/{{pagename}}.html" {% if version == v %} class="current-doc"{% endif %}>{{v}}</a>
{%- endfor %}
</div>
</div>
<div class="col-md-4">
{% if theme_show_search %}
<form class="headersearch" style="margin: 16px 0;" action="{{ pathto('search') }}" method="get">
<input type="text" value="" name="q" id="q" class="form-control" />
<button class="btn btn-default" type="submit" id="searchsubmit">Search</button>
</form>
{% endif %}
</div>
</div>
{% block sidebartoc %}
<div class="row page-content-header">
<div class="col-md-8">
<h1><a href="{{ pathto(master_doc) }}">{{ project|e }}</a></h1>
<div class="doc-version-switch">
Versions:
{%- for v in doc_versions %}
<a href="https://docs.nextcloud.com/server/{{ v }}/{{current_doc}}/{{pagename}}.html" {% if version == v %} class="current-doc"{% endif %}>{{v}}</a>
{%- endfor %}
</div>
</div>
<div class="col-md-4">
{% if theme_show_search %}
<form class="headersearch" style="margin: 16px 0;" action="{{ pathto('search') }}" method="get">
<input type="text" value="" name="q" id="q" class="form-control" />
<button class="btn btn-default" type="submit" id="searchsubmit">Search</button>
</form>
{% endif %}
</div>
</div>
{% block sidebartoc %}
<div class="row">
<div class="col-md-3">
<div class="sidebar">
@@ -172,18 +171,18 @@
<li><a href="{{ pathto(master_doc) }}">Table of Contents</a></li>
</ul>
{{ toctree(maxdepth=3) }}
{{ toctree(maxdepth=3) }}
</ul>
</div>
</div>
</div>
{% endblock %}
{% endblock %}
<div class="col-md-9">
<div class="page-content">
{% include "relations.html" %}
{% include "relations.html" %}
{% block body %}{% endblock %}
{% include "relations.html" %}
{% include "relations.html" %}
</div>
</div>
</div>
@@ -195,86 +194,86 @@
{%- block footer %}
<div class="container">
<div class="row">
<div class="col-lg-12 footer-social-icons">
<p class="text-center"><a target="_blank" href="https://plus.google.com/104036748063781940910/about"><img width=50 src="{{ pathto('_static/img/social/googleplus.svg', 1) }}" title="Follow us on Google Plus!" alt="Follow us on Google Plus!"></img></a>
<a target="_blank" href="https://www.facebook.com/Nextclouders"><img width=50 src="{{ pathto('_static/img/social/facebook.svg', 1) }}" title="Like our Facebook page!" alt="Like our Facebook page!"></img></a>
<a target="_blank" href="https://twitter.com/Nextclouders"><img width=50 src="{{ pathto('_static/img/social/twitter.svg', 1) }}" title="Subscribe to our Twitter channel!" alt="Subscribe to our Twitter channel!"></img></a>
<a target="_blank" href="https://nextcloud.com/blogfeed"><img class="img-circle" width=50 src="{{ pathto('_static/img/social/rss.svg', 1) }}" title="Subscribe to our news feed!" alt="Subscribe to our news feed!"></img></a>
<a target="_blank" href="https://newsletter.nextcloud.com/"><img class="img-circle" width=50 src="{{ pathto('_static/img/social/mail.svg', 1) }}" title="Subscribe to our newsletter!" alt="Subscribe to our newsletter!"></img></a></p>
</div>
<div class="text-center">
<p>All documentation licensed under the <a href="https://creativecommons.org/licenses/by/3.0/us/">Creative Commons Attribution 3.0 Unported license</a>.</p>
<p><a href="https://github.com/nextcloud/documentation/graphs/contributors">See who contributed to our documentation/credits</a>.</p>
{%- if show_source and has_source and sourcename and edit_on_github_url %}
<p>Do you want to help us to improve this document?
<a href="{{ edit_on_github_url }}" rel="nofollow">{{ _('Edit this page on GitHub') }} <span class="glyphicon glyphicon-pencil"></span></a>
</p>
{%- endif %}
</div>
<div class="col-lg-12 footer-social-icons">
<p class="text-center"><a target="_blank" href="https://plus.google.com/104036748063781940910/about"><img width=50 src="{{ pathto('_static/img/social/googleplus.svg', 1) }}" title="Follow us on Google Plus!" alt="Follow us on Google Plus!"></img></a>
<a target="_blank" href="https://www.facebook.com/Nextclouders"><img width=50 src="{{ pathto('_static/img/social/facebook.svg', 1) }}" title="Like our Facebook page!" alt="Like our Facebook page!"></img></a>
<a target="_blank" href="https://twitter.com/Nextclouders"><img width=50 src="{{ pathto('_static/img/social/twitter.svg', 1) }}" title="Subscribe to our Twitter channel!" alt="Subscribe to our Twitter channel!"></img></a>
<a target="_blank" href="https://nextcloud.com/blogfeed"><img class="img-circle" width=50 src="{{ pathto('_static/img/social/rss.svg', 1) }}" title="Subscribe to our news feed!" alt="Subscribe to our news feed!"></img></a>
<a target="_blank" href="https://newsletter.nextcloud.com/"><img class="img-circle" width=50 src="{{ pathto('_static/img/social/mail.svg', 1) }}" title="Subscribe to our newsletter!" alt="Subscribe to our newsletter!"></img></a></p>
</div>
<div class="text-center">
<p>All documentation licensed under the <a href="https://creativecommons.org/licenses/by/3.0/us/">Creative Commons Attribution 3.0 Unported license</a>.</p>
<p><a href="https://github.com/nextcloud/documentation/graphs/contributors">See who contributed to our documentation/credits</a>.</p>
{%- if show_source and has_source and sourcename and edit_on_github_url %}
<p>Do you want to help us to improve this document?
<a href="{{ edit_on_github_url }}" rel="nofollow">{{ _('Edit this page on GitHub') }} <span class="glyphicon glyphicon-pencil"></span></a>
</p>
{%- endif %}
</div>
</div>
</div>
<footer class="page-footer">
<div class="container">
<div class="col-sm-3">
<h1>About Nextcloud</h1>
<ul>
<li><a href="https://nextcloud.com/about">About us</a></li>
<li><a href="https://nextcloud.com/contributors">Community</a></li>
<li><a href="https://nextcloud.com/events">Events</a></li>
<li><a href="https://nextcloud.com/jobs">Jobs</a></li>
<li><a href="https://nextcloud.com/community/code-of-conduct/">Code of Conduct</a></li>
<li><a href="https://nextcloud.com/privacy">Privacy</a></li>
<li><a href="https://nextcloud.com/impressum">Legal notice</a></li>
</ul>
</div>
<div class="col-sm-3">
<h1>Resources</h1>
<ul>
<li><a href="https://nextcloud.com/install">Download</a></li>
<li><a href="https://apps.nextcloud.com">App Store</a></li>
<li><a href="https://docs.nextcloud.com/server/{{ version }}/admin_manual/">Admin manual</a></li>
<li><a href="https://docs.nextcloud.com/server/{{ version }}/user_manual/">User manual</a></li>
<li><a href="https://docs.nextcloud.com/server/{{ version }}/developer_manual/">Developer manual</a></li>
<li><a href="https://nextcloud.com/security">Security</a></li>
<li><a href="https://github.com/nextcloud">Code on GitHub</a></li>
</ul>
</div>
<div class="col-sm-3">
<h1>Interact</h1>
<ul>
<li><a href="https://nextcloud.com/support">Support</a></li>
<li><a href="https://webchat.freenode.net/?channels=nextcloud">IRC Channel</a></li>
<li><a href="https://help.nextcloud.com/categories">Forums</a></li>
<li><a href="https://demo.nextcloud.com">Demo</a></li>
<li><a href="https://nextcloud.com/contact">Contact us</a></li>
<li><a href="https://nextcloud.com/press">Press center</a></li>
<li><a href="https://docs.nextcloud.com/server/{{ version }}/developer_manual/bugtracker/">Bug Tracker</a></li>
</ul>
</div>
<div class="col-sm-3">
<h1>Follow us</h1>
<ul>
<li><a href="https://plus.google.com/b/104036748063781940910/104036748063781940910/about">Google+</a></li>
<li><a href="https://www.facebook.com/Nextcloud-1032807203462807/">Facebook</a></li>
<li><a href="https://www.linkedin.com/company/10827569/">LinkedIn</a></li>
<li><a href="https://instagram.com/nextclouders">Instagram</a></li>
<li><a href="https://twitter.com/nextclouders">Twitter</a></li>
<li><a href="https://youtube.com/nextcloud">YouTube</a></li>
<li><a href="https://nextcloud.com/blogfeed">RSS Feed</a></li>
</ul>
</div>
<div class="row">
<div class="col-sm-12 text-center copyright">
<p>
{%- if show_copyright %}
&copy; {{ copyright }}
{%- endif %}
{%- if last_updated %}
{% trans last_updated=last_updated|e %}Last updated on {{ last_updated }}.{% endtrans %}<br/>
{%- endif %}
</p>
</div>
</div>
</div>
<div class="container">
<div class="col-sm-3">
<h1>About Nextcloud</h1>
<ul>
<li><a href="https://nextcloud.com/about">About us</a></li>
<li><a href="https://nextcloud.com/contributors">Community</a></li>
<li><a href="https://nextcloud.com/events">Events</a></li>
<li><a href="https://nextcloud.com/jobs">Jobs</a></li>
<li><a href="https://nextcloud.com/community/code-of-conduct/">Code of Conduct</a></li>
<li><a href="https://nextcloud.com/privacy">Privacy</a></li>
<li><a href="https://nextcloud.com/impressum">Legal notice</a></li>
</ul>
</div>
<div class="col-sm-3">
<h1>Resources</h1>
<ul>
<li><a href="https://nextcloud.com/install">Download</a></li>
<li><a href="https://apps.nextcloud.com">App Store</a></li>
<li><a href="https://docs.nextcloud.com/server/{{ version }}/admin_manual/">Admin manual</a></li>
<li><a href="https://docs.nextcloud.com/server/{{ version }}/user_manual/">User manual</a></li>
<li><a href="https://docs.nextcloud.com/server/{{ version }}/developer_manual/">Developer manual</a></li>
<li><a href="https://nextcloud.com/security">Security</a></li>
<li><a href="https://github.com/nextcloud">Code on GitHub</a></li>
</ul>
</div>
<div class="col-sm-3">
<h1>Interact</h1>
<ul>
<li><a href="https://nextcloud.com/support">Support</a></li>
<li><a href="https://webchat.freenode.net/?channels=nextcloud">IRC Channel</a></li>
<li><a href="https://help.nextcloud.com/categories">Forums</a></li>
<li><a href="https://demo.nextcloud.com">Demo</a></li>
<li><a href="https://nextcloud.com/contact">Contact us</a></li>
<li><a href="https://nextcloud.com/press">Press center</a></li>
<li><a href="https://docs.nextcloud.com/server/{{ version }}/developer_manual/bugtracker/">Bug Tracker</a></li>
</ul>
</div>
<div class="col-sm-3">
<h1>Follow us</h1>
<ul>
<li><a href="https://plus.google.com/b/104036748063781940910/104036748063781940910/about">Google+</a></li>
<li><a href="https://www.facebook.com/Nextcloud-1032807203462807/">Facebook</a></li>
<li><a href="https://www.linkedin.com/company/10827569/">LinkedIn</a></li>
<li><a href="https://instagram.com/nextclouders">Instagram</a></li>
<li><a href="https://twitter.com/nextclouders">Twitter</a></li>
<li><a href="https://youtube.com/nextcloud">YouTube</a></li>
<li><a href="https://nextcloud.com/blogfeed">RSS Feed</a></li>
</ul>
</div>
<div class="row">
<div class="col-sm-12 text-center copyright">
<p>
{%- if show_copyright %}
&copy; {{ copyright }}
{%- endif %}
{%- if last_updated %}
{% trans last_updated=last_updated|e %}Last updated on {{ last_updated }}.{% endtrans %}<br/>
{%- endif %}
</p>
</div>
</div>
</div>
</footer>
{%- endblock %}

Binary file not shown.

After

Width:  |  Height:  |  Size: 49 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

View File

@@ -7,33 +7,7 @@
border-color: red;
}*/
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: normal;
src: local('Open Sans'), local('OpenSans'), url(fonts/OpenSans-Regular.woff) format('woff'), url(fonts/OpenSans-Regular.ttf) format('ttf');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: bold;
src: local('Open Sans Semibold'), local('OpenSans-Semibold'), url(fonts/OpenSans-Semibold.woff) format('woff'), url(fonts/OpenSans-Semibold.ttf) format('ttf');
}
@font-face {
font-family: 'Open Sans';
font-style: italic;
font-weight: normal;
src: local('Open Sans Italic'), local('OpenSans-Italic'), url(fonts/OpenSans-Italic.woff) format('woff'), url(fonts/OpenSans-Bold.ttf) format('ttf');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: light;
src: local('Open Sans Light'), local('OpenSans-Light'), url(fonts/OpenSans-Light.woff) format('woff'), url(fonts/OpenSans-Light.ttf) format('ttf');
}
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i');
@font-face {
font-family: 'Glyphicons Halflings';
@@ -120,33 +94,522 @@ button a:hover {text-decoration: none; }
/* Remove line under page headers (defined in main.min.css) */
.navbar {
background-color: #23305D;
background-attachment: scroll;
/* background-image: url(../img/home/720p.jpg); */
background-image: url(img/home/background3.jpg);
background-position: center;
background-repeat: none;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
border: 0px;
min-height: 100px !important;
/* min-height: 800px !important; */
z-index: 0 !important;
}
/* HEADER
https://raw.githubusercontent.com/nextcloud/nextcloud.com/master/assets/css/modules/header.css */
@-moz-document url-prefix() {
.brand {
-webkit-transform: scale(0.5);
top: -26px !important; } }
nav a {
text-decoration: none; }
.mobile-bg-container {
position: fixed;
-webkit-transform: translateZ(0);
transform: translateZ(0);
opacity: 0; }
@media (min-width: 991px) {
.mobile-bg-container {
display: none; } }
.mobile-bg-container.visible {
display: block; }
@media (min-width: 991px) {
.mobile-bg-container.visible {
display: none; } }
.mobile-bg-container.is-animatable {
opacity: 1;
width: 100%;
min-height: 100%; }
.mobile-bg-container .mobile-bg {
position: absolute;
background: #0082c9;
z-index: 2;
border-radius: 50%;
transition: all 0.3s ease-out; }
.mobile-bg-container .mobile-bg:not(.active) {
top: 0 !important;
right: calc(15px + 5%) !important;
width: 49px !important;
height: 49px !important; }
}
.nav {
z-index: 10;
padding-top: 20px;
position: absolute;
left: 0;
right: 0;
background: #0082c9;
position: relative;
opacity: 0; }
.nav.headroom {
transition: transform 500ms ease; }
.nav.headroom--not-top {
position: fixed !important; }
.nav.headroom--pinned {
transform: translate3d(0px, 0px, 0px);
opacity: 1; }
.nav.headroom--unpinned {
transform: translate3d(0px, -100px, 0px);
opacity: 0; }
.nav .container {
position: relative;
/* Fix ul and li settings in common */ }
@media (max-width: 992px) {
.nav .container {
width: 90%; } }
.nav .container .nav__bg-wrapper {
-webkit-transition: 0.3s;
transition: 0.3s;
position: absolute;
left: 0;
top: 100%;
visibility: hidden;
transition: 0.3s;
will-change: opacity;
z-index: -2;
top: 50px; }
.nav .container .nav__bg-wrapper.is-visible {
visibility: visible;
opacity: 1; }
.nav .container .nav__bg-wrapper .nav__bg {
width: 300px;
height: 200px;
background: white;
box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.11);
border: solid 1px #f1f1f1;
border-radius: 4px;
-webkit-transform-origin: left top;
transform-origin: left top;
will-change: transform;
visibility: hidden;
position: absolute;
z-index: 5;
top: 100%; }
.nav .container .nav__bg-wrapper .nav__bg:before {
content: "";
position: absolute;
bottom: 100%;
left: 50%;
right: auto;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
height: 0;
width: 0;
border: 8px solid transparent;
border-bottom-color: #f1f1f1; }
.nav .container .nav__bg-wrapper .nav__bg:after {
content: "";
position: absolute;
bottom: 100%;
left: 50%;
right: auto;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
height: 0;
width: 0;
border: 6px solid transparent;
border-bottom-color: white; }
.nav .container .nav__bg-wrapper .nav__bg.is-animatable {
-webkit-transition: 0.3s;
transition: 0.3s;
visibility: visible;
display: block; }
.nav .container .navbar-toggle {
display: none; }
.nav .container .brand {
z-index: 8;
position: absolute;
top: 0;
left: 0; }
.nav .container .brand .logo:not(.scrolled):not(.menu-open) {
background: url(img/logo_white_sprite.png) 0 0 no-repeat;
height: 100px;
width: 140px;
display: inline-block;
zoom: 0.5; }
.nav .container .brand .logo:not(.scrolled):not(.menu-open).hoverPlay {
background-position-x: 0;
-webkit-animation: play 2s steps(33) forwards;
-moz-animation: play 2s steps(33) forwards;
-ms-animation: play 2s steps(33) forwards;
-o-animation: play 2s steps(33) forwards;
animation: play 2s steps(33) forwards; }
.nav .container .brand .logo:not(.scrolled):not(.menu-open).stopedAnimation {
background-position-x: -4620px; }
.nav .container ul {
margin-top: 0px; }
.nav .container ul li {
margin-top: 0px; }
.nav .container .nav__sections {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
list-style-type: none;
position: absolute;
z-index: -1;
left: 20%;
top: 0%; }
@media (max-width: 1200px) {
.nav .container .nav__sections {
left: 10%; } }
.nav .container .nav__sections .nav__section {
padding: 15px 0 15px 0;
position: relative; }
.nav .container .nav__sections .nav__section:hover .nav__label {
opacity: 0.6;
cursor: default;
text-decoration: none; }
.nav .container .nav__sections .nav__section:hover .nav__links {
visibility: visible;
opacity: 1;
position: absolute;
left: 50%;
transform: translateX(-50%) translateZ(1px); }
.nav .container .nav__sections .nav__section .nav__label {
display: inline-block;
padding-left: 30px;
padding-bottom: 5px;
color: white;
-webkit-transition: 0.3s;
transition: 0.3s;
font-size: 16px; }
.nav .container .nav__sections .nav__section .nav__links {
position: absolute;
padding: 20px 20px 20px 35px;
visibility: hidden;
opacity: 0;
list-style-type: none;
transition: opacity 0.3s ease;
transition-delay: 0.1s; }
.nav .container .nav__sections .nav__section .nav__links .nav__item {
color: #666;
white-space: nowrap; }
.nav .container .nav__sections .nav__section .nav__links .nav__item a {
display: block;
padding: 5px 10px 0 0px;
font-size: 16px;
color: #555; }
.nav .container .nav__sections .nav__section .nav__links .nav__item a .nav__logo {
width: 45px;
min-height: 15px;
float: left;
vertical-align: middle; }
.nav .container .nav__sections .nav__section .nav__links .nav__item a .nav__logo img {
margin-top: 5px;
padding: 10px 8px 0 0;
height: 40px;
width: 40px; }
.nav .container .nav__sections .nav__section .nav__links .nav__item a .nav__text {
line-height: 1;
padding: 10px 30px 10px 0; }
.nav .container .nav__sections .nav__section .nav__links .nav__item a .nav__text strong {
line-height: 1.2;
font-weight: normal;
font-size: 18px; }
.nav .container .nav__sections .nav__section .nav__links .nav__item a .nav__text small {
opacity: 0.8; }
.nav .container .nav__sections .nav__section .nav__links .nav__item a:hover {
opacity: 0.6;
text-decoration: none; }
.nav .container .nav__sections .nav__section .nav__links .nav__item:not(:last-of-type) a {
padding-bottom: 5px; }
.nav .container .right-buttons {
position: absolute;
top: 0;
right: 0;
margin-top: 15px; }
.nav .container .right-buttons .ghost-btn {
text-align: center;
position: relative;
display: inline-block; }
.nav .container .right-buttons .ghost-btn a {
-webkit-transition: 0.3s;
transition: 0.3s;
position: relative; }
.nav .container .right-buttons .ghost-btn a:before {
content: "";
position: absolute;
width: 100%;
height: 2px;
bottom: 0;
left: 0;
background-color: white;
visibility: hidden;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transition: all 0.2s ease-in-out 0s;
transition: all 0.2s ease-in-out 0s; }
.nav .container .right-buttons .ghost-btn:hover a {
text-decoration: none; }
.nav .container .right-buttons .ghost-btn:hover a:before {
visibility: visible;
-webkit-transform: scaleX(1);
transform: scaleX(1); }
.nav .container .right-buttons li {
display: inline-block;
padding-left: 30px;
padding-bottom: 5px;
font-size: 16px;
margin-top: 0px; }
.nav .container .right-buttons li a {
color: white; }
div.page-header {
border-bottom: 0px solid #EEE;
}
/* Remove border from navbar (defined in main.min.css) */
.navbar {
border: 1px solid transparent;
}
@media (max-width: 992px) {
.nav .container .brand {
padding-left: 15px; }
.nav .container .brand .logo {
height: 53px;
width: 71px; }
.nav .container .brand .logo.menu-open {
background: url(../img/logo/logo_white_sprite.png) 0 0 no-repeat;
height: 100px;
width: 140px;
display: inline-block;
zoom: 0.5; }
.nav .container .brand .logo.menu-open.hoverPlay {
background-position-x: 0;
-webkit-animation: play 2s steps(33) forwards;
-moz-animation: play 2s steps(33) forwards;
-ms-animation: play 2s steps(33) forwards;
-o-animation: play 2s steps(33) forwards;
animation: play 2s steps(33) forwards; }
.nav .container .brand .logo.menu-open.stopedAnimation {
background-position-x: -4620px; }
.nav .container .mobile-bg {
position: fixed;
background: #0082c9;
padding-top: 25px;
z-index: 7;
top: 0;
right: 0;
width: 0;
height: 0;
visibility: hidden;
overflow: hidden;
border-bottom-left-radius: 100%;
transition: all 0.6s ease; }
.nav .container .active {
opacity: 1;
visibility: visible;
width: 150%;
height: 150%; }
.nav .container .navbar-toggle {
color: white;
background-color: white;
border-radius: 50px;
width: 50px;
height: 50px;
margin-top: 0;
z-index: 8;
display: block;
margin-right: 0;
border: none;
float: right; }
.nav .container .navbar-toggle:hover {
transform: scale(1.1);
transition: transform 0.3s cubic-bezier(0.56, 1, 0.86, 1.39);
transition-property: transform;
transition-duration: 0.3s;
transition-timing-function: cubic-bezier(0.56, 1, 0.86, 1.39);
transition-delay: initial; }
.nav .container .nav__sections-wrapper {
margin: 0 auto;
display: inline-block;
position: absolute;
top: 90px;
z-index: 2;
padding: 0; }
.nav .container .nav__sections-wrapper .nav__sections {
display: none;
position: relative;
left: 0;
padding: 0;
visibility: hidden; }
.nav .container .nav__sections-wrapper .nav__sections .nav__section {
display: block;
opacity: 1;
margin: 0;
opacity: 0;
color: white;
padding: 0;
visibility: hidden; }
.nav .container .nav__sections-wrapper .nav__sections .nav__section:last-child {
font-weight: 500; }
.nav .container .nav__sections-wrapper .nav__sections .nav__section a {
color: white;
text-decoration: none; }
.nav .container .nav__sections-wrapper .nav__sections.active {
display: block;
color: white;
margin: 0;
visibility: visible; }
.nav .container .nav__sections-wrapper .nav__sections.active .nav__section {
animation: fadeInRight .5s ease forwards;
animation-delay: .35s;
visibility: visible; }
.nav .container .nav__sections-wrapper .nav__sections.active .nav__section .nav__label {
font-size: 20px;
line-height: 20px;
padding-left: 0;
font-weight: 400; }
.nav .container .nav__sections-wrapper .nav__sections.active .nav__section:nth-of-type(2) {
animation-delay: .4s; }
.nav .container .nav__sections-wrapper .nav__sections.active .nav__section:nth-of-type(3) {
animation-delay: .45s; }
.nav .container .nav__sections-wrapper .nav__sections.active .nav__section:nth-of-type(4) {
animation-delay: .50s; }
.nav .container .nav__sections-wrapper .nav__sections.active .nav__section:nth-of-type(5) {
animation-delay: .55s; }
.nav .container .nav__sections-wrapper .nav__sections.active .nav__section:nth-of-type(6) {
animation-delay: .60s; }
.nav .container .nav__sections-wrapper .nav__sections.active .nav__section:nth-of-type(7) {
animation-delay: .65s; }
.nav .container .nav__sections-wrapper .nav__sections.active .nav__section:nth-of-type(8) {
animation-delay: .70s; }
.nav .container .nav__sections-wrapper .nav__sections.active .nav__section .nav__links {
display: none;
position: relative;
padding: 0;
width: 100%;
padding: 0 10px 0 20px; }
.nav .container .nav__sections-wrapper .nav__sections.active .nav__section .nav__links .nav__item {
margin-left: 0; }
.nav .container .nav__sections-wrapper .nav__sections.active .nav__section .nav__links .nav__item a {
font-size: 18px;
line-height: 18px;
color: white;
margin-left: 0;
font-weight: 300; }
.nav .container .nav__sections-wrapper .right-buttons {
position: relative;
padding: 0;
margin: 0;
opacity: 0;
transition: all 0.3s; }
.nav .container .nav__sections-wrapper .right-buttons.active {
opacity: 1;
transition-delay: .65s; }
.nav .container .nav__sections-wrapper .right-buttons.active .nav__label {
color: white; }
.nav .container .nav__sections-wrapper .right-buttons.active .ghost-btn a {
pointer-events: all; }
.nav .container .nav__sections-wrapper .right-buttons .ghost-btn {
font-size: 20px;
line-height: 20px;
padding-left: 0;
font-weight: 400;
display: block;
text-align: left;
padding-left: 0;
animation: fadeInRight .5s ease forwards;
pointer-events: none; } }
@keyframes fadeInRight {
0% {
opacity: 0;
left: 20%; }
100% {
opacity: 1;
left: 0; } }
/**
* Scrolled navbar style
*/
.nav {
padding-bottom: 70px;
transition: all .2s ease-in; }
@media (max-width: 992px) {
.nav {
padding-bottom: 20px; } }
.nav.no-shadow {
box-shadow: none !important; }
.nav.scrolled {
position: fixed;
background: white;
box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.09); }
.nav.scrolled .navbar-toggle:not(.active) {
background-color: #0082c9; }
.nav.scrolled .navbar-toggle:not(.active) svg {
filter: invert(100%); }
.nav.scrolled .logo:not(.menu-open) {
background: url(img/logo_blue_sprite.png) 0 0 no-repeat;
height: 100px;
width: 140px;
display: inline-block;
zoom: 0.5; }
.nav.scrolled .logo:not(.menu-open).hoverPlay {
background-position-x: 0;
-webkit-animation: play 2s steps(33) forwards;
-moz-animation: play 2s steps(33) forwards;
-ms-animation: play 2s steps(33) forwards;
-o-animation: play 2s steps(33) forwards;
animation: play 2s steps(33) forwards; }
.nav.scrolled .logo:not(.menu-open).stopedAnimation {
background-position-x: -4620px; }
.nav.scrolled .nav__sections-wrapper .nav__sections .nav__section .nav__label, .nav.scrolled .nav__sections-wrapper .nav__sections .ghost-btn .nav__label, .nav.scrolled .nav__sections-wrapper .nav__sections .ghost-btn .nav__label, .nav.scrolled .nav__sections-wrapper .right-buttons:not(.active) .nav__section .nav__label, .nav.scrolled .nav__sections-wrapper .right-buttons:not(.active) .ghost-btn .nav__label, .nav.scrolled .nav__sections-wrapper .right-buttons:not(.active) .ghost-btn .nav__label {
color: #555; }
.nav.scrolled .nav__sections-wrapper .nav__sections .nav__section .nav__label:before, .nav.scrolled .nav__sections-wrapper .nav__sections .ghost-btn .nav__label:before, .nav.scrolled .nav__sections-wrapper .nav__sections .ghost-btn .nav__label:before, .nav.scrolled .nav__sections-wrapper .right-buttons:not(.active) .nav__section .nav__label:before, .nav.scrolled .nav__sections-wrapper .right-buttons:not(.active) .ghost-btn .nav__label:before, .nav.scrolled .nav__sections-wrapper .right-buttons:not(.active) .ghost-btn .nav__label:before {
background-color: #555; }
.nav.mobile .nav__sections-wrapper .nav__sections .nav__section .nav__label, .nav.mobile .nav__sections-wrapper .ghost-btn .nav__section .nav__label {
color: white; }
/**
*Changed default media querys for navigation in bootstrap
*/
@media (max-width: 1200px) {
.navbar-header {
float: none; }
.navbar-left, .navbar-right {
float: none !important; }
.navbar-toggle {
display: block; }
.navbar-collapse {
border-top: 1px solid transparent;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); }
.navbar-fixed-top {
top: 0;
border-width: 0 0 1px; }
.navbar-collapse.collapse {
display: none !important; }
.navbar-nav {
float: none !important;
margin-top: 7.5px; }
.navbar-nav > li {
float: none; }
.navbar-nav > li > a {
padding-top: 10px;
padding-bottom: 10px; }
.collapse.in {
display: block !important; }
.navbar-nav .open .dropdown-menu {
position: static;
float: none;
width: auto;
margin-top: 0;
background-color: transparent;
border: 0;
-webkit-box-shadow: none;
box-shadow: none; } }
@keyframes play {
from {
background-position-x: 0px; }
to {
background-position-x: -4620px; } }
.banner img {
padding: 15px 0;