html, body{
margin: 0;
padding: 0;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: none;
}
a:active {
text-decoration: none;
}
ul li::after{
background: #006d8f;
margin-left: .3125rem;
}
ul li::before {
background-color: #00B2E6;
}
ul li::after, ul li::before {
content: "";
position: absolute;
left: .125rem;
top: .0625rem;
height: 1.3125rem;
width: .1875rem;
transform: rotate(25deg) scaleX(.8);
border-radius: .1875rem;
}
ul li {
position: relative;
list-style-type: none;
margin-bottom: 1.5625rem;
padding-left: 2.1875rem;
}
body{
overflow-x:hidden;
font-family:'Lato';
margin:0
}
.sideinfo_klimaBB{
padding:20px;
}
.indicator_klimaBB {
max-width: 300px;
font-weight: 300;
font-family: 'Lato';
color: #454444;
background: #e2eddd;
padding: 20px;
text-align:center;
}
.indicator_main {
font-size: 4rem;
color: #9b9b9b;
font-weight:400;
}
.indicator_header > b {
color:#9b9b9b;
}
.KlimaBBTitleImg{
margin:auto;
line-height:0;
position:relative;
}
.BannerRight {
height: 20rem;
}
.bannerBackground {
width: 100%;
height: 100%;
}
.backgroundStripes{
background: url( ./banner.jpg );
}
.backgroundOrtho{
background: url( ./Layout.jpg );
background-position: center;
background-attachment: fixed;
}
.backgroundMap{
background: url( ./map.jpg );
background-position: center;
}
.backgroundTemp{
height:500px;
background: url( ./temp.png );
width:100%
}
.backgroundDarkblue{
background: #006D8F;
}
.KlimaBBTitleImg img{
width: 100%;
height: 100% !important;
}
.introTextContainer {
position: relative;
margin: auto;
max-width: 1400px;
line-height: 0;
}
.introText {
position: absolute;
display: flex;
line-height: 0 !important;
/*padding: 40px;*/
padding-left: 0;
/* top: 50%; */
font-family: 'Lato';
left: 0;
width: 50%;
bottom: 0;
/* transform: translate(-50%, -50%); */
}
.introText h1 {
z-index: 1;
font-size: 2em;
line-height: 1.5;
}
.introText:after{
content: "";
display: block;
position: absolute;
right: 0;
top:0;
height: 100%;
width: 100vw;
margin-left: -1.5625rem;
background: white;
transform: skew(-15deg);
padding:5px;
}
.afterWithoutPadding:after{
padding:unset !important;
}
.introTextContainer-right {
/* position: relative; */
margin: auto;
max-width: 1400px;
line-height: 0;
}
.introText-right {
position: absolute;
display: flex;
line-height: 0 !important;
/* padding: 40px; */
/* padding-left: 0; */
/* top: 50%; */
padding-right: 200px;
font-family: 'Lato';
right: 0px;
top: 0px;
/* left: 0; */
/* width: 75%; */
/* bottom: 0; */
/* transform: translate(-50%, -50%); */
}
.introText-right:after {
content: "";
right: 0;
top: 0;
width: 80%;
height:100%;
min-width: 70vw;
background:white;
position: absolute;
transform: skew(-10deg);
/* width: 85vw; */
left: -3.75rem;
padding:5px;
}
.introText-right p {
z-index: 1;
font-size:3.1rem;
line-height: 3.1rem;
font-weight: 300;
text-transform: uppercase;
}
.introText p {
z-index: 1;
font-size:3.1rem;
line-height: 3.1rem;
font-weight: 300;
text-transform: uppercase;
}
#introSubtext {
max-width: 1400px;
line-height: 1.2;
padding: 40px;
font-size: 1.5em;
margin: auto;
}
#introSubtext p {
width:800px
}
.Banner{
width: 100%;
height: 300px;
box-shadow: 1px -8px 20px 0px #ffffffb5;
background-image: url(../img/banner.jpg);
z-index: 122;
/* padding: 10px; */
/* margin: 20px; */
position: relative;
}
.Banner-vrs{
margin:auto;
max-width: 1400px;
height: 300px;
box-shadow: 1px -8px 20px 0px #ffffffb5;
background:#006D8F;
z-index: 122;
/* padding: 10px; */
/* margin: 20px; */
position: relative;
}
.BannerKlein{
width: 100%;
height: 20px;
box-shadow: 1px -8px 20px 0px #ffffffb5;
background-image: url(img/banner.jpg);
z-index: 122;
/* padding: 10px; */
/* margin: 20px; */
position: relative;
}
#mask{
width: 100%;
height: 100%;
position: absolute;
z-index: 100000000000;
}
#MenuDiv{
margin:auto;
}
#MenuDiv a{
text-decoration:none;
}
.vrsHeader{
height: 58px;
z-index: 1000;
background-color: #FFFFFF;
top: 0;
position: fixed;
width: 100%;
grid-template-columns: auto auto auto;
box-shadow: 0 6px 6px -3px hsla(0,0%,50.2%,.3);
transition:1s;
}
.vrsHeaderAway{
top:-180px !important;
}
.vrsMainContentUp{
top:0px !important;
height: 100% !important;
}
.vrsInner{
max-width: 1380px;
margin-left:55px;
margin-right:55px;
padding-top:55px;
margin:auto !important;
display:flex;
height:inherit;
}
.vrsLogo{
margin-right: 55px;
margin-top: auto;
margin-bottom: auto;
display:flex;
}
.vrsLogo img{
float:right;
}
h1{
font: normal normal bold 25px/30px Lato;
letter-spacing: 0.4px;
margin:0;
}
h4{
margin-left:10px;
margin-right:10px;
}
h5 {
font-size: 1.2em;
}
.vrs-blue{
color: #00B2E6;
}
.vrs-darkblue{
color:#006D8F;
}
.vrs-lapa{
color:#78AA28;
}
.vrsTabs{
font: normal normal normal 18px/23px Lato;
letter-spacing: 0.29px;
}
.topic_klimaBB{
max-width:1400px;
margin:auto;
font-size:1.2em;
opacity: 1 !important;
box-shadow: none !important;
}
.topic_more {
max-width: 1400px;
margin: auto;
font-size: 1.2em;
opacity: 1 !important;
box-shadow: none !important;
}
.topic-text{
max-width:1400px;
font-size:larger;
margin:0;
margin-left: 10px;
margin-right: 10px;
line-height: 1.5625rem;
}
.klimaBB_link {
color: #00a8e7;
font-style: italic;
}
.vrs-cards{
display:flex;
}
.vrs-card-label{
position:absolute;
bottom:0px;
padding:10px;
display:flex;
width:auto;
}
.vrs-card-label p{
z-index:1;
font-weight: bold;
}
.vrs-card-label:after{
content: "";
display: block;
position: absolute;
height: 100%;
width: 110%;
margin-left: -1.5625rem;
background: white;
transform: skew(-15deg);
bottom:0;
}
.vrs-card{
position:relative;
box-shadow:5px 5px 5px grey;
width:fit-content;
margin:auto;
transition:1s;
line-height:0;
}
.vrs-card:hover{
box-shadow:5px 5px 5px black;
cursor:pointer;
transform: scale(1.1);
}
.vrs-card img {
width:400px;
}
.vrs-padding{
}
.vrs-esriIconBig{
font-size:x-large !important;
}
.vrsTabs{
padding-bottom:5px;
display:flex;
}
.tab-link {
margin-right: 40px;
color: black;
text-decoration: none;
}
.tab-link:hover{
cursor: pointer;
color: #00B2E6;
}
.tab-link-active{
color:#006d8f;
}
.tab-link-active:after{
content: " ";
display: block;
width: 1.5625rem;
position: relative;
left: 50%;
transform: translateX(-50%);
margin-top: .3125rem;
border-bottom: .1875rem solid #00B2E6;
border-radius: .1875rem;
}
.tab-link-active:hover{
color:#006d8f;
}
.handlung_innerDiv > h4 {
margin: 0 !important;
font-size:inherit;
}
.handlung_innerDiv {
overflow-y: overlay;
height: -webkit-fill-available;
position: inherit;
margin-top: 48px;
top: 60px;
}
#logoBB {
margin-left:auto;
margin-right:50px;
margin-top: auto;
margin-bottom: auto;
}
h4 {
font-size: 1.5em;
margin-top: 2em;
}
.split{
display:flex;
}
.split > p{
margin:0;
}