alplora
This commit is contained in:
Levi
parent
ea2f6444db
commit
34c8900c6b
5 changed files with 1200 additions and 580 deletions
|
|
@ -4,6 +4,20 @@
|
||||||
* For details, see http://www.apache.org/licenses/LICENSE-2.0.
|
* For details, see http://www.apache.org/licenses/LICENSE-2.0.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/* ==============================
|
||||||
|
Page loader
|
||||||
|
============================== */
|
||||||
|
|
||||||
|
@import "loader.css";
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/* ==============================
|
||||||
|
Alplora Css
|
||||||
|
============================== */
|
||||||
|
|
||||||
body,
|
body,
|
||||||
html {
|
html {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
@ -40,11 +54,33 @@ h6 {
|
||||||
padding-bottom: 50px;
|
padding-bottom: 50px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
color: #f8f8f8;
|
color: #f8f8f8;
|
||||||
background-image: url(../img/intro-bg.png) n
|
|
||||||
|
width: 100%;
|
||||||
|
height: 70vh;
|
||||||
|
max-height: 620px;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.intro-header .background{
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
background-positin: center center;
|
background-position: center center;
|
||||||
|
position: absolute;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
top: 0;
|
||||||
|
z-index: 0;
|
||||||
|
display: none;
|
||||||
}
|
}
|
||||||
|
.intro-header .background:nth-child(1){
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.intro-header-1 {
|
.intro-header-1 {
|
||||||
padding-top: 50px; /* If you're making other pages, make sure there is 50px of padding to make sure the navbar doesn't overlap content! */
|
padding-top: 50px; /* If you're making other pages, make sure there is 50px of padding to make sure the navbar doesn't overlap content! */
|
||||||
|
|
@ -65,9 +101,7 @@ h6 {
|
||||||
}
|
}
|
||||||
|
|
||||||
.intro-message {
|
.intro-message {
|
||||||
position: relative;
|
z-index: 10;
|
||||||
padding-top: 10%;
|
|
||||||
padding-bottom: 10%;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.intro-auth {
|
.intro-auth {
|
||||||
|
|
@ -114,7 +148,16 @@ h6 {
|
||||||
|
|
||||||
@media (max-width: 767px) {
|
@media (max-width: 767px) {
|
||||||
.intro-message {
|
.intro-message {
|
||||||
padding-bottom: 15%;
|
width: 80%;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.intro-message img{
|
||||||
|
width: 90%;
|
||||||
|
}
|
||||||
|
.container>.navbar-header {
|
||||||
|
margin-right: 0;
|
||||||
|
margin-left: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.intro-message > h1 {
|
.intro-message > h1 {
|
||||||
|
|
@ -314,9 +357,10 @@ section h3.section-subheading {
|
||||||
}
|
}
|
||||||
|
|
||||||
.ungleich-gallery-text-carousel {
|
.ungleich-gallery-text-carousel {
|
||||||
min-height: 220px;
|
min-height: 300px;
|
||||||
margin-bottom: 30px;
|
margin-bottom: 30px;
|
||||||
padding-bottom: 20px;
|
padding-bottom: 20px;
|
||||||
|
margin-top: 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ungleich-gallery-text-carousel .carousel-indicators, .text-carousel .carousel-indicators {
|
.ungleich-gallery-text-carousel .carousel-indicators, .text-carousel .carousel-indicators {
|
||||||
|
|
|
||||||
520
alplora/static/alplora/css/loader.css
Executable file
520
alplora/static/alplora/css/loader.css
Executable file
|
|
@ -0,0 +1,520 @@
|
||||||
|
|
||||||
|
.page-loader{
|
||||||
|
display:block;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
background: #fefefe;
|
||||||
|
z-index: 100000;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loader{
|
||||||
|
width: 116px;
|
||||||
|
height: 119px;
|
||||||
|
margin: 0 auto;
|
||||||
|
position: relative;
|
||||||
|
margin-bottom: 200px;
|
||||||
|
}
|
||||||
|
.loader .line{
|
||||||
|
height: 3px;
|
||||||
|
background-color: #C01722;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
.loader .line-1{
|
||||||
|
|
||||||
|
-ms-transform: rotate(-67eg); /* IE 9 */
|
||||||
|
-webkit-transform: rotate(-67deg); /* Chrome, Safari, Opera */
|
||||||
|
transform: rotate(-67deg);
|
||||||
|
position: absolute;
|
||||||
|
-webkit-animation: line-1-animation 4s infinite;
|
||||||
|
animation: line-1-animation 4s infinite;
|
||||||
|
-webkit-transform-origin: 0 0;
|
||||||
|
-moz-transform-origin: 0 0;
|
||||||
|
transform-origin: 0 0;
|
||||||
|
top: 100px;
|
||||||
|
left: 16px;
|
||||||
|
}
|
||||||
|
.loader .line-2{
|
||||||
|
|
||||||
|
-ms-transform: rotate(65eg);
|
||||||
|
-webkit-transform: rotate(65deg);
|
||||||
|
transform: rotate(65deg);
|
||||||
|
position: absolute;
|
||||||
|
-webkit-animation: line-2-animation 4s infinite;
|
||||||
|
animation: line-2-animation 4s infinite;
|
||||||
|
-webkit-transform-origin: 0 0;
|
||||||
|
-moz-transform-origin: 0 0;
|
||||||
|
transform-origin: 0 0;
|
||||||
|
top: 40px;
|
||||||
|
left: 45px;
|
||||||
|
}
|
||||||
|
.loader .line-3{
|
||||||
|
|
||||||
|
-ms-transform: rotate(-67eg); /* IE 9 */
|
||||||
|
-webkit-transform: rotate(-67deg); /* Chrome, Safari, Opera */
|
||||||
|
transform: rotate(-67deg);
|
||||||
|
position: absolute;
|
||||||
|
-webkit-animation: line-3-animation 4s infinite;
|
||||||
|
animation: line-3-animation 4s infinite;
|
||||||
|
-webkit-transform-origin: 0 0;
|
||||||
|
-moz-transform-origin: 0 0;
|
||||||
|
transform-origin: 0 0;
|
||||||
|
top: 86px;
|
||||||
|
left: 68px;
|
||||||
|
}
|
||||||
|
.loader .line-4{
|
||||||
|
|
||||||
|
-ms-transform: rotate(65eg);
|
||||||
|
-webkit-transform: rotate(65deg);
|
||||||
|
transform: rotate(65deg);
|
||||||
|
position: absolute;
|
||||||
|
-webkit-animation: line-4-animation 4s infinite;
|
||||||
|
animation: line-4-animation 4s infinite;
|
||||||
|
-webkit-transform-origin: 0 0;
|
||||||
|
-moz-transform-origin: 0 0;
|
||||||
|
transform-origin: 0 0;
|
||||||
|
top: 55px;
|
||||||
|
left: 82px;
|
||||||
|
}
|
||||||
|
.loader .circle{
|
||||||
|
content: "";
|
||||||
|
width: 17px;
|
||||||
|
height: 17px;
|
||||||
|
background: #C01722;
|
||||||
|
position: absolute;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
.loader .circle-1{
|
||||||
|
top: 96px;
|
||||||
|
left: 7px;
|
||||||
|
|
||||||
|
}
|
||||||
|
.loader .circle-2{
|
||||||
|
top: 32px;
|
||||||
|
left: 35px;
|
||||||
|
-webkit-animation: circle-animation-2 4s infinite;
|
||||||
|
animation: circle-animation-2 4s infinite;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.loader .circle-3{
|
||||||
|
left: 59px;
|
||||||
|
top: 79px;
|
||||||
|
-webkit-animation: circle-animation-3 4s infinite;
|
||||||
|
animation: circle-animation-3 4s infinite;
|
||||||
|
}
|
||||||
|
.loader .circle-4{
|
||||||
|
left: 73px;
|
||||||
|
top: 51px;
|
||||||
|
-webkit-animation: circle-animation-4 4s infinite;
|
||||||
|
animation: circle-animation-4 4s infinite;
|
||||||
|
}
|
||||||
|
.loader .circle-5{
|
||||||
|
top: 96px;
|
||||||
|
left: 96px;
|
||||||
|
-webkit-animation: circle-animation-5 4s infinite;
|
||||||
|
animation: circle-animation-5 4s infinite;
|
||||||
|
}
|
||||||
|
@-webkit-keyframes line-1-animation{
|
||||||
|
0% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
15%{
|
||||||
|
width: 66px;
|
||||||
|
}
|
||||||
|
25%{
|
||||||
|
width: 66px;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
width: 66px;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
width: 60px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@-webkit-keyframes line-2-animation{
|
||||||
|
0% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
25% {
|
||||||
|
width: 55px;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
width: 55px;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
width: 55px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@-webkit-keyframes line-3-animation{
|
||||||
|
0% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
25%{
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
width: 25px;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
width: 25px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@-webkit-keyframes line-4-animation{
|
||||||
|
0% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
25%{
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
75% {
|
||||||
|
width: 54px;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
width: 54px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes line-2-animation{
|
||||||
|
0% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
25% {
|
||||||
|
width: 55px;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
width: 55px;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
width: 55px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@-webkit-keyframes line-3-animation{
|
||||||
|
0% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
25%{
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
width: 25px;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
width: 25px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@-webkit-keyframes line-4-animation{
|
||||||
|
0% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
25%{
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
75% {
|
||||||
|
width: 54px;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
width: 54px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@-webkit-keyframes circle-animation-2{
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
15% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@-webkit-keyframes circle-animation-3{
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
25%{
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
30% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@-webkit-keyframes circle-animation-4{
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
25%{
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
75% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@-webkit-keyframes circle-animation-5{
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
25%{
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
95% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes line-1-animation{
|
||||||
|
0% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
15%{
|
||||||
|
width: 66px;
|
||||||
|
}
|
||||||
|
25%{
|
||||||
|
width: 66px;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
width: 66px;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
width: 60px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes line-2-animation{
|
||||||
|
0% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
25% {
|
||||||
|
width: 55px;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
width: 55px;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
width: 55px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes line-3-animation{
|
||||||
|
0% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
25%{
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
width: 25px;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
width: 25px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes line-4-animation{
|
||||||
|
0% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
25%{
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
75% {
|
||||||
|
width: 54px;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
width: 54px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes line-2-animation{
|
||||||
|
0% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
25% {
|
||||||
|
width: 55px;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
width: 55px;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
width: 55px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes line-3-animation{
|
||||||
|
0% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
25%{
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
width: 25px;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
width: 25px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes line-4-animation{
|
||||||
|
0% {
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
25%{
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
width: 0px;
|
||||||
|
}
|
||||||
|
75% {
|
||||||
|
width: 54px;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
width: 54px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes circle-animation-2{
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
15% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes circle-animation-3{
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
25%{
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
30% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes circle-animation-4{
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
25%{
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
75% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes circle-animation-5{
|
||||||
|
0% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
10%{
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
25%{
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
95% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
7
alplora/static/alplora/js/imagesloaded.pkgd.min.js
vendored
Executable file
7
alplora/static/alplora/js/imagesloaded.pkgd.min.js
vendored
Executable file
File diff suppressed because one or more lines are too long
38
alplora/static/alplora/js/main.js
Executable file
38
alplora/static/alplora/js/main.js
Executable file
|
|
@ -0,0 +1,38 @@
|
||||||
|
(function($){
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
$(window).load(function(){
|
||||||
|
|
||||||
|
// Page loader
|
||||||
|
|
||||||
|
$("body").imagesLoaded(function(){
|
||||||
|
$(".page-loader div").fadeOut();
|
||||||
|
$(".page-loader").delay(200).fadeOut("slow");
|
||||||
|
});
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
$( document ).ready(function() {
|
||||||
|
|
||||||
|
initBackgroundsHeader();
|
||||||
|
});
|
||||||
|
|
||||||
|
//Infinite loop for change Background Header
|
||||||
|
function _changeBg(index, arrayEl, time){
|
||||||
|
if(index===0)
|
||||||
|
$(arrayEl[0]).fadeIn(2000);
|
||||||
|
setTimeout(function(){
|
||||||
|
$(arrayEl[index]).fadeOut(2000);
|
||||||
|
if(index+1 < arrayEl.length)
|
||||||
|
$(arrayEl[index+1]).fadeIn(2000);
|
||||||
|
|
||||||
|
return index+1 === arrayEl.length ? _changeBg(0, arrayEl, time): _changeBg(index+1, arrayEl, time);
|
||||||
|
}, time);
|
||||||
|
}
|
||||||
|
function initBackgroundsHeader(){
|
||||||
|
var arrayElements = Array.from($('.intro-header .bg-slide'));
|
||||||
|
_changeBg(0, arrayElements, 4000);
|
||||||
|
}
|
||||||
|
|
||||||
|
})(jQuery);
|
||||||
|
|
@ -1,7 +1,5 @@
|
||||||
{% load staticfiles i18n%}
|
{% load staticfiles i18n%}
|
||||||
<!DOCTYPE html>
|
<html lang="en"><head>
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
|
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
|
@ -23,11 +21,11 @@
|
||||||
|
|
||||||
|
|
||||||
<!-- Custom Fonts -->
|
<!-- Custom Fonts -->
|
||||||
<link href=<link href=<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
|
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
|
||||||
<link href="https://fonts.googleapis.com/css?family=Questrial" rel="stylesheet">
|
<link href="https://fonts.googleapis.com/css?family=Questrial" rel="stylesheet">
|
||||||
<link rel="stylesheet" href="hosting/font-awesome/css/font-awesome.min.css">
|
<link rel="stylesheet" href="{% static 'alplora/font-awesome/css/font-awesome.min.css' %}">
|
||||||
<link href="http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css">
|
<link href="http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic,700italic" rel="stylesheet" type="text/css">
|
||||||
<link rel="shortcut icon" href="../img/favicon.ico" type="image/x-icon">
|
<link rel="shortcut icon" href="{% static 'alplora/img/favicon.ico' %}" type="image/x-icon">
|
||||||
|
|
||||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||||
|
|
@ -38,12 +36,8 @@
|
||||||
|
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body data-feedly-mini="yes">alt="">
|
|
||||||
<style media="screen" type="text/css">
|
<body data-feedly-mini="yes">
|
||||||
.intro-header {
|
|
||||||
background: url("{% static 'alplora/img/intro-bg.png' %}") no-repeat center center;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<script async src="//www.google-analytics.com/analytics.js"></script><script>
|
<script async src="//www.google-analytics.com/analytics.js"></script><script>
|
||||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||||
|
|
@ -57,12 +51,24 @@
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="page-loader">
|
||||||
|
<div class="loader">
|
||||||
|
<div class="circle circle-1"></div>
|
||||||
|
<div class="line line-1"></div>
|
||||||
|
<div class="circle circle-2"></div>
|
||||||
|
<div class="line line-2"></div>
|
||||||
|
<div class="circle circle-3"></div>
|
||||||
|
<div class="line line-3"></div>
|
||||||
|
<div class="circle circle-4"></div>
|
||||||
|
<div class="line line-4"></div>
|
||||||
|
<div class="circle circle-5"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<!-- Navigation -->
|
<!-- Navigation -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<nav class="navbar navbar-default navbar-fixed-top topnav" role="navigation">
|
<nav class="navbar navbar-default navbar-fixed-top topnav" role="navigation">
|
||||||
<div class="container topnav">
|
<div class="container topnav">
|
||||||
<!-- Brand and toggle get grouped for better mobile display -->
|
<!-- Brand and toggle get grouped for better mobile display -->
|
||||||
|
|
@ -73,7 +79,7 @@
|
||||||
<span class="icon-bar"></span>
|
<span class="icon-bar"></span>
|
||||||
<span class="icon-bar"></span>
|
<span class="icon-bar"></span>
|
||||||
</button>
|
</button>
|
||||||
<a class="navbar-brand topnav" href="/en-us/"><img src="{% static 'alplora/img/logo_black.svg' %}"></a>
|
<a class="navbar-brand topnav" href="/en-us/"><img src="{% static 'alplora/img/logo_black.svg'%}"></a>
|
||||||
</div>
|
</div>
|
||||||
<!-- Collect the nav links, forms, and other content for toggling -->
|
<!-- Collect the nav links, forms, and other content for toggling -->
|
||||||
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
|
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
|
||||||
|
|
@ -105,14 +111,16 @@
|
||||||
|
|
||||||
<!-- Header -->
|
<!-- Header -->
|
||||||
|
|
||||||
|
|
||||||
<a name="about"></a>
|
<a name="about"></a>
|
||||||
<div class="intro-header">
|
<section class="intro-header">
|
||||||
<div class="container">
|
<!-- Add images backgrounds url(url-image); -->
|
||||||
|
<div class="background bg-slide" style="background-image: url({% static 'alplora/img/intro-bg.png' %});"></div>
|
||||||
<div class="row">
|
<div class="background bg-slide" style="background-image: url({% static 'alplora/img/configure.jpg' %});"></div>
|
||||||
<div class="col-lg-12">
|
<div class="background bg-slide" style="background-image: url({% static 'alplora/img/django-intro-bg.png' %});"></div>
|
||||||
|
<div class="background bg-slide" style="background-image: url({% static 'alplora/img/rails-intro-bg.png' %});"></div>
|
||||||
<div class="intro-message">
|
<div class="intro-message">
|
||||||
|
|
||||||
<img class="responsive" src="{% static 'alplora/img/alplora_logo_nopadding.svg' %}">
|
<img class="responsive" src="{% static 'alplora/img/alplora_logo_nopadding.svg' %}">
|
||||||
<h1>Perfect fit for Swiss Alps</h1>
|
<h1>Perfect fit for Swiss Alps</h1>
|
||||||
<h3>Find your herd anytime, anywhere</h3>
|
<h3>Find your herd anytime, anywhere</h3>
|
||||||
|
|
@ -126,13 +134,10 @@
|
||||||
</li>
|
</li>
|
||||||
</ul> -->
|
</ul> -->
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<!-- /.container -->
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
</section>
|
||||||
<!-- /.intro-header -->
|
<!-- /.intro-header -->
|
||||||
<section id="whatis">
|
<section id="whatis">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
|
|
@ -147,7 +152,7 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
<div class="row text-center">
|
<div class="row text-center">
|
||||||
<div class="col-sm-4">
|
<div class="col-sm-4">
|
||||||
<div class="team-member wow fadeInDown" data-wow-delay="0.5s">
|
<div class="team-member wow fadeInDown" data-wow-delay="0.5s">
|
||||||
<img src="{% static 'alplora/img/missing.svg' %}" data-replaced="hoimg/services/hosting.png" class="img-responsive img-toggle" alt="">
|
<img src="{% static 'alplora/img/missing.svg'%}" data-replaced="hoimg/services/hosting.png" class="img-responsive img-toggle" alt="">
|
||||||
<div class="team-member-caption inline-block">
|
<div class="team-member-caption inline-block">
|
||||||
<h4 class="portfolio-caption">LOST</h4>
|
<h4 class="portfolio-caption">LOST</h4>
|
||||||
|
|
||||||
|
|
@ -156,7 +161,7 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-sm-4">
|
<div class="col-sm-4">
|
||||||
<div class="team-member wow fadeInDown" data-wow-delay="1s">
|
<div class="team-member wow fadeInDown" data-wow-delay="1s">
|
||||||
<img src="{% static 'alplora/img/wolf.svg' %}" data-replaced="img/services/configuration.png" class="img-responsive img-toggle" alt="">
|
<img src="{% static 'alplora/img/wolf.svg'%}" data-replaced="img/services/configuration.png" class="img-responsive img-toggle" alt="">
|
||||||
<div class="team-member-caption inline-block">
|
<div class="team-member-caption inline-block">
|
||||||
<h4 class="portfolio-caption">WOLF</h4>
|
<h4 class="portfolio-caption">WOLF</h4>
|
||||||
<p class="text-muted"> </p>
|
<p class="text-muted"> </p>
|
||||||
|
|
@ -165,7 +170,7 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-sm-4">
|
<div class="col-sm-4">
|
||||||
<div class="team-member wow fadeInDown" data-wow-delay="1.5s">
|
<div class="team-member wow fadeInDown" data-wow-delay="1.5s">
|
||||||
<img src="{% static 'alplora/img/injured.svg' %}" data-replaced="img/services/linux.png" class="img-responsive img-toggle cursor-pointer" alt="">
|
<img src="{% static 'alplora/img/injured.svg'%}" data-replaced="img/services/linux.png" class="img-responsive img-toggle cursor-pointer" alt="">
|
||||||
<h4 class="portfolio-caption">INJURED</h4>
|
<h4 class="portfolio-caption">INJURED</h4>
|
||||||
<p class="text-muted"> </p>
|
<p class="text-muted"> </p>
|
||||||
|
|
||||||
|
|
@ -185,7 +190,7 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
<div class="row text-center">
|
<div class="row text-center">
|
||||||
<div class="col-sm-4">
|
<div class="col-sm-4">
|
||||||
<div class="team-member wow fadeInDown" data-wow-delay="0.5s">
|
<div class="team-member wow fadeInDown" data-wow-delay="0.5s">
|
||||||
<img src="{% static 'alplora/img/apps.svg' %}" data-replaced="hoimg/services/hosting.png" class="img-responsive img-toggle" alt="">
|
<img src="{% static 'alplora/img/apps.svg'%}" data-replaced="hoimg/services/hosting.png" class="img-responsive img-toggle" alt="">
|
||||||
<div class="team-member-caption inline-block">
|
<div class="team-member-caption inline-block">
|
||||||
<h4 class="portfolio-caption">Access app</h4>
|
<h4 class="portfolio-caption">Access app</h4>
|
||||||
<p> </p>
|
<p> </p>
|
||||||
|
|
@ -195,7 +200,7 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-sm-4">
|
<div class="col-sm-4">
|
||||||
<div class="team-member wow fadeInDown" data-wow-delay="1s">
|
<div class="team-member wow fadeInDown" data-wow-delay="1s">
|
||||||
<img src="{% static 'alplora/img/alarm.svg' %}" data-replaced="img/services/configuration.png" class="img-responsive img-toggle" alt="">
|
<img src="{% static 'alplora/img/alarm.svg'%}" data-replaced="img/services/configuration.png" class="img-responsive img-toggle" alt="">
|
||||||
<div class="team-member-caption inline-block">
|
<div class="team-member-caption inline-block">
|
||||||
<h4 class="portfolio-caption">Get an alarm</h4>
|
<h4 class="portfolio-caption">Get an alarm</h4>
|
||||||
<p> </p>
|
<p> </p>
|
||||||
|
|
@ -206,7 +211,7 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-sm-4">
|
<div class="col-sm-4">
|
||||||
<div class="team-member wow fadeInDown" data-wow-delay="1.5s">
|
<div class="team-member wow fadeInDown" data-wow-delay="1.5s">
|
||||||
<img src="{% static 'alplora/img/arms.svg' %}" data-replaced="img/services/linux.png" class="img-responsive img-toggle cursor-pointer" alt="">
|
<img src="{% static 'alplora/img/arms.svg'%}" data-replaced="img/services/linux.png" class="img-responsive img-toggle cursor-pointer" alt="">
|
||||||
<h4 class="portfolio-caption">Find your animal</h4>
|
<h4 class="portfolio-caption">Find your animal</h4>
|
||||||
<p class="text-muted"> </p>
|
<p class="text-muted"> </p>
|
||||||
<div class="team-member-caption inline-block">
|
<div class="team-member-caption inline-block">
|
||||||
|
|
@ -225,7 +230,7 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
</div>
|
</div>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-md-4 col-sm-6 text-center portfolio-item wow fadeInDown" data-wow-delay="0.5s">
|
<div class="col-md-4 col-sm-6 text-center portfolio-item wow fadeInDown" data-wow-delay="0.5s">
|
||||||
<img src="{% static 'alplora/img/tested.png' %}" class="img-responsive inline-block" alt="">
|
<img src="{% static 'alplora/img/tested.png'%}" class="img-responsive inline-block" alt="">
|
||||||
<div class="portfolio-caption inline-block">
|
<div class="portfolio-caption inline-block">
|
||||||
<h4>Perfect fit for Swiss mountains</h4>
|
<h4>Perfect fit for Swiss mountains</h4>
|
||||||
<p> </p>
|
<p> </p>
|
||||||
|
|
@ -233,7 +238,7 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-4 col-sm-6 text-center portfolio-item wow fadeInDown" data-wow-delay="1s">
|
<div class="col-md-4 col-sm-6 text-center portfolio-item wow fadeInDown" data-wow-delay="1s">
|
||||||
<img src="{% static 'alplora/img/lora.png' %}" class="img-responsive inline-block" alt="">
|
<img src="{% static 'alplora/img/lora.png'%}" class="img-responsive inline-block" alt="">
|
||||||
<div class="portfolio-caption inline-block">
|
<div class="portfolio-caption inline-block">
|
||||||
<h4>LoraWAN</h4>
|
<h4>LoraWAN</h4>
|
||||||
<p> </p>
|
<p> </p>
|
||||||
|
|
@ -241,7 +246,7 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-md-4 col-sm-6 text-center portfolio-item wow fadeInDown" data-wow-delay="1.5s">
|
<div class="col-md-4 col-sm-6 text-center portfolio-item wow fadeInDown" data-wow-delay="1.5s">
|
||||||
<img src="{% static 'alplora/img/love.png' %}" class="img-responsive inline-block" alt="">
|
<img src="{% static 'alplora/img/love.png'%}" class="img-responsive inline-block" alt="">
|
||||||
<div class="portfolio-caption inline-block">
|
<div class="portfolio-caption inline-block">
|
||||||
<h4>Made with love</h4>
|
<h4>Made with love</h4>
|
||||||
<p> </p>
|
<p> </p>
|
||||||
|
|
@ -287,7 +292,7 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-lg-5 col-lg-offset-2 col-sm-6">
|
<div class="col-lg-5 col-lg-offset-2 col-sm-6">
|
||||||
<img class="img-responsive" src="{% static 'alplora/img/animals.svg' %}" alt="">
|
<img class="img-responsive" src="{% static 'alplora/img/animals.svg'%}" alt="">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -320,7 +325,7 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-lg-5 col-sm-pull-6 col-sm-6">
|
<div class="col-lg-5 col-sm-pull-6 col-sm-6">
|
||||||
<img class="img-responsive" src="{% static 'alplora/img/doyou.svg' %}" alt="">
|
<img class="img-responsive" src="{% static 'alplora/img/doyou.svg'%}" alt="">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -338,7 +343,7 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-sm-10 center-block wow fadeInDown">
|
<div class="col-sm-10 col-sm-offset-1 wow fadeInDown">
|
||||||
<!-- start:recommendationSlider -->
|
<!-- start:recommendationSlider -->
|
||||||
<div id="carousel-recommendation-ungleich" class="carousel slide ungleich ungleich-gallery ungleich-gallery-text-carousel" data-ride="carousel" data-interval="3000">
|
<div id="carousel-recommendation-ungleich" class="carousel slide ungleich ungleich-gallery ungleich-gallery-text-carousel" data-ride="carousel" data-interval="3000">
|
||||||
<!-- Indicators -->
|
<!-- Indicators -->
|
||||||
|
|
@ -351,7 +356,7 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
<!-- Wrapper for slides -->
|
<!-- Wrapper for slides -->
|
||||||
<div class="carousel-inner" role="listbox">
|
<div class="carousel-inner" role="listbox">
|
||||||
<div class="item active">
|
<div class="item active">
|
||||||
<img class="center-block img-client img-responsive" src="{% static 'alplora/img/berg.png' %}" />
|
<img class="center-block img-client img-responsive" src="{% static 'alplora/img/berg.png'%}" />
|
||||||
<p class="carousel-text text-muted text-center">
|
<p class="carousel-text text-muted text-center">
|
||||||
“Alplora is an innovation in looking after my cows. I can check where my cows have been in the higher mountain all day while doing other works at the farm down in the village. I can do more for keeping my cows safe thanks to Alplora.”
|
“Alplora is an innovation in looking after my cows. I can check where my cows have been in the higher mountain all day while doing other works at the farm down in the village. I can do more for keeping my cows safe thanks to Alplora.”
|
||||||
</p>
|
</p>
|
||||||
|
|
@ -360,7 +365,7 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="item">
|
<div class="item">
|
||||||
<img class="center-block img-client img-responsive" src="{% static 'alplora/img/berg.png' %}" />
|
<img class="center-block img-client img-responsive" src="{% static 'alplora/img/berg.png'%}" />
|
||||||
<p class="carousel-text text-muted text-center">
|
<p class="carousel-text text-muted text-center">
|
||||||
"Alplora is exactly what I was waiting for. I have lost my sheep almost every year. Finally I have a way when I want to locate them."
|
"Alplora is exactly what I was waiting for. I have lost my sheep almost every year. Finally I have a way when I want to locate them."
|
||||||
</p>
|
</p>
|
||||||
|
|
@ -369,7 +374,7 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="item">
|
<div class="item">
|
||||||
<img class="center-block img-client img-responsive" src="{% static 'alplora/img/berg.png' %}" />
|
<img class="center-block img-client img-responsive" src="{% static 'alplora/img/berg.png'%}" />
|
||||||
<p class="carousel-text text-muted text-center">
|
<p class="carousel-text text-muted text-center">
|
||||||
"I have a farm down all the way down in the village and y goats are always freely grazing in the Alps. There are times that I am worried about them but have difficulties to make my way up, because I have other animals to look after. With Alplora, now I can easily do both."
|
"I have a farm down all the way down in the village and y goats are always freely grazing in the Alps. There are times that I am worried about them but have difficulties to make my way up, because I have other animals to look after. With Alplora, now I can easily do both."
|
||||||
</p>
|
</p>
|
||||||
|
|
@ -454,9 +459,9 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
<div class="col-xs-6 col-lg-4"></div>
|
<div class="col-xs-6 col-lg-4"></div>
|
||||||
<div class="col-xs-6 col-lg-8 text-right">
|
<div class="col-xs-6 col-lg-8 text-right">
|
||||||
<a href="www.ungleich.ch">
|
<a href="www.ungleich.ch">
|
||||||
<img src="{% static 'alplora/img/ungleich_logo.svg' %}">
|
<img src="{% static 'alplora/img/ungleich_logo.svg'%}">
|
||||||
<img src="{% static 'alplora/img/digitalglarus_logo.svg' %}">
|
<img src="{% static 'alplora/img/digitalglarus_logo.svg'%}">
|
||||||
<img src="{% static 'alplora/img/adnexo_logo.svg' %}">
|
<img src="{% static 'alplora/img/adnexo_logo.svg'%}">
|
||||||
</div>
|
</div>
|
||||||
<p class="copyright text-muted small">Copyright © Alplora 2017. All Rights Reserved</p>
|
<p class="copyright text-muted small">Copyright © Alplora 2017. All Rights Reserved</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -474,12 +479,16 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
<script src="{% static 'alplora/js/jquery.js' %}"></script>
|
<script src="{% static 'alplora/js/jquery.js' %}"></script>
|
||||||
|
|
||||||
<!-- Pricing -->
|
<!-- Pricing -->
|
||||||
<script src="{% static 'alplora/js/pricing.js' %}" ></script>
|
<script src="{% static 'alplora/js/pricing.js' %}"></script>
|
||||||
|
|
||||||
|
<!-- Images loaded -->
|
||||||
|
<script type="text/javascript" src="{% static 'alplora/js/imagesloaded.pkgd.min.js' %}"></script>
|
||||||
|
|
||||||
<!-- Bootstrap Core JavaScript -->
|
<!-- Bootstrap Core JavaScript -->
|
||||||
<script src="{% static 'alplora/js/bootstrap.min.js' %}"></script>
|
<script src="{% static 'alplora/js/bootstrap.min.js' %}"></script>
|
||||||
|
|
||||||
|
<script src="{% static 'alplora/js/main.js' %}"></script>
|
||||||
|
|
||||||
|
|
||||||
<link rel="stylesheet" href="/static/debug_toolbar/css/print.css" type="text/css" media="print">
|
<link rel="stylesheet" href="/static/debug_toolbar/css/print.css" type="text/css" media="print">
|
||||||
<link rel="stylesheet" href="/static/debug_toolbar/css/toolbar.css" type="text/css">
|
<link rel="stylesheet" href="/static/debug_toolbar/css/toolbar.css" type="text/css">
|
||||||
|
|
@ -863,4 +872,6 @@ Alplora is just like a cattle bell, but much better.<p></p>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div id="feedly-mini" title="feedly Mini tookit"></div></body></html>
|
<div id="feedly-mini" title="feedly Mini tookit"></div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Loading…
Reference in a new issue