/* roboto-condensed-300 - latin */
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 300;
  src: url('./fonts/roboto-condensed-v25-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/roboto-condensed-v25-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/roboto-condensed-v25-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/roboto-condensed-v25-latin-300.woff') format('woff'), /* Modern Browsers */
       url('./fonts/roboto-condensed-v25-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/roboto-condensed-v25-latin-300.svg#RobotoCondensed') format('svg'); /* Legacy iOS */
}
/* roboto-condensed-regular - latin */
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/roboto-condensed-v25-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/roboto-condensed-v25-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/roboto-condensed-v25-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/roboto-condensed-v25-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('./fonts/roboto-condensed-v25-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/roboto-condensed-v25-latin-regular.svg#RobotoCondensed') format('svg'); /* Legacy iOS */
}
/* roboto-condensed-700 - latin */
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 700;
  src: url('./fonts/roboto-condensed-v25-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/roboto-condensed-v25-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/roboto-condensed-v25-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/roboto-condensed-v25-latin-700.woff') format('woff'), /* Modern Browsers */
       url('./fonts/roboto-condensed-v25-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/roboto-condensed-v25-latin-700.svg#RobotoCondensed') format('svg'); /* Legacy iOS */
}

html, body, container, img, h1, h2, h3, p{margin: 0;padding: 0;}
html, body{height: auto;min-height: 100%;}
body{background-color: #f2f3f4;font-family: 'Roboto Condensed';}

html{font-size: 1.5em}

h1{font-size: 1.5em; margin-bottom: 0.5em; color: #00254c;font-weight: 400;}
h2{font-size: 1.2em; margin-bottom: 0.25em;color: #00254c;font-weight: 400;}
h3{font-size: 1em; margin-bottom: 0.25em;font-weight: 400;}
p, ul, li{font-size: 0.8em; margin-bottom: 0.5em;font-weight: 300;}

container{
                 display: block;margin: 2em auto;
                 width: 90%;
                 max-width: 90vw;
                 min-height: 95vh;
                 height: auto;
                 /*padding: 1em;*/
                 /*border: 1px solid #000;*/
                 display: grid;
                 gap: 1em;
                 grid-template-columns: 1fr 1fr 1fr;
                 grid-template-rows: auto 12em 1fr 2em;
                 align-content: start;
                 justify-content: center;
                 }

logo{grid-column: 1/2 ;grid-row: 1/2 ;}
navi{grid-column: 2/4 ;grid-row: 1/2 ;}
kali{grid-column: 1/2 ;grid-row: 2/3 ;color: #fff; padding: 0.25em;overflow: hidden;}
tibi{grid-column: 2/4 ;grid-row: 2/3 ;overflow: hidden;}
section1{grid-column: 1/2 ;grid-row: 3/4 ;padding: 0.25em;}
section2{grid-column: 2/4 ;grid-row: 3/4 ;padding: 0.25em;}
section2a{grid-column: 2/4 ;grid-row: 3/4 ;padding: 0.25em;background-color: #fff;}
section3{grid-column: 2/4 ;grid-row: 3/4 ;padding: 0.25em;background-color: #fff;}
footer{grid-column: 1/2 ;grid-row: 4/5 ;}
fnavi{grid-column: 2/4 ;grid-row: 4/5 ;}

.hg80{background-color: #335170;}
.hg80 img{display: block; width: 100%;}
.hg60{background-color: #667c94;}
.hg60 img{display: block; width: 100%;}
.hg60 a{color: #ee7202;}
.hg40{background-color: #99a8b7;}
.hg40 img{display: block; width: 100%;}
.hg40 a{text-decoration: none; color: #fff;font-weight: 400; }

.bewerbung h1{font-size: 1.8em;}
.bewerbung a, section2 a{text-decoration: none; font-weight: 400; }
.bewerbung{ font-size: 1em; }

.t2sp{
    column-count: 2;
    column-gap: 20px;
}

logo     {
         background-image: url('images/v-bus-logo-gross.png');
         background-repeat: no-repeat;
         background-size: 100% auto ;background-size: contain; /*overflow: hidden;*/}

logo img{display: inline-block; width: 6em;}

navi     {
         text-align: right;vertical-align: middle;
         padding-right: 0.6em;
         }

navi a   {
        display: inline-block;
        font-size: 1.2em;
        font-weight: 400;
        margin-left: 1em;
        padding-top: 0.6em;
        padding-bottom: 0.6em;
        text-decoration: none;
        color: #00254c;
        }

navi a:hover{
        color: #ee7202;
        }

kali h2{color: #fff;}

kali{

         background-repeat: no-repeat;
         background-size: 100% auto ;background-size: cover; /*overflow: hidden;*/}

tibi{
         background-repeat: no-repeat;
         background-size: 100% auto;
         background-size: cover;
         background-position: center;
         overflow: hidden;
         }

footer{
         padding: 0.2em;
         font-size: 0.6em;
        font-weight: 100;
         text-align: left;}


fnavi{
         padding: 0.2em;
         font-size: 0.6em;
        font-weight: 100;
         text-align: right;
         vertical-align: middle;
         padding-right: 0.6em;}

fnavi a{
         text-decoration: none;
         padding: 10px;}

@media only screen
and (min-device-width : 1000px)
and (max-device-width : 1199px)
/*and (orientation : landscape)*/
{
html{font-size: 1.2em}
}

@media only screen
and (min-device-width : 800px)
and (max-device-width : 999px)
/*and (orientation : landscape)*/
{
html{font-size: 1em}
}

@media only screen
and (min-device-width : 500px)
and (max-device-width : 799px)
/*and (orientation : landscape)*/
{
html{font-size: 0.7em}
}

@media only screen
and (max-device-width : 499px)
and (orientation : portrait)
{
html{font-size: 0.8em}
container{
         grid-template-columns: 1fr 1fr;
         grid-template-rows: auto 12em 1fr auto 1em;
         }
logo{grid-column: 1/2 ;grid-row: 1/2 ;}
navi{grid-column: 2/3 ;grid-row: 1/2 ;}
kali{display: none;}
tibi{grid-column: 1/3 ;grid-row: 2/3 ;overflow: hidden;}
section1{grid-column: 1/3 ;grid-row: 4/5 ;padding: 0.25em;}
section2{grid-column: 1/3 ;grid-row: 3/4 ;padding: 0.25em;}
section2a{grid-column: 1/3 ;grid-row: 3/4 ;padding: 0.25em;}
section3{grid-column: 1/3 ;grid-row: 3/4 ;padding: 0.25em;}
footer{grid-column: 1/3 ;grid-row: 5/6 ;}
fnavi{grid-column: 1/3 ;grid-row: 5/6 ;}
}

@keyframes flybirds {
        0% {
                opacity: 1;
                 transform: scale(1);
        }

        20% {
                opacity: 1;
                 transform: scale(2);
        }
        100% {
                         opacity: 1;
                         transform: scale(1);
        }
}

section2a{animation: flybirds 5s ease 0s 1 normal forwards;}