﻿@font-face {
    font-family: 'OpenSans';
    font-style: normal;
    font-weight: 400;
    src: url('fonts/OpenSans-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'CourgetteRegular';
    font-style: normal;
    font-weight: 400;
    src: url('fonts/Courgette-Regular.ttf') format('truetype');
}

@-moz-keyframes spin {
    from {
        -moz-transform: rotate(0deg);
    }

    to {
        -moz-transform: rotate(360deg);
    }
}

@-webkit-keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}


/*.carousel-item {
    transition: transform 2s ease, opacity .5s ease-out;
}*/

/*active.carousel-item-end,
.active.carousel-item-start {
    transition-duration: 250ms;
    transition-delay: 50ms;
}

.carousel-item-next,
.carousel-item-prev {
    transition-duration: 250ms;
    transition-delay: 50ms;
}*/

body, div, p, a, td, th {
    font-family: "OpenSans", Arial, Helvetica, sans-serif;
    color: #57140e;
}

tr {
    border-width: 0px !important;
}

body {
    opacity: 0.0;
    -webkit-transition: opacity linear 0.25s;
    -moz-transition: opacity linear 0.25s;
    -o-transition: opacity linear 0.25s;
    transition: opacity linear 0.25s;
}

nav.fixed-top {
    z-index: 1;
}

body.show {
    opacity: 1.0;
}

h1, h2, h3, h4, h5, h6 {
    /*font-family: "OpenSans";*/
    letter-spacing: 5px;
    color: #57140e;
}

button.btn-primary {
    color: #FFFFFF;
}

footer {
    font-size: 0.55rem !important;
}

h1.title,
.fortunatitle {
    font-family: "CourgetteRegular", Arial, Helvetica, sans-serif;
    margin: 0px;
}

.fortunatitle {
    font-weight: bold;
}

a {
    text-decoration: none;
    color: #57140e !important;
}

a.btn-cafe {
    color: #57140e !important;
    background-color: #f5dbc4;
    border-color: #f5dbc4;
}

a.btn-cafe:hover {
    color: #f5dbc4 !important;
    background-color: #57140e;
    border-color: #57140e;
    text-decoration: none !important;
}

a.nodeco:hover {
    text-decoration: none !important;
}

/*a.navbar-brand {
    color: #57140e !important;
}*/

a:hover {
    text-decoration: underline;
}

section {
    padding-top: 60px;
}

.parallax {
    /* The image used */
    /*background-image: url("img_parallax.jpg");*/
    /* Set a specific height */
    min-height: 300px;
    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

div.headimage * img {
    min-height: 400px;
    max-height: 600px;
    object-fit: cover;
    border-radius: 0px;
}

div.bgdark {
    min-height: 150px;
    background-color: #cda593;
    color: #f5dbc4;
}

div.bgcaffe {
    background-image: url("/wwwroot/img/kaffee-tasse.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

div.bglight {
    min-height: 150px;
    background-color: #f5dbc4;
    color: #671c1a;
}

.tmp {
    background-color: #fea251;
    color: #f1958d;
}

.bold {
    font-weight: bold;
}

div#map {
    min-height:250px;
    height: 100%;
    width: 100%;
    overflow: hidden;
}

input.submitbtn,
a.submitbtn {
    background-color: #57140e;
    color: #f5dbc4 !important;
}
input.submitbtn:hover,
a.submitbtn:hover {
    background-color: #f5dbc4;
    color: #57140e !important;
    text-decoration: none !important;
}

.h200px {
    height: 200px;
}

span.fonticon {
    transition: font-size ease-in 0.05s;
}

a:hover * span.material-icons,
a:hover * span.material-symbols-outlined {
    text-decoration: none;
    font-size: 210px;
    /*font-weight: bold;*/
}

div.bgpopup {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(128, 128, 128, 0.5);
    display: none;
    opacity: 0.0;
    -webkit-transition: opacity 3s ease-in;
    -moz-transition: opacity 3s ease-in;
    -o-transition: opacity 3s ease-in;
    transition: opacity 3s ease-in;
}

div.popup {
    z-index: 999;
    position: fixed;
    top: 61px;
    left: 0px;
    width: 100%;
    height: 100%;
    display: none;
    opacity: 0.0;
    -webkit-transition: opacity 3s ease-in;
    -moz-transition: opacity 3s ease-in;
    -o-transition: opacity 3s ease-in;
    transition: opacity 3s ease-in;
    overflow: hidden;
    padding-bottom: 61px;
}

div.popupmsg {
    background-color: white;
}

div.showpopup {
    display: block;
    opacity: 1.0;
}

div#loginelement,
div.loginerror {
    margin-top: 50px;
}

div.login {
    background-color: #FFFFFF;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    margin-top: 2em;
    padding: 3em;
}

#loginerror * a:hover {
    text-decoration: none;
}

.rotateicon {
    -webkit-animation: spin 2s infinite linear;
    -moz-animation: spin 2s infinite linear;
    animation: spin 2s infinite linear;
    font-size: 12.5em;
    color: #FF0000;
}

span.field-validation-error {
    font-weight: bold;
    color: red;
}

a.angebot:hover * img.iconwidth {
    width: 220px;
}

.iconwidth {
    width: 200px;
    transition: width ease-in 0.09s;
}

.fonticon {
    font-size: 200px;
    width: 100%;
}

input.hiddenaktuellescontent {
    visibility: hidden;
    height: 0px;
}

div.bgpinnednote {
    position: fixed;
    top: 65px;
    right: 0px;
}

div.pinnednote {
    background-image: url('/wwwroot/img/pinnednotecda593.svg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 11em;
    height: 11em;
    color: #57140e;
    font-weight: bold;
}

div.r15 {
    -webkit-transform: rotate(15deg);
    -moz-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
    -o-transform: rotate(15deg);
    transform: rotate(15deg);
}

/*Extra small devices (portrait phones, less than 576px)
No media query for `xs` since this is the default in Bootstrap*/

/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {
    footer {
        font-size: 0.6rem !important;
    }
    .w-sm-80 {
        width: 80%;
    }

    div.pinnednote {
        width: 15em;
        height: 15em;
    }

    div.bgpinnednote {
        top: 100px;
    }
}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
    footer {
        font-size: 0.65rem !important;
    }
    .w-md-100 {
        width: 100%;
    }
}

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
    footer {
        font-size: 0.7rem !important;
    }
}

/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
    footer {
        font-size: 0.75rem !important;
    }
}

