html, body {
height: 100%;
font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
margin: 0;
}
#map {
//float: left;
}
.mapDiv {
height: 98%;
width: 100%;
margin: auto;
background: linear-gradient(rgba(160,110,106,1),rgba(64,9,4,1));
}
.viewContent{
display: block;
position: relative;
z-index: 5000;
height: -moz-calc(100% - 65px);
/* WebKit */
height: -webkit-calc(100% - 65px);
/* Opera */
height: -o-calc(100% - 65px);
/* Standard */
height: calc(100% - 65px);
/* Firefox */
width: -moz-calc(100%);
/* WebKit */
width: -webkit-calc(100%);
/* Opera */
width: -o-calc(100%);
/* Standard */
width: calc(100%);
}
.map {
height: 100%;
max-width: 100%;
//position: absolute;
}
.imgContainer{
width: 100%;
height: 200px;
overflow: hidden;
//margin: auto;
text-align: center;
//left: 50%;
background-position: center;
}
.imgContainerSponsor{
width: 100%;
overflow: hidden;
text-align: center;
background-position: center;
background: white;
}
.imgAbsolute{
width:100%;
height:200px;
text-align:center;
// border-radius:50%;
overflow:hidden;
}
.img{
min-width:0px;
max-width:none;
height:200px;
margin:0 -100%;
box-shadow: -79px 0px 0px 0px rgba(255,255,255,1), 79px 0px 0px 0px rgba(255,255,255,1);
}
.imgSponsor{
background: white;
max-height: 100px;
max-width: 100%;
box-shadow: -79px 0px 0px 0px rgba(255,255,255,1), 79px 0px 0px 0px rgba(255,255,255,1);
}
.imgSponsored{
background: white;
//min-width:200px;
width: 100%;
//max-width:190px;
max-height:200px;
margin: 0px 0px;
padding-left: 10px;
padding-right: 10px;
clear: both;
-webkit-box-shadow: -79px 0px 0px 0px rgba(255,255,255,1), 79px 0px 0px 0px rgba(255,255,255,1);
-moz-box-shadow: -79px 0px 0px 0px rgba(255,255,255,1), 79px 0px 0px 0px rgba(255,255,255,1);
box-shadow: -79px 0px 0px 0px rgba(255,255,255,1), 79px 0px 0px 0px rgba(255,255,255,1);
}
.socialMediaIcon{
margin-top: 30px;
margin-left: 15px;
/* float: left; */
//transform: scale(0.2);
margin-bottom: 30px;
box-shadow: 3px 3px rgba(0,0,0,0.2);
cursor: pointer;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.socialMediaGroup{
margin-bottom: 50px;
}
.socialMediaIcon:hover{
transform: scale(1.12);
}
.navigationButton{
float: left;
margin-left: 5px;
//text-decoration:underline;
width: 135px;
font-variant:small-caps;
margin-top: 5px;
padding: 20px 10px;
font-size: 16px;
box-shadow: 0 5px #FFF;
text-align: center;
cursor: pointer;
outline: none;
color: #fff;
background-color: rgba(127,95,91,1);
border: none;
border-radius: 0px;
background: linear-gradient(rgba(190,140,136,0.5),rgba(64,9,4,0.5));
border: none;
border-radius: 5px;
}
.settingsButton{
float: right;
//text-decoration:underline;
//width: 170px;
font-variant:small-caps;
margin-top: 5px;
padding: 20px 10px;
font-size: 16px;
box-shadow: 0 5px #FFF;
text-align: center;
cursor: pointer;
outline: none;
color: #fff;
background-color: rgba(127,95,91,1);
border: none;
border-radius: 0px;
background: linear-gradient(rgba(190,140,136,0.5),rgba(64,9,4,0.5));
border: none;
border-radius: 5px;
display: block;
}
.glyphicon{
top: 2px !important;
}
.navigationBox{
cursor: pointer;
color: #777;
display: inline-block;
width: 45px;
height: 45px;
line-height: 39px;
position: absolute;
left: 101%;
font-size: 16px;
opacity: 0.90;
background-color: white;
border: 2px solid white;
text-align: center;
vertical-align: middle;
-webkit-transition: all 0.1s ease-in-out;
-moz-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
-ms-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out;
}
.navigationBox:hover{
width: 55px;
color: white;
background-color: rgba(40,40,40,0.7);
}
.closeBox{
top: -2px;
}
.homeBox{
top: 44px;
}
.beforeBox{
top: 90px;
}
.nextBox{
top: 136px;
}
.projectPanel{
position: absolute;
/* Firefox */
height: -moz-calc(100% - 30px);
/* WebKit */
height: -webkit-calc(100% - 30px);
/* Opera */
height: -o-calc(100% - 30px);
/* Standard */
height: calc(100% - 30px);
//-webkit-perspective-origin: left; /* Chrome, Safari, Opera */
perspective: 1900px;
-webkit-perspective: 1900px; /* Chrome, Safari, Opera */
//perspective-origin: 150% 50%;
z-index: 9999;
}
.projectPanelContent{
transform-origin: left;
-webkit-transform: rotateY(90deg); /* Chrome, Safari, Opera */
transform: rotateY(90deg);
opacity: 0;
display: block;
margin: 15px 15px;
text-align: left;
//background-color: rgba(146,96,91,0.5);
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
background: linear-gradient(rgba(160,110,106,0.7),rgba(100,50,46,1));
/* Firefox */
height: -moz-calc(100% - 30px);
/* WebKit */
height: -webkit-calc(100% - 30px);
/* Opera */
height: -o-calc(100% - 30px);
/* Standard */
height: calc(100% - 30px);
/* Firefox */
width: -moz-calc(100% - 100px);
/* WebKit */
width: -webkit-calc(100% - 100px);
/* Opera */
width: -o-calc(100% - 100px);
/* Standard */
width: calc(100% - 100px);
width: 280px;
max-width: 400px;
position: absolute;
z-index: 2000;
border: 2px solid white;
//border-radius: 15px;
}
/* @media screen and (max-height: 500px) { */
.projectPanelScrollable{
height: -moz-calc(100% - 64px);
/* WebKit */
height: -webkit-calc(100% - 64px);
/* Opera */
height: -o-calc(100% - 64px);
/* Standard */
height: calc(100% - 64px);
/* Firefox */
position: relative;
/* max-height: 70%; */
overflow: hidden;
overflow: auto;
}
/* } */
.projectPanelActivated{
opacity: 1;
-webkit-transform: rotateY(0deg); /* Chrome, Safari, Opera */
transform: rotateY(0deg);
}
.projectPanelHeader{
padding: 15px 30px;
/* margin-bottom: 15px; */
font-size: 24px;
background: linear-gradient(rgba(160,110,106,1),rgba(120,70,66,1));
color: white;
}
.closeProjectPanelBox{
top: -2px;
cursor: pointer;
color: #fff;
display: inline-block;
width: 45px;
height: 45px;
line-height: 39px;
position: absolute;
left: 81%;
top: 10px;
font-size: 14px;
background-color: rgba(120,70,66,0.2);
opacity: 0.30;
//background: rgba(120,70,66,0.2);
//background: linear-gradient(rgba(120,70,66,1),rgba(255,255,255,0.4));
border: none;
text-align: center;
vertical-align: middle;
-webkit-transition: all 0.1s ease-in-out;
-moz-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
-ms-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out;
z-index: 999;
}
.closeProjectPanelBox:hover{
opacity: 0.85;
background-color: white;
color: black;
}
.languagePanel{
position: absolute;
top: 0; left: 0; bottom: 0; right: 0;
/* Firefox */
height: 0px;
//min-height: 300px;
width: 300px;
margin: 50px auto;
perspective: 1500px;
-webkit-perspective: 1500px; /* Chrome, Safari, Opera */
//transform-origin: 50% 0%;
z-index: 59998;
}
@media screen and (max-height: 500px) {
.languagePanelScrollable{
max-height: 130px;
overflow: hidden;
overflow: auto;
}
}
.languagePanelContent{
background: linear-gradient(rgba(210,210,210,0.6),rgba(255,255,255,1));
border: 2px solid white;
display: inline-block;
text-align: center;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
//height: 100%;
width: 100%;
opacity: 0;
-webkit-transform: rotateX(-90deg); /* Chrome, Safari, Opera */
transform: rotateX(-90deg);
transform-origin: top;
}
.languagePanelActivated{
opacity: 1;
-webkit-transform: rotateX(0deg); /* Chrome, Safari, Opera */
transform: rotateX(0deg);
}
.languagePanelHeader{
padding: 15px 30px;
margin-bottom: 15px;
font-size: 24px;
background: linear-gradient(rgba(160,110,106,1),rgba(120,70,66,1));
color: white;
}
.closeLanguagePanelBox{
top: -2px;
cursor: pointer;
color: #fff;
display: inline-block;
width: 45px;
height: 45px;
line-height: 39px;
position: absolute;
left: 81%;
top: 10px;
font-size: 14px;
background-color: rgba(120,70,66,0.2);
opacity: 0.30;
//background: rgba(120,70,66,0.2);
//background: linear-gradient(rgba(120,70,66,1),rgba(255,255,255,0.4));
border: none;
text-align: center;
vertical-align: middle;
-webkit-transition: all 0.1s ease-in-out;
-moz-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
-ms-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out;
}
.closeLanguagePanelBox:hover{
opacity: 0.85;
background-color: white;
color: black;
}
.landPanel{
position: absolute;
/* Firefox */
height: -moz-calc(100% - 30px);
/* WebKit */
height: -webkit-calc(100% - 30px);
/* Opera */
height: -o-calc(100% - 30px);
/* Standard */
height: calc(100% - 30px);
//-webkit-perspective-origin: left; /* Chrome, Safari, Opera */
perspective: 1900px;
-webkit-perspective: 1900px; /* Chrome, Safari, Opera */
//perspective-origin: 150% 50%;
z-index: 9999;
}
@media screen and (max-height: 500px) {
.landPanelScrollable{
max-height: 130px;
overflow: hidden;
overflow: auto;
}
}
.landPanelContent{
transform-origin: left;
-webkit-transform: rotateY(90deg); /* Chrome, Safari, Opera */
transform: rotateY(90deg);
opacity: 0;
display: block;
margin: 15px 15px;
text-align: left;
//background-color: rgba(146,96,91,0.5);
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
background: linear-gradient(rgba(160,110,106,0.7),rgba(100,50,46,1));
/* Firefox */
height: -moz-calc(100% - 30px);
/* WebKit */
height: -webkit-calc(100% - 30px);
/* Opera */
height: -o-calc(100% - 30px);
/* Standard */
height: calc(100% - 30px);
/* Firefox */
width: -moz-calc(100% - 100px);
/* WebKit */
width: -webkit-calc(100% - 100px);
/* Opera */
width: -o-calc(100% - 100px);
/* Standard */
width: calc(100% - 100px);
width: 280px;
max-width: 400px;
position: absolute;
z-index: 2000;
border: 2px solid white;
//border-radius: 15px;
}
.landPanelActivated{
transform-origin: left;
opacity: 1;
-webkit-transform: rotateY(0deg); /* Chrome, Safari, Opera */
transform: rotateY(0deg);
}
.landPanelHeader{
padding: 15px 30px;
margin-bottom: 15px;
font-size: 24px;
background: linear-gradient(rgba(160,110,106,1),rgba(120,70,66,1));
color: white;
}
.closeLandPanelBox{
top: -2px;
cursor: pointer;
color: #fff;
display: inline-block;
width: 45px;
height: 45px;
line-height: 39px;
position: absolute;
left: 81%;
top: 10px;
font-size: 14px;
background-color: rgba(120,70,66,0.2);
opacity: 0.30;
//background: rgba(120,70,66,0.2);
//background: linear-gradient(rgba(120,70,66,1),rgba(255,255,255,0.4));
border: none;
text-align: center;
vertical-align: middle;
-webkit-transition: all 0.1s ease-in-out;
-moz-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
-ms-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out;
}
.closeLandPanelBox:hover{
opacity: 0.85;
background-color: white;
color: black;
}
.infoContainer{
position: absolute;
/* Firefox */
height: -moz-calc(100% - 30px);
/* WebKit */
height: -webkit-calc(100% - 30px);
/* Opera */
height: -o-calc(100% - 30px);
/* Standard */
height: calc(100% - 30px);
//-webkit-perspective-origin: left; /* Chrome, Safari, Opera */
perspective: 1900px;
-webkit-perspective: 1900px; /* Chrome, Safari, Opera */
//perspective-origin: 150% 50%;
z-index: 9999;
}
.infoShowAgain{
position: absolute;
width: 50px;
height: 50px;
left: -75px;
top: -12px;
cursor: pointer;
color: #777;
display: inline-block;
opacity: 0.80;
//background-color: white;
// border: 2px solid white;
text-align: center;
vertical-align: middle;
-webkit-transition: all 0.1s ease-in-out;
-moz-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
-ms-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out;
font-size: 18px;
}
.triangle{
display: inline-block;
margin: auto 0;
position: absolute;
top: 0; left: -8px; bottom: 0; right: 0;
width: 0;
height: 0;
opacity: 0;
border-style: solid;
border-width: 0 0 0 0;
border-color: transparent transparent transparent #ffffff;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
//transform: scale(1.3);
z-index: 9999;
}
.triangle:hover{
left: 0px;
}
.triangleActivated{
opacity: 1.0;
border-width: 55.5px 0 55.5px 85.0px !important;
}
.info{
transform-origin: left;
-webkit-transform: rotateY(90deg); /* Chrome, Safari, Opera */
transform: rotateY(90deg);
opacity: 0;
display: block;
margin: 15px 15px;
text-align: left;
//background-color: rgba(146,96,91,0.5);
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
background: linear-gradient(rgba(160,110,106,0.7),rgba(100,50,46,1));
/* Firefox */
height: -moz-calc(100% - 30px);
/* WebKit */
height: -webkit-calc(100% - 30px);
/* Opera */
height: -o-calc(100% - 30px);
/* Standard */
height: calc(100% - 30px);
/* Firefox */
width: -moz-calc(100% - 100px);
/* WebKit */
width: -webkit-calc(100% - 100px);
/* Opera */
width: -o-calc(100% - 100px);
/* Standard */
width: calc(100% - 100px);
width: 280px;
max-width: 400px;
position: absolute;
z-index: 2000;
border: 2px solid white;
//border-radius: 15px;
}
ul{
list-style-type: square;
}
.moveInfo{
transform-origin: left;
opacity: 1;
-webkit-transform: rotateY(0deg); /* Chrome, Safari, Opera */
transform: rotateY(0deg);
}
.backgroundPanel{
opacity: 0.0;
background: black;
width:100%;
height:100%;
position: absolute;
z-index: 1;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.backgroundPanelWhite{
//opacity: 0.0;
background: white;
width:100%;
height:100%;
position: absolute;
z-index: 2;
background: -webkit-radial-gradient(rgba(255,255,255,1),rgba(255,255,255,1)); /* Safari 5.1 to 6.0 */
background: -o-radial-gradient(rgba(255,255,255,1),rgba(255,255,255,1)); /* For Opera 11.6 to 12.0 */
background: -moz-radial-gradient(rgba(255,255,255,1),rgba(255,255,255,1)); /* For Firefox 3.6 to 15 */
background: radial-gradient(rgba(255,255,255,1),rgba(210,210,210,1)); /* Standard syntax (must be last) */
}
.backgroundPanelActivated{
opacity: 0.4;
}
.infoContent{
overflow-y: scroll;
display: block;
height: 100%;
//background: linear-gradient(rgba(160,110,106,1),rgba(120,70,66,1)) !important;
}
.infoCentered{
width: 0%;
}
.badge {
display: inline-block;
min-width: 10px;
padding: 3px 7px;
font-size: 12px;
font-weight: bold;
line-height: 1;
color: #777 !important;
text-align: center;
white-space: nowrap;
vertical-align: middle;
background-color: #fff !important;
border-radius: 10px;
transform: scale(1);
}
.badge:empty {
display: none;
}
.badgeInvert {
display: inline-block;
min-width: 10px;
padding: 3px 7px;
font-size: 12px;
font-weight: bold;
line-height: 1;
color: #AAA !important;
text-align: center;
white-space: nowrap;
vertical-align: middle;
background-color: rgba(250,250,250,1) !important;
border-radius: 110px;
transform: scale(1);
}
.badgeInvert:empty {
display: none;
}
.info .infoHeadingLine{
height: 2px;
width: 5px;
display: inline-block;
transition-timing-function: ease;
background-color: #fff;
margin-left: 15px;
margin-right: 15px;
right: 15px;
padding-bottom: 5px;
//transform: translate(0px, -30px);
}
.info .infoHeadingLand{
font-size: 14px;
background-color: white;
color: #777;
font-style: italic;
padding: 10px 0px 20px 15px;
margin-bottom: 25px;
}
.info .infoHeadingSponsor{
font-size: 20px;
background-color: white !important;
color: #777;
font-style: italic;
padding: 10px 0px 7px 15px;
opacity:inherit;
filter:inherit;
}
.imgGroupSponsor{
margin-top: 10px;
-webkit-box-shadow: 0px 0px 18px -3px rgba(255,255,255,1);
-moz-box-shadow: 0px 0px 18px -3px rgba(255,255,255,1);
box-shadow: 0px 0px 18px -3px rgba(255,255,255,1);
border-collapse: separate;
background: white !important;
opacity:inherit;
filter:inherit;
padding-bottom: 50px;
}
.info .infoHeadingLineEase{
width: -moz-calc(100% - 30px);
/* WebKit */
width: -webkit-calc(100% - 30px);
/* Opera */
width: -o-calc(100% - 30px);
/* Standard */
width: calc(100% - 30px);
}
.info .infoHeading{
font-size: 24px;
background-color: white;
color: #777;
padding: 35px 15px 0px 15px;
}
.info .infoHeadingCounterContainer{
//background-color: #ddd;
background: linear-gradient(#fff,#eee,#eee,#eee,#eee,#eee,#eee,#eee,#eee,#fff);
//height: 135px;
//padding: 15px;
}
.info .infoHeadingContainer{
-webkit-box-shadow: 0px 0px 18px -3px rgba(255,255,255,1);
-moz-box-shadow: 0px 0px 18px -3px rgba(255,255,255,1);
box-shadow: 0px 0px 18px -3px rgba(255,255,255,1);
}
.info .infoHeadingRow{
font-size: 24px;
padding: 5px 15px 5px 15px;
height: 60px;
width: 100%;
//background-color: #ccc;
}
.info .infoHeadingRowContainer{
padding: 20px 0px 20px 0px;
width: 100%;
}
.info .infoHeadingCounter{
font-size: 20px;
}
.info .infoHeadingCounterGlyph{
width: 35px;
float: left;
}
.info .infoHeadingCounterDirect{
font-size: 20px;
//padding: 10px 15px 5px 15px;
width: 180px;
top: -10px;
text-align: right;
float: left;
}
.info .infoHeadingCounterIndirect{
font-size: 20px;
//padding: 10px 15px 5px 15px;
width: 180px;
top: -10px;
text-align: right;
float: left;
}
.info .infoHeadingCounterLabel{
clear: both;
font-size: 14px;
font-style: italic;
color: #777;
}
.imageText{
font-size: 10px;
background-color: white;
color: #777;
padding: 5px;
margin-bottom: 25px;
}
.p{
padding: 5px 15px;
color: white;
margin-bottom: 15px;
}
.info .p{
padding: 5px 15px;
color: white;
}
ul{
padding: 15px 35px;
color: white;
}
.controls {
height: 77px;
width: 100%;
padding: auto;
text-align: center;
margin: auto;
display: block;
position: relative;
overflow: hidden;
background: rgba(160,110,106,1);
white-space: nowrap;
}
.landRow{
display: block;
position: relative;
float:left;
height: 100%;
width: 100%;
background: rgba(127,95,91,1);
z-index : 10000;
background: linear-gradient(rgba(160,110,106,1),rgba(120,70,66,1));
}
.projectRow{
z-index : 9999;
-webkit-transform: translateX(101%);
-moz-transform: translateX(101%);
-o-transform: translateX(101%);
-ms-transform: translateX(101%);
transform: translateX(101%);
//float:right;
height: 100%;
width: 100%;
background: rgba(160,110,106,1);
-webkit-transition: all 0.40s ease-in-out;
-moz-transition: all 0.40s ease-in-out;
-o-transition: all 0.40s ease-in-out;
-ms-transition: all 0.40s ease-in-out;
transition: all 0.40s ease-in-out;
background: linear-gradient(to right,rgba(160,110,106,1),rgba(120,70,66,1));
}
.moveProjectRow {
-webkit-transform: translateX(0%);
-moz-transform: translateX(0%);
-o-transform: translateX(0%);
-ms-transform: translateX(0%);
transform: translateX(0%);
}
.land{
text-align: center;
float:left;
//margin-left: 3px;
//margin-right: 3px;
}
.landRow_shrinked{
}
.activeLand{
//width:200px;
}
.activeProject{
//width: 40px !important;
}
.1land{
width: 800px;
}
/* Sweep To Top */
.hvr-sweep-to-top {
-webkit-transition: all 0.1s ease-in-out;
-moz-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
-ms-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out;
max-width: 600px;
max-height: 65px;
}
.hvr-sweep-to-top:before {
}
.hvr-sweep-to-top:hover, .hvr-sweep-to-top:focus, .hvr-sweep-to-top:active {
color: black;
background: rgba(207,206,203,1);
}
.hvr-sweep-to-top:hover:before, .hvr-sweep-to-top:focus:before, .hvr-sweep-to-top:active:before {
}
.landProjectAmount{
text-decoration: none !important;
font-size: 8px;
}
.landButtonStyle:hover {
//background-color: rgba(207,206,203,1); // war vorher da!
color: black;
}
.landButtonStyle:active {
background-color: #FFF;
box-shadow: 0 2px #666;
transform: translateY(4px);
}
.landLabel{
font-variant:small-caps;
width: 42px;
height: 68px;
margin: 5px 0px 0px 5px;
/* padding: 24px 0px; */
font-size: 14px;
outline: none;
color: #fff;
background-color: rgba(127,95,91,1);
border: none;
border-radius: 0px;
float: left;
text-align: center;
vertical-align: middle;
background: linear-gradient(rgba(190,140,136,0.5),rgba(64,9,4,0.5));
border: none;
border-radius: 5px;
}
.landButtonStyle {
//text-decoration:underline;
//width: 180px;
font-variant:small-caps;
margin-top: 5px;
margin-left: 5px;
padding: 20px 15px;
font-size: 16px;
box-shadow: 0 5px #FFF;
text-align: center;
cursor: pointer;
outline: none;
color: #fff;
//max-width: 300px;
//display: block;
background-color: rgba(127,95,91,0.5);
background: linear-gradient(rgba(190,140,136,0.5),rgba(64,9,4,0.5));
border: none;
border-radius: 5px;
//box-shadow: 0 0 1px rgba(0, 0, 0, 0);
-moz-box-shadow: inset 0 0 3px rgba(255,255,255,0.2), 0 5px #FFF;
-webkit-box-shadow: inset 0 0 3px rgba(255,255,255,0.2), 0 5px #FFF;
box-shadow: inset 0 0 3px rgba(255,255,255,0.2), 0 5px #FFF;
}
.landButtonContent{
display: inline-block;
}
.landText{
/* -webkit-transform: rotate(270deg); */
/* -moz-transform: rotate(270deg); */
/* -ms-transform: rotate(270deg); */
/* -o-transform: rotate(270deg); */
/* transform: rotate(270deg); */
//display: none !important;
font-size: 26px;
height: 0px;
left: 10px;
vertical-align: middle;
margin-top: 5px;
display: inline-block;
}
.project{
width: 100%;
//text-align: right;
float:left;
//margin-left: 5px;
//margin-right: 3px;
}
.projectButton {
font-variant:small-caps;
vertical-align: middle !important;
margin: auto 5px;
margin-bottom: 10px;
float: left;
padding: 0;
font-size: 14px;
-webkit-box-shadow: 0px 8px 12px -12px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 8px 12px -12px rgba(0,0,0,0.75);
box-shadow: 0px 8px 12px -12px rgba(0,0,0,0.75);
text-align: left;
cursor: pointer;
outline: none;
color: #111;
background: rgba(255,255,255,1);
border: none;
border-radius: 0px;
width: 96%;
height: 55px;
-webkit-transition: all 0.03s ease-in-out;
-moz-transition: all 0.03s ease-in-out;
-o-transition: all 0.03s ease-in-out;
-ms-transition: all 0.03s ease-in-out;
transition: all 0.03s ease-in-out;
overflow: hidden;
border-radius: 5px;
}
.projectButton:hover {
background-color: rgba(220,220,220,1);
color: black;
}
.projectButton:active {
background-color: #FFF;
-webkit-box-shadow: 0px 8px 19px -12px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 8px 19px -12px rgba(0,0,0,0.75);
box-shadow: 0px 8px 19px -12px rgba(0,0,0,0.75);
transform: translateY(4px);
}
.languageButton {
font-variant:small-caps;
margin: auto 5px;
margin-bottom: 5px;
padding: 12px 25px;
font-size: 14px;
-webkit-box-shadow: 0px 8px 12px -12px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 8px 12px -12px rgba(0,0,0,0.75);
box-shadow: 0px 8px 12px -12px rgba(0,0,0,0.75);
//text-align: right;
cursor: pointer;
outline: none;
color: #111;
background: rgba(255,255,255,1);
border: none;
border-radius: 0px;
width: 95%;
-webkit-transition: all 0.10s ease-in-out;
-moz-transition: all 0.10s ease-in-out;
-o-transition: all 0.10s ease-in-out;
-ms-transition: all 0.10s ease-in-out;
transition: all 0.10s ease-in-out;
}
.languageButton:hover {
background-color: rgba(220,220,220,1);
color: black;
}
.languageButton:active {
background-color: #FFF;
-webkit-box-shadow: 0px 8px 19px -12px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 8px 19px -12px rgba(0,0,0,0.75);
box-shadow: 0px 8px 19px -12px rgba(0,0,0,0.75);
transform: translateY(4px);
}
.landButtonPanel {
font-variant:small-caps;
margin: auto 5px;
margin-bottom: 5px;
padding: 12px 25px;
font-size: 14px;
-webkit-box-shadow: 0px 8px 12px -12px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 8px 12px -12px rgba(0,0,0,0.75);
box-shadow: 0px 8px 12px -12px rgba(0,0,0,0.75);
//text-align: right;
cursor: pointer;
outline: none;
color: #111;
background: rgba(255,255,255,1);
border: none;
border-radius: 0px;
width: 95% !important;
-webkit-transition: all 0.03s ease-in-out;
-moz-transition: all 0.03s ease-in-out;
-o-transition: all 0.03s ease-in-out;
-ms-transition: all 0.03s ease-in-out;
transition: all 0.03s ease-in-out;
}
.landButtonPanel:hover {
background-color: rgba(220,220,220,1);
color: black;
}
.landButtonPanel:active {
background-color: #FFF;
-webkit-box-shadow: 0px 8px 19px -12px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 8px 19px -12px rgba(0,0,0,0.75);
box-shadow: 0px 8px 19px -12px rgba(0,0,0,0.75);
transform: translateY(4px);
}
.selected{
background-color: #FFF;
}
.swapper{
background-color: #F0F0F0;
}
.waitingPanel{
//background: black;
height: 100%;
width: 100%;
}
.sk-cube-grid {
width: 40px;
height: 40px;
margin: 50px auto;
}
.sk-cube-language-grid {
width: 22px !important;
height: 22px !important;
margin: 0 !important;
}
.sk-cube-grid .sk-cube {
width: 33%;
height: 33%;
background-color: #fff;
float: left;
-webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
-webkit-transform: scale3D(0.1, 0.1, 1);
transform: scale3D(0.1, 0.1, 1);
opacity: 0;
}
.sk-cube-grid .sk-cube1 {
-webkit-animation-delay: 0.2s;
animation-delay: 0.2s; }
.sk-cube-grid .sk-cube2 {
-webkit-animation-delay: 0.3s;
animation-delay: 0.3s; }
.sk-cube-grid .sk-cube3 {
-webkit-animation-delay: 0.4s;
animation-delay: 0.4s; }
.sk-cube-grid .sk-cube4 {
-webkit-animation-delay: 0.1s;
animation-delay: 0.1s; }
.sk-cube-grid .sk-cube5 {
-webkit-animation-delay: 0.2s;
animation-delay: 0.2s; }
.sk-cube-grid .sk-cube6 {
-webkit-animation-delay: 0.3s;
animation-delay: 0.3s; }
.sk-cube-grid .sk-cube7 {
-webkit-animation-delay: 0s;
animation-delay: 0s; }
.sk-cube-grid .sk-cube8 {
-webkit-animation-delay: 0.1s;
animation-delay: 0.1s; }
.sk-cube-grid .sk-cube9 {
-webkit-animation-delay: 0.2s;
animation-delay: 0.2s; }
@-webkit-keyframes sk-cubeGridScaleDelay {
0%, 70%, 100% {
-webkit-transform: scale3D(1, 1, 1);
transform: scale3D(1, 1, 1);
} 35% {
-webkit-transform: scale3D(0.1, 0.1, 1);
transform: scale3D(0.1, 0.1, 1);
} 80% {
-webkit-transform: scale3D(0.9, 0.9, 1);
transform: scale3D(0.9, 0.9, 1);
}
}
@keyframes sk-cubeGridScaleDelay {
0%, 70%, 100% {
opacity: 1;
-webkit-transform: scale3D(1, 1, 1);
transform: scale3D(1, 1, 1);
} 35% {
opacity: 0.3;
-webkit-transform: scale3D(0.1, 0.1, 1);
transform: scale3D(0.1, 0.1, 1);
} 80% {
opacity: 1;
-webkit-transform: scale3D(0.9, 0.9, 1);
transform: scale3D(0.9, 0.9, 1);
}
}
.waitingText{
text-align: center;
margin: 0 auto;
width: 100%;
-webkit-animation: example 1.3s infinite ease-in-out;
animation: example 1.3s infinite ease-in-out;
}
.waitingTextDarker{
color: #aaa !important;
}
@keyframes example {
0% {transform: translate(0px, 0px);}
50% {transform: translate(0px, 5px);}
0% {transform: translate(0px, 0px);}
}
#markerLayer img{
animation: pulse 0.8s ;
-webkit-animation: pulse 0.8s ;
transform-origin: center;
-webkit-transform-origin: center;
-ms-animation-duration: 0.8s;
-ms-animation-name:pulse;
}
.bounceAnimation{
animation: bounce 0.8s infinite;
-webkit-animation: bounce 0.8s infinite;
transform-origin: center;
-webkit-transform-origin: center;
-ms-animation-duration: 0.8s;
-ms-animation-name: bounce;
}
#markerLayer *{
overflow: visible !important;
}
keyframes bounce{
0% {
-webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0);
transform: translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
}
50% {
-webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0);
transform: translate3d(0, -320%, 0) rotate3d(0, 1, 0, 360deg);
}
100% {
-webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0);
transform: translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
}
}
@-ms-keyframes bounce{
0% {
-webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0);
transform: translate3d(0, 0, 0) rotate3d(0, 1, 0, 360deg);
}
50% {
-webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0);
transform: translate3d(0, -320%, 0) rotate3d(0, 1, 0, 360deg);
}
100% {
-webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0);
transform: translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
}
}
@-webkit-keyframes bounce{
0% {
-webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0);
transform: translate3d(0, 0, 0) rotate3d(0, 1, 0, 360deg);
}
50% {
-webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0);
transform: translate3d(0, -320%, 0) rotate3d(0, 1, 0, 360deg);
}
100% {
-webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0);
transform: translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
}
}
keyframes pulse{
0% {
opacity: 0;
-webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0);
transform: translate3d(0, -320%, 0) rotate3d(0, 1, 0, 420deg);
}
80% {
opacity: 1;
}
100% {
-webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0);
transform: translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
}
}
@-ms-keyframes pulse{
0% {
opacity: 0;
transform: translate3d(0, -680%, 0) rotate3d(0, 1, 0, 420deg);
}
100% {
opacity: 1;
transform: translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
}
}
@-webkit-keyframes pulse{
0% {
opacity: 0;
-webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0);
transform: translate3d(0, -260%, 0) rotate3d(0, 1, 0, 320deg);
}
80% {
opacity: 1;
transform: translate3d(0, 0%, 0) rotate3d(0, 1, 0, 0deg);
}
100% {
-webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 1, 0);
transform: translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
}
}
.languageButtonHeader{
font-size: 8px;
height: 0px;
margin-top: -8px;
}
.languageButtonText{
height: 0px;
padding-top: 8px;
}
.languageButtonContent{
display: inline-block;
height: 0px;
min-width: 100px;
}
.invisible{
display: none !important;
//width: 0px !important;
//height: 0px !important;
}
.projectButtonLeft{
display: inline-block;
/* float: left; */
width:80%;
/* height: 100%; */
vertical-align: middle;
text-align: left;
/* padding: 15px 20px; */
z-index: 2;
top: 50%;
padding-left: 15px;
}
.projectButtonRight{
display: inline-block;
/* float: right; */
width:20%;
height: 100%;
vertical-align: middle;
text-align: center;
background: #eee;
/* padding: 15px 20px; */
z-index: 1;
position: relative;
font-weight: 500;
/* font-style: italic; */
color: #333;
font-size: 12px;
}
.backgroundTransparent{
position: absolute !important;
opacity: 0.2;
color: #999;
top: 21% !important;
left: 5%;
display: inline-block;
/* float: left; */
font-size: 39px;
-ms-transform: rotate(25deg);
-webkit-transform: rotate(25deg);
transform: rotate(25deg);
}
.projectAmountMarkers{
position: absolute;
top: 29%;
/* left: 35%; */
font-size: 15px;
width: 100%;
}