/*@import url('https://fonts.googleapis.com/css?family=Dancing+Script:400,700|Mali:400,400i,700,700i|Merienda:400,700|Roboto:400,400i,700,700i|Roboto+Slab:400,700');*/

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

@keyframes pFrame {
    0% {
        transform:  translate(0px,0px) perspective(100px)  rotateY(0deg) ;
    }
    100% {
        transform:  translate(400px,0px) perspective(100px)  rotateY(180deg) ;
    }
/*    100% {
        transform:  translate(0px,0px)  perspective(100px) rotateY(0deg) ;
    }*/
}
@keyframes sFrame {
    0% {
        transform:  translate(0px,0px) scale(1.0) )rotateX(0deg);
    }
    50% {
        transform:  translate(400px,0px) scale(0.5) rotateX(180deg);
    }
    100% {
        transform:  translate(0px,0px) scale(1.0) rotateX(0deg);
    }

}

/* @media print _und_ screen */
.kosten {
    color: red;
}
table.center, td.center, th.center {
    margin-left: auto;
    margin-right: auto;   
    border: 4px solid black;
}
.center td, tr {
    font-weight: bold;
    border: 2px solid grey;
    padding: 0px;
}
.center {
    text-align: center;
}
.right {
    text-align: right;
}
.left {
    text-align: left;
}

@media screen, projection {

    html {
        font-family: 'Roboto', sans-serif;
        font-weight: 700;
        margin-left: 20%;
        width: 60%;
        background: none;
        background-color: whitesmoke;
        opacity: 0.9;
    }

    h1 {
        border: 0px solid black;
        text-align: center;
    }
    h1:after {
        content: url("../images/owl-logo.gif");
        display: block;
        margin-left: -100%;
        xanimation: sFrame ease-in-out 3s;
        xanimation-iteration-count: 1;
        xtransform-origin: 50% 50%;
        xanimation-fill-mode: forwards;
    }
    
    .home img {
        display: inline-block;
        width: 20px;
        height: 20px;
        xfill: yellow;
        background-color: whitesmoke;
        position: fixed;
        top: 20px;
        right: 20px;
    }
    .home:hover img {
        xtransform: rotate(180deg) scale(1.5); /* skew(30deg,30deg); */
    }
}
@media screen and (max-width : 800px)  {
    html {
        margin-left: 10%;
        width: 80%;
    }
    h1:after {
        display: none;
    }
    .home:hover img {
        transform: none;
    }
}

@media print {
    body {
        font-family: Corbel, Georgia, "Times New Roman", serif;
        xfont-family: 'Roboto Slab', serif;
        font-size: 12pt;
        xfont-weight: 400;
        background: #fff !important;
        color: #000;
        text-align: justify; /* Blocksatz */
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .home img {
        display: none;
    }

}