

/**
 * Custom CSS
 *
 * Table of Contents
 * - Basics
 * - MISC
 *
 */
@font-face {
    font-family: "CampaignFont";
    src:         url("https://anmeldung.goldenerkoch.ch/der_goldene_koch_27/assets/font/mulish_normal.ttf") format("truetype"),
                 url("https://anmeldung.goldenerkoch.ch/der_goldene_koch_27/assets/font/mulish_normal.ttf") format('woff');
}

body {
    font-family: CampaignFont, Roboto, serif !important;
}
body {
    font-weight: 300;
    font-size:   12px;
    font-family: 'Frutiger LT W01_55 Roma1475738', Verdana, Serif;
}

@media (min-width: 768px) {
    body {
        font-size: 18px;
    }
}

main,
section {
    overflow: hidden;
}

h1 {
    font-family:    'Frutiger LT W01_75 Black', Verdana, Serif;
    text-transform: uppercase;
    font-size:      3em;
}

h2 {
    font-family:    'Frutiger LT W01_45 Ligh1475730', Verdana, Serif;
    font-size:      3em;
    text-transform: uppercase;
}

h3 {
    font-family: 'Frutiger LT W01_55 Roma1475738', Verdana, Serif;
    font-size:   2em;
}

h4{
    font-family:    'Frutiger LT W01_75 Black', Verdana, Serif;
    font-size:      1em;

}

h6{
    text-transform: uppercase;
    text-decoration: underline;
    color: #b4a06e;
    font-size:      .75em;
}

p {
    font-family: 'Frutiger LT W01_55 Roma1475738', Verdana, Serif;
}

b, strong{
    font-family:    'Frutiger LT W01_75 Black', Verdana, Serif;

}

a {
    color: #6d6458;
}

a:hover {
    color: #403933;
}

.link {
    text-decoration: underline;
    color: #b4a06e;
}



.header {
    padding-top: calc(120px + 30px); /* max-Höhe navigation plus gewünschter Abstand*/
}

.header,
#background,
#bgndVideo {
    min-height: 100vh;
    max-height: 100vh;
    position:   relative;
}

.left-content {
    background-color: #b4a06e;
    padding: 30px 10px 30px 40px;

}

.left-content p {
    max-width: 95%

}

.corner-brand {
    padding-top: 40px;
}

.corner-brand a {
    color: #ffffff;
}


/*muss an Hand des Kontaktes im header deklariert werden.*/
.corner-brand:after {
    position:        absolute;
    content:         " ";
    right:           0px;
    top:             -107px;
    height:          130px;
    width:           130px;
    background:      url("https://anmeldung.goldenerkoch.ch/der_goldene_koch_27/service/Resource?dto={%22resourceId%22:%22731%22,%22name%22:%22namederdatei%22,%22_serviceName%22:%22Resource%22,%22_class%22:%22po2%5C%5Cservice%5C%5Cresource%5C%5Cdto%5C%5CGet%22,%22properties%22:null}&amp;lightboxHack=.jpg&amp;disposition=attachment") no-repeat top right;
    background-size: contain;
}

@media (min-width: 400px) {
    .corner-brand:after {
        right:  0px;
        top:   -117px;
        height: 150px;
        width:  150px;
    }
}

@media (min-width: 768px) {
    .corner-brand {
        padding-right: 134px;
        padding-top:   30px;
    }

    .corner-brand:after {
        top:    -100px;
        right:  -66px;
        height: 200px;
        width:  200px;
    }
}

@media (min-width: 1440px) {
    .corner-brand {
        padding-right: 200px;
    }

    .corner-brand:after {
        top:    -150px;
        right:  -100px;
        height: 300px;
        width:  300px;
    }
}

.flex-bottom {
    display:     flex;
    align-items: flex-end;
    height:      calc(65vh - 120px); /* Minus höhe der Navigation*/
}

@media (min-width: 768px) {
    .flex-bottom {
        height: calc(70vh - 120px); /* Minus höhe der Navigation*/
    }
}

@media (max-height: 500px) {
    .flex-bottom {
        height: calc(75vh - 120px); /* Minus höhe der Navigation*/
    }
}

#intro .col-md-auto {
    background-color: #ffffff;
    color: #282828;
    padding: 30px;
}

.alert {
    border-radius: 0;
    font-family:   'Frutiger LT W01_55 Roma1475738', Verdana, Serif;
    font-size:     1rem;
}
.video-controll{
    width: 3rem;
    text-align: left;
    position: absolute;
    bottom: 1rem;
    right: 1rem;
}
.video-controll .volume{
    font-size: 2.5rem;
    color: #ffffff;
    cursor: pointer;
}

@media (min-width: 1140px) {
    nav.navbar {
        max-height: 120px;
    }
}

nav a{
    font-family:    'Frutiger LT W01_45 Ligh1475730', Verdana, Serif;
    font-size:      1em;
    text-transform: uppercase;
}

nav img {
    max-height: 60px;
    padding:    5px;
}

@media (min-width: 768px) {
    nav img {
        max-height: 120px;
        padding:    5px;
    }
}

nav.noscroll {
}



section {

}

.section-gray1 {
    background-color: #403933;
}

.section-content {
    padding:      3em 0;
    background:   #ffffff;
    min-height:   30vh;
    border-color: #b4a06e;
    border-style: solid;
    border-width: 1em 0px 1em 0;
}

.parallax {
    min-height: 100vh;
}



footer {
 background: #403933;
    color: #ffffff;
    font-family:    'Frutiger LT W01_45 Ligh1475730', Verdana, Serif;
    font-size: 12px;
    text-transform: uppercase;
    padding: 6px 0;
}

footer a{
    color: #ffffff;
    text-decoration: none;
    margin:0 10px;
}

footer a:hover{
    color: #dad6d0;
    text-decoration: none;
}




.fas {
}

.cta-arrow {
    position:         relative;
    display:          flex;
    width:            3rem;
    height:           3rem;
    top:              1.5rem;
    justify-content:  center;
    align-items:      center;
    right:            50%;
    left:             50%;
    margin-left:      -1.5rem;
    background-color: rgba(255, 255, 255, 0.5);
    border:           2px solid #ffffff;
    border-radius:    100%;
    text-align:       center;
    color: #ffffff;
    font-size:        2rem;
}
@media (min-width: 768px) {
    .cta-arrow {

        width:            5rem;
        height:           5rem;
        top:              2.5rem;
        margin-left:      -2.5rem;
        font-size:        3rem;
    }
}

.cta-arrow:hover {
    text-decoration: none;
    animation:       pulse 1s;
    color: #ffffff;
}

.cta-arrow-dark {
    background-color: rgba(72, 72, 72, 0.5);
    border:           2px solid #282828;
}

.cta-arrow-dark .fas {

    color: #282828;
}

.animatet-arrow {
    -webkit-animation: animateArrow 4s 10s infinite;
    animation:         animateArrow 4s 10s infinite;
}

.btn {
    border-radius:                             0 !important;
 transition: all .5s;
    margin:                                    .8rem 0;
    border:                                    none;
}

.btn:hover {
    box-shadow: 0 0 5px #282828;
}

.btn-primary {
    background-color: #403933;
}

.btn-primary:hover,
.btn-primary:disabled{
    background-color: #403933;
}

.btn-gold {
    background-color: #b4a06e;
    color: #ffffff !important;
}
.btn-gold:visited {
    background-color: #b4a06e;
    color: #ffffff !important;
}

.btn-gold:hover {
    background-color: #403933;
}

.btn-secondary {
    background-color: #9e9283;
}

.btn-secondary:hover {
    background-color: #9e9283;
}

.btn-light {
    background-color: #dad6d0;
}

.btn-light:hover {
    background-color: #dad6d0;
    border-color: #dad6d0;
}

.btn:active {
    background-color: #dad6d0 !important;
}


.btn-get-contact:before{
    font-family: FontAwesome;
    content: "\f234";
}

.btn.disabled{
    background: #dad6d0;
    color: #6d6458;
    cursor: not-allowed;
}

@media (min-width: 768px) {
    .btn-get-contact:before{
        font-family: "Frutiger LT W01_55 Roma1475738";
            }
}



.cta-info {
    margin-top:                                                                   -.6rem;
    font-size:                                                                    .8rem;
 text-align: center;
    display:                                                                      block;
    width:                                                                        100%;
}

.pagination.dynatable-pagination-links > li > a, .paginatio.dynatable-pagination-linksn > li > span{
    color: #403933;
    cursor: pointer;
}
.pagination.dynatable-disabled-page > li > a, .paginatio.dynatable-disabled-page > li > span{
    color: #6d6458;
    cursor: not-allowed;
}

.pagination.dynatable-pagination-links > li > a:hover, .paginatio.dynatable-pagination-linksn > li > span:hover{
    color: #9e9283;
}
.pagination.dynatable-pagination-links > .active > a{
    background: #403933;
    cursor: pointer;
}
.pagination.dynatable-pagination-links > .active > a:hover{
    background: #9e9283;
    color: #282828 ;
    cursor: pointer;
}



/* Sternchen bei Label von Pflichtfelder (<label class="required">
   ========================================================================== */
.required:after {
    content: " *";
}

.radio .required:after,
.checkbox .required:after {
    content: "";
}

.has-error {

}

.has-error input,
.has-error select,
.has-error input {
    animation:    error .8s ease;
    border-color: #a94442 !important;
    /*background:   rgba(0, 0, 0, 0.1); !*Error Field Color*!*/
}

.has-error input:focus {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483 !important;
    box-shadow:         inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483 !important;
}


@keyframes error {
    0%, 100% {
        transform: translateX(0);
    }
    10%, 30%, 50%, 70%, 90% {
        transform: translateX(-6px);
    }
    20%, 40%, 60%, 80% {
        transform: translateX(6px);
    }
}

@keyframes errorradio {
    0%, 100% {
        font-size: 1em;
    }
    10%, 30%, 50%, 70%, 90% {
        font-size: 1.5em;;
    }
    20%, 40%, 60%, 80% {
        font-size: 0.5em;;
    }
}

.has-error {
    animation: error 1.8s ease;
}

.has-error label {
    color: #a94442;
}

.has-error .help-block {
    display: none;
}

input.form-control,
select.form-control,
textarea.form-control,
.input-group-addon {
    background-color: #dad6d0;
    border-radius:  0;
    box-shadow:     none;
    border:         none;
    padding-bottom: 3px;
}

input.form-control:focus,
select.form-control:focus,
textarea.form-control:focus,
.input-group-addon {
    background-color: #dad6d0;
    box-shadow:     none;
    border:         solid;
    border-width:   0 0 3px 0;
    border-color: #403933;
    padding-bottom: 0px;
    transition:     all .3s;
}

.input-group-addon {
    font-size: 1rem;
    padding:   6px 0 0 12px;
    color: #403933;
}

select {
    -webkit-appearance:  none;
    -moz-appearance:     none;
    background-position: right 50%;
    background-repeat:   no-repeat;
    background-image:    url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAMCAYAAABSgIzaAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDZFNDEwNjlGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDZFNDEwNkFGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0NkU0MTA2N0Y3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0NkU0MTA2OEY3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PuGsgwQAAAA5SURBVHjaYvz//z8DOYCJgUxAf42MQIzTk0D/M+KzkRGPoQSdykiKJrBGpOhgJFYTWNEIiEeAAAMAzNENEOH+do8AAAAASUVORK5CYII=);
}

select::-ms-expand {
    display: none;
}

input[type="radio"],
input[type="checkbox"] {
    opacity:  0;
    position: absolute;
}

input[type="radio"] + label::before,
input[type="checkbox"] + label::before {
    content:     "\f00c ";
    background: #ffffff;
    font-family: fontawesome;

    width:       1rem;
    height:      1rem;
    margin:      0 1rem 0 0;
    padding:     0.2rem;
    color:       transparent;
    transition:  all .5s;
}

input[type="checkbox"] + label::before {
    border: 1px solid #282828;
}

input[type="radio"]:checked + label::before,
input[type="checkbox"]:checked + label::before {
    content: "\f00c";
    color: #282828;
}

input.read-only {
    color: #6d6458 !important;
    background-color: #dad6d0 !important;
    cursor: not-allowed;
}

input.read-only:focus {
    border:         none;
    padding-bottom: 3px;
}

label {
    margin-bottom: 0;
}

.btn-radio {
    text-align: left;
}

.no-margin-top{
    margin-top: 0;
}

iframe .add-to-basket {
    color: red !important;
}

.in-button-text-field{
    display: inline-block;
    position: relative;
    left: -38px;
    height:      1.5rem;
}

.control-label{
    width: 100%;
}

.readonly-message {
    font-size: 1rem;
}

#form_disclaimer p{
    display: inline;
}


.row-partner {
    margin: 2rem 0;
}

.row-partner ul {
    display: flex;
    justify-content: space-around;
        flex-wrap: wrap;
    padding-inline-start: 0;

}
.row-partner li{
    list-style-type: none;
    display: block;
    text-align: center;
    padding: 0 1rem .75rem 1rem;
}

.row-partner img{
    -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
    opacity: 0.8;
    max-height: 2rem;
    width: auto;
    transition: all .5s;
}
.presenting-partner img{
    max-height: 3rem;
    width: auto;
}
.row-partner a:hover img{
    -webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
    filter: grayscale(0%);
    opacity: 1;
}

.row-top-margin{
    margin-top: 3rem;
}

.col-md-presenting-partner {
    width:         50%;
    padding-right: 15px;
    padding-left:  15px;
}

.col-md-partner {
    width:         33%;
    padding-right: 15px;
    padding-left:  15px;
    margin-bottom: 15px;
}

@media (min-width: 768px) {
    .col-md-partner {
        width: 14.28%;
    }

    .col-md-presenting-partner {
        width: 20%;
    }
}

@media (min-width: 1140px) {
    .col-md-partner {
        padding-right: 30px;
        padding-left:  30px;
    }
}
.no-margin{
    margin-top: 0;
    margin-bottom: 0;
}


/* ==========================================================================
    Tabellen
========================================================================== */

.table-info {
    background-color: #ffffff;
}

.table-info td {
    padding: 1rem 0 1rem 0.25rem;

}
@media (max-width: 768px) {
    #orders .table td, .table th{
        padding: .3rem;
    }
}

#orders{
    margin-top: 2rem;
}
.table-unPaid{
    margin-bottom: 5rem;
}

th {
    background: #b4a06e;
}
.event-infos {
    border: #b4a06e           solid 5px;
 margin-bottom: 20px;
}

.event-info-title {
    background-color: #b4a06e;
    color: #ffffff;
    padding: 10px 30px 5px;
}

.event-infos .row {
    margin:                  1.2rem 2rem;
 display: flex;
    align-items:             center;
}

.infos-icon {
    width: 15%;
}

.infos-label {
    width: 85%;
}

.modal-lg {
    max-width: 1110px;
    width:     100%;
    }

.modal-body,
.modal-header{
    }


/* ==========================================================================
   Cookie Banner
   ========================================================================== */

.cookie-banner {
    z-index: 1000;
    position: fixed;
    bottom: 0;
    left: 0;
        width:100%;
    background:#dad6d0;
    opacity: 0.9;
    -webkit-animation-name: easein; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 0.75s; /* Safari 4.0 - 8.0 */
    animation-name: easein;
    animation-duration: 0.75s;
}


/* Safari 4.0 - 8.0 */
@-webkit-keyframes easein {
    0%   {bottom:-75px;}
    50%   {bottom:-75px;}
    100% {bottom:0px}
}

/* Standard syntax */
@keyframes easein {
    0%   {bottom:-75px;}
    50%   {bottom:-75px;}
    100% {bottom:0px}
}

.cookie-banner .btn-accept{
    margin: 5px 25px;
    padding: 0 12px;
}

.cookie-banner .banner-content{
    padding:5px 25px;
    color:#282828;
    font-size:18px;
    line-height: 1.42857143;
    float: left;
}

.cookie-banner .banner-close{
    display: none;
   color: #9e9283;
    position: absolute;
    cursor: pointer;
    right: 25px;
}
@media (min-width: 1368px) {
    .cookie-banner .banner-close{
        display: inline;
    }
}

/* ==========================================================================
   Ampel
   ========================================================================== */
.ampel {
    position:         relative;
    display:          inline-block;
    width:           1rem;
    height:           1rem;
    left:             3px;
    top:              1px;
    margin-right:     3px;
    border-radius:    50%;
    background-color: transparent;
}

.ampel-green {
    background-color: rgb(127, 194, 65);
}

.ampel-orange {
    background-color: rgb(240, 126, 26);
}

.ampel-red {
    background-color: rgb(240, 58, 58);
}


.p-inlinie-block p{
    display: inline-block;
    pointer-events: all;
}

.map-container {
    height: 70%;
}

@keyframes pulse {
    0%{
        -webkit-transform: scale(1.0);
        -moz-transform:    scale(1.0);
        -ms-transform:     scale(1.0);
        -o-transform:      scale(1.0);
        transform:         scale(1.0);

    }
    50% {
        -webkit-transform: scale(1.2);
        -moz-transform:    scale(1.2);
        -ms-transform:     scale(1.2);
        -o-transform:      scale(1.2);
        transform:         scale(1.2);
    }
    100% {
        -webkit-transform: scale(1.0);
        -moz-transform:    scale(1.0);
        -ms-transform:     scale(1.0);
        -o-transform:      scale(1.0);
        transform:         scale(1.0);
    }
}

@-webkit-keyframes animateArrow {
    80% {
        -webkit-transform: translateY(0px);
        transform:         translateY(0px);
    }
    90% {
        -webkit-transform: translateY(10px);
        transform:         translateY(10px);
    }
    100% {
        -webkit-transform: translateY(0px);
        transform:         translateY(0px);
    }
}

.loader {
    display: none;
    position: fixed;
    top:0;
    right:0;
    bottom:0;
    left:0;
    background-color: rgba(255,255,255,.75);
    z-index: 10000;
    margin: auto;
}

.spinner {
    margin: 45vh auto;
    width: 8vw;
    min-width: 50px;
    height: 10vh;
    text-align: center;
    font-size: 10px;
}

.spinner-change {
    margin: 0 auto;
    width: 8vw;
    min-width: 50px;
    height: 10vh;
    text-align: center;
    font-size: 10px;
}


.spinner > div,
.spinner-change > div {
    background-color: #b4a06e;
    height: 100%;
    width: 1vw;
    min-width: 6px;
    display: inline-block;

    -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
    animation: sk-stretchdelay 1.2s infinite ease-in-out;
}

.spinner .rect2,
.spinner-change .rect2 {
    -webkit-animation-delay: -1.1s;
    animation-delay: -1.1s;
}

.spinner .rect3,
.spinner-change .rect3 {
    -webkit-animation-delay: -1.0s;
    animation-delay: -1.0s;
}

.spinner .rect4,
.spinner-change .rect4 {
    -webkit-animation-delay: -0.9s;
    animation-delay: -0.9s;
}

.spinner .rect5,
.spinner-change .rect5 {
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s;
}

@-webkit-keyframes sk-stretchdelay {
    0%, 40%, 100% { -webkit-transform: scaleY(0.4) }
    20% { -webkit-transform: scaleY(1.0) }
}

@keyframes sk-stretchdelay {
    0%, 40%, 100% {
        transform: scaleY(0.4);
        -webkit-transform: scaleY(0.4);
    }  20% {
           transform: scaleY(1.0);
           -webkit-transform: scaleY(1.0);
       }
}