@CHARSET "ISO-8859-1";


/* --------------------- Schriften
*/
@font-face {
    font-family: 'georgia';
    font-display: auto;
    src: local('georgia'), url(../fonts/georgia.ttf) format('truetype');
}

@font-face {
    font-family: 'gill';
    font-display: auto;
    src: local('gill'), url(../fonts/GillSansStd.otf) format('truetype');
}

@font-face {
    font-family: 'gill-light';
    font-display: auto;
    src: local('gill-light'), url(../fonts/GillSansStd-Light.otf) format('truetype');
}

@font-face {
    font-family: 'gill-bold';
    font-display: auto;
    src: local('gill-bold'), url(../fonts/GillSansStd-Bold.otf) format('truetype');
}

@font-face {
    font-family: 'unica';
    font-display: auto;
    src: local('unica'), url(../fonts/UnicaOne-Regular.ttf) format('truetype');
}


/* --------------------- Hintergrundfarben
*/
.bg-alert {
    background-color: #de8110;
}


.bg-bianco {
    background-color: #ffffff;
}


.bg-marroni {
    background-color: #765C4C;
}


.bg-porcini {
    background-color: #f5f5f0;
}


.bg-porcini-transparent {
    background-color: rgba(245, 245, 240, 0.8);
}


.bg-sasso {
    background-color: #3c3c3c;
}


/* --------------------- Schriftfarben
*/
.gray {
    color: #999999;
}


.gray-light {
    color: #cccccc;
}


.green {
    color: #009900;
}


.marroni {
    color: #765C4C;
}


.orange {
    color: #de8110;
}


.red {
    color: #dd0000;
}


.white {
    color: #ffffff;
}


/* --------------------- Rahmen
*/
.border-red {
    border: 4px solid #ff0000;
}

.border-green {
    border: 2px solid #6BB638;
}


/* --------------------- HTML Tags
*/
a.white:link {
    color: #ffffff;
    text-decoration: none;
}

a.white:visited {
    color: #ffffff;
    text-decoration: none;
}

a.white:hover {
    color: #ffffff;
    text-decoration: none;
}

a.white:active {
    color: #ffffff;
    text-decoration: none;
}

body {
    font-family: gill-light, sans-serif;
    font-size: 14pt;
    color: #000000;
    overflow-x: hidden;
}

html, body{
    height: 100%;
}


/* --------------------- Styles
*/
.add-frame {
    position: relative;
    top: 0px;
    left: 0px;
    margin-top: 40px;
    padding-top: 2px;
    overflow: hidden;
}


.add-frame-shadow {
    position: relative;
    top: 0px;
    left: 0px;
    margin-top: 20px;
    overflow: hidden;
    box-shadow: 1px 1px 3px 3px #cccccc;
}


.adds {
    display: -webkit-flex;
    display: -ms-flex;
    display: -moz-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    margin-top: 5%;
    padding-left: 10%;
    padding-right: 10%;
}


.align-right {
    text-align: right;
}


.border {
    border: 1px solid red
}


.borderless  tr td {
    border: none !important;
}


.bold {
    font-weight: bold;
}


/* --------------------- Filter Button
*/
.btn-filter {
    background: rgba(255, 255, 255, 1);
    border-color: rgba(178, 178, 178, 1);
    color: rgba(51, 51, 51, 1);
    font-size: 14px;
    border-radius: 0px;
    border-width: 1px;
    outline: none !important;
    box-shadow: none;
    height: 32px;
    text-align: left;
    overflow: hidden;
}


.btn-filter:hover {
    background: rgba(255, 255, 255, 1);
    border-color: rgba(118, 92, 76, 1);
    color: rgba(51, 51, 51, 1);
}


.btn-filter:active, .btn-filter:focus {
    background: rgba(255, 255, 255, 1);
    border-color: rgba(178, 178, 178, 1);
    color: rgba(51, 51, 51, 1);
}


/* --------------------- Filter Delete Button
*/
.btn-filter-delete {
    background: rgba(255, 255, 255, 1);
    border-color: rgba(178, 178, 178, 1);
    color: rgba(51, 51, 51, 1);
    border-radius: 0px;
    border-width: 1px;
    padding-left: 0px;
    padding-right: 0px;
    outline: none !important;
    box-shadow: none;
    /*width: 32px;*/
    height: 32px;
    text-align: center;
}


.btn-filter-delete:hover {
    background: rgba(255, 255, 255, 1);
    border-color: rgba(118, 92, 76, 1);
    color: rgba(51, 51, 51, 1);
}


.btn-filter-delete:active, .btn-filter:focus {
    background: rgba(255, 255, 255, 1);
    border-color: rgba(178, 178, 178, 1);
    color: rgba(51, 51, 51, 1);
}


.btn-group {
    white-space: nowrap; 
    font-size: 0;
}


.btn-group .btn {
    display: inline-block;
    font-size: 14px;
    float: none;
    clear: none;
}


/* --------------------- Standard Button
*/
.btn-standard {
    background: rgba(118, 92, 76, 1);
    border-color: rgba(178, 178, 178, 1);
    color: rgba(255, 255, 255, 1);
    font-size: 14px;
    border-radius: 0px;
    border-width: 0px;
    outline: none !important;
    box-shadow: none;
    height: 32px;
}


.btn-standard:hover {
    background: rgba(118, 92, 76, 1);
    border-color: rgba(178, 178, 178, 1);
    color: rgba(255, 255, 255, 1);
}


.btn-standard:active, .btn-standard:focus {
    background: rgba(118, 92, 76, 1);
    border-color: rgba(178, 178, 178, 1);
    color: rgba(255, 255, 255, 1);
}


.btn-group-filter {
    width: 100%;
    z-index: 42;
}


.center {
    text-align: center;
}


#cookieFrage {
    position: fixed;
    color: white;
    top: 10px;
    right: -300px;
    width: 300px;
    height: 38%;
    /*border-top: 3px solid white;*/
    padding: 20px;
    z-index: 2000;
    /*visibility: hidden;*/
    -webkit-transition: 0.6s; /* Safari */
    -webkit-transition-timing-function: ease-in-out;
    -webkit-transition-delay: 0.5s;
    transition: 0.6s;
    transition-timing-function: ease-in-out;
    transition-delay: 0.5s;
}


#cookieModal {
    top: 10%;
    width: 300px;
}


.detail-bild {
    width: 100%;
    overflow: hidden;
}


.filter-active {
    border-bottom: solid 3px;
}


.filterbar-field {
    margin-top: 4px;
    margin-bottom: 0px;
    width: 100%;
    color: #000000;
}


.filterbar-field-title {
    margin-top: 4px;
    margin-bottom: 0px;
    color: #000000;
}


.filterbar-input {
    height: 72px;
    z-index: 42;
}


.filterbar-input-optional {
    height: 72px;
    z-index: 42;
}


.framed {
    padding-top: 8px;
    padding-bottom: 8px;
}


#filtermenuicon {
    -webkit-transition: 0.5s ease-in-out;
    -ms-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;  
}


.mouse-pointer {
    cursor: pointer;
}


.overlay {
    position: absolute;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 2000;
    display: none;
}


.overlay-left {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 10%;
    height: 100%;
    z-index: 22;
}


.overlay-middle {
    position: absolute;
    top: 0px;
    left: 10%;
    width: 80%;
    height: 100%;
    z-index: 22;
}


.overlay-right {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 10%;
    height: 100%;
    z-index: 22;
}


.overlay-left img {
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 100%;
}


.overlay-right img {
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 100%;
}


.rabatt-tag {
    position: absolute;
    top: 0px;
    width: 33%;
    height: 20%;
    text-align: center;
    z-index: 30;
}


.rabatt-txt {
    font-family: georgia, sans-serif;
}


.short {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


.teaser-bild {
    position: absolute;
    top: 0px;
}


.teaser-bild-frame {
    height: 0px;
    overflow: hidden;
    padding-top: 75%;
    position: relative;
}


.teaser-love {
    position: absolute;
    top: 10px;
    right: 0px;
    width: 20px;
    z-index: 10;
    -webkit-transition: 0.1s ease-in-out;
    -ms-transition: 0.1s ease-in-out;
    transition: 0.1s ease-in-out;  
}


.teaser-title {
    overflow: hidden;
}


.teaser-text {
    position: relative;
    top: 10px;
    white-space: normal;
}


.text-short {
    overflow: hidden;
    text-overflow: ellipsis;
}