/*******************************************/
/* Product-Teaser-List
/*******************************************/

ul.product-teaser-filter {
    float: left;
    width: 100%;
}

ul.product-teaser-filter li {
    width: 25%;
    padding: 0 1px;
}

ul.product-teaser-filter li a {
    width: 100%;
    text-align: center;
    border: 1px solid;
}

ul.product-teaser-filter li a:hover,
ul.product-teaser-filter li.selected a {
    color: #ffffff !important;
}

ul.product-teaser-filter li.kontor a {
    border-color: #f6bf01;
    color: #f6bf01;
}

ul.product-teaser-filter li.kontor a:hover {
    background-color: #f6bf01;
}

ul.product-teaser-filter li.kontor.selected a {
    border-color: #ef8e00;
    background-color: #ef8e00;
}

ul.product-teaser-filter li.project a {
    border-color: #989898;
    color: #989898;
}

ul.product-teaser-filter li.project a:hover {
    background-color: #989898;
}

ul.product-teaser-filter li.project.selected a {
    border-color: #636363;
    background-color: #636363;
}

ul.product-teaser-filter li.private a {
    border-color: #B92766;
    color: #B92766;
}

ul.product-teaser-filter li.private a:hover {
    background-color: #B92766;
}

ul.product-teaser-filter li.private.selected a {
    border-color: #9D2459;
    background-color: #9D2459;
}

ul.product-teaser-filter li.support a {
    border-color: #7041a1;
    color: #7041a1;
}

ul.product-teaser-filter li.support a:hover {
    background-color: #7041a1;
}

ul.product-teaser-filter li.support.selected a {
    border-color: #4f1d83;
    background-color: #4f1d83;
}

.product-teaser-list {
}

.product-teaser-list .product-teaser-list-inner {
    /*display: none;*/
}

.product-teaser-list .info {
    float: left;
    height: 225px;
    overflow: hidden;
    width: 100%;
}

.product-teaser-list h2 {
    font-weight: 600;
    color: black;
    font-size: 24px;
    line-height: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

.product-teaser-list h2 a {
    color: black;
}

.product-teaser-list h2.icon {
    padding-left: 80px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left center;
}

.product-teaser-list h2 em {
    font-weight: 600;
    display: block;
    color: #f6bf01;
    line-height: 100%;
}

.product-teaser-list h2.kontor em,
.product-teaser-list h3.kontor span {
    color: #f6bf01;
}

.product-teaser-list h2.project em,
.product-teaser-list h3.project span {
    color: #989898;
}

.product-teaser-list h2.private em,
.product-teaser-list h3.private span {
    color: #B92766;
}

.product-teaser-list h2.support em,
.product-teaser-list h3.support span {
    color: #7041a1;
}

.product-teaser-list .category-teaser {
    padding-bottom: 0;
}

.product-teaser-list .category-teaser h3 {
    font-size: 19px;
    font-weight: 600;
    cursor: pointer;
    line-height: 170%;
}

.product-teaser-list .category-teaser .refresh-container {
    position: relative;
    min-height: 0;
    display: none;
    overflow: hidden;
}

.product-teaser-list .category-teaser i.glyphicons-minus {
    display: none;
}

.product-teaser-list .category-teaser .double * {
    color: #ffffff !important;
}

a.update {
    display: block;
    float: left;
    padding: 5px 16px;
    line-height: 140%;
    border-radius: 20px;
    font-weight: 600;
    font-size: 14px;
    transition: background-color 0.25s linear 0s;
    clear-after: both;
    margin-bottom: 20px;
}

ul.button-group.kontor li a {
    background-color: #f6bf01;
}

.button-kontor {
    color: #f6bf01;
    background-color: #ffffff;
}

a.button.kontor {
    background-color: #f6bf01;
    color: #ffffff;
}
a.button.kontor:hover {
    background-color: #f6bf01;
    color: #ffffff;
}

ul.button-group.kontor li a:hover {
    background-color: #ef8e00;
}

ul.button-group.kontor li.selected a {
    background-color: #ef8e00;
}

ul.button-group.project li a {
    background-color: #989898;
}

ul.button-group.project li a:hover {
    background-color: #636363;
}

ul.button-group.project li.selected a {
    background-color: #636363;
}

.button-project {
    color: #989898;
    background-color: #ffffff;
}

a.button.project {
    background-color: #989898;
    color: #ffffff;
}
a.button.project:hover {
    background-color: #989898;
    color: #ffffff;
}

ul.button-group.private li a {
    background-color: #b92766;
}

ul.button-group.private li a:hover {
    background-color: #9D2459;
}

ul.button-group.private li.selected a {
    background-color: #9D2459;
}

.button-private {
    color: #b92766;
    background-color: #ffffff;
}

a.button.private {
    background-color: #b92766;
    color: #ffffff;
}
a.button.private:hover {
    background-color: #b92766;
    color: #ffffff;
}

 ul.button-group.support li a {
    background-color: #7041a1;
}

ul.button-group.support li a:hover {
    background-color: #7041a1;
}

ul.button-group.support li.selected a {
    background-color: #4f1d83;
}
.button-support {
    color: #7041a1;
    background-color: #ffffff;
}
/*a.button.support {
    background-color: #7041a1;
    color: #ffffff;
}*/
a.button.support:hover {
    background-color: #7041a1;
    color: #ffffff;
}


/*******************************************/
/* Product
/*******************************************/

section.divider{
    padding-bottom: 0;
    margin-bottom: 2em;
}

section.kontor.category-teaser,
section.product_more_information.kontor {
    margin-bottom: 0;
}

section.divider.system,
section.product_more_information {
    margin-bottom: 0;
}

section.kontor,
.order-box.kontor a {
    background-color: #f6bf01;
}

.order-box.kontor a:hover {
    background-color: #ef8e00;
}

.order-box.kontor > span {
    border-color: #f6bf01;
}

section.project,
.order-box.project a {
    background-color: #989898;
}

.order-box.project a:hover {
    background-color: #636363;
}

.order-box.project > span {
    border-color: #989898;
}

section.private,
.order-box.private a {
    background-color: #B92766;
}

.order-box.private a:hover {
    background-color: #9D2459;
}

.order-box.private > span {
    border-color: #B92766;
}

section.support,
.order-box.support a {
    background-color: #7041a1;
}

.order-box.support a:hover {
    background-color: #7041a1;
}

.order-box.support > span {
    border-color: #7041a1;
}

section.product_tab-list {
    border-top: 1px dotted rgba(87, 87, 87, 0.5);
}

section.collapsible {
    padding-top: 0;
    border-top: 1px dotted rgba(87, 87, 87, 0.5);
}


section.collapsible h2 {
    padding-right: 45px;
}

section.collapsible div.full h2 {
    cursor: pointer;
}

section.collapsible div.content:after {
    content: "\f106";
    display: block;
    position: absolute;
    right: 20px;
    top: 20px;
    font-family: 'Font Awesome 5 Pro';
    font-size: 28px;
    pointer-events: none;
}

section.collapsible.collapsed .collapsible_body {
    display: none;
}

section.collapsible.collapsed {
    padding-bottom: 0;
}

section.collapsible.collapsed div.content:after {
    content: "\f107";
}

section.product_more_information .triplet {
    margin-bottom: 0;
}

section.product_more_information .double {
    margin-bottom: 0;
}

section.product_more_information .full {
    margin-bottom: 0;
}

span.product-price {
    display: inline-block;
    font-weight: 400;
    text-align: right;
    width: 100%;
}

.order-box {
    float: left;
    min-width: 50%;
}

.order-box > span {
    float: left;
    clear: both;
    width: 100%;
    margin-top: 1px;
    margin-bottom: 1px;
    padding: 4px 16px;
    border-radius: 0;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    font-weight: 600;
    border: 1px solid;
    transition: background-color 0.25s linear;
    text-align: center;
}

.order-box a {
    float: left;
    clear: both;
    width: 100%;
    color: #ffffff;
    padding: 5px 20px;
    text-align: center;
    font-weight: 600;
    width: 100%;
    border-radius: 0;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    transition: background-color 0.25s linear;
    font-size: 16px;
}

span.price_VAT {
    float: left;
}

.social_toolbar {
    position: absolute;
    right: 0;
    top: -53px;
}

.social_toolbar div {
    margin-top: 7px;
    float:right;
}

section.product_tab-list .list {
    float: left;
    width: 100%;
    margin-top: 30px;
}

section.product_tab-list .list .item {
    display: none;
    float: left;
    width: 100%;
}

section.product_tab-list .list .item:first-child {
    display: block;
}

/*******************************************/
/* Gallery
/*******************************************/

a.gallery-image img,
a.gallery-thumbs {
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    box-shadow: 0 0 1px #333333;
    border-radius: 10px;
    overflow: hidden;
}

a.gallery-image img,
a.gallery-thumbs img {
    width: 100%;
}

a.gallery-thumbs {
    display: block;
    float: left;
    width: 47%;
    margin: 1.5%;
    height: 93px;
}

.video_container {
    display: none;
}

/*******************************************/
/* News List
/*******************************************/

.news-list .row {
    border-bottom: 1px dotted rgba(87, 87, 87, 0.5);
    margin-bottom: 15px;
    padding-bottom: 15px;
}

.news-list time {
    font-size: 0.8em;
    font-weight: 400;
    margin-bottom: 0;
}

.news-list h2 {
    padding-top: 3px;
    padding-bottom: 5px;
}

.news-list h2 a {
    color: #575757;
}

/***************************************
	FaQ List
****************************************/

#faq-list {
    float: left;
    margin-top: 30px;
}

#faq-list .item {
    float: left;
    width: 96%;
    border-bottom: 1px dotted #f6bf01;
    border-bottom: 1px dotted rgba(87, 87, 87, 0.5);;
    margin-bottom: 10px;
}

#faq-list .item .question {
    font-weight: 600;
    cursor: pointer;
}

#faq-list .item .answer {
    display: none;
    font-style: italic;
    margin-bottom: 10px;
    font-weight: 300;
}

#faq-list span.no_result {
    float: left;
    font-weight: 400;
}

button.support_request {
    background-color: #ef8e00;
    border-radius: 20px;
    border: none;
    color: white;
    display: block;
    float: left;
    clear: both;
    font-weight: 600;
    padding: 5px 10px;
    transition: background-color 0.25s linear 0s;
    font-size: 14px;
    cursor: pointer;
    margin-top: 20px;
}


/***************************************
    Download Registration Form
****************************************/

a.button {
    display: block;
    float: left;
    padding: 5px 16px;
    line-height: 140%;
    background-color: rgba(87, 87, 87, 0.5);
    border-radius: 20px;
    color: white;
    font-weight: 600;
    font-size: 14px;
    transition: background-color 0.25s linear 0s;
}

a.button:hover {
    background-color: #ef8e00;
}


/***************************************
    Download List
****************************************/

.download-group {
    float: left;
    width: 100%;
}

.download-group .item {
    float: left;
    width: 100%;
    padding-top: 5px;
    margin-top: 5px;
    padding-bottom: 5px;
    margin-bottom: 5px;
    min-height: 84px;
}

.download-group .icons {
    float: left;
    margin-top: 5px;
    padding-right: 10px;
}

.download-group .icons img {
    float: left;
    clear: both;
    margin-bottom: 10px;
    width: 65px;
}

.download-group .item .text {
    float: left;
    width: 600px;
    padding-right: 35px;
}

.download-group .item .attachment-list {
    float: left;
    width: 245px;
}

.download-group .item .attachment {
    float: left;
    margin-bottom: 10px;
}

.download-group .item .attachment .system {
    float: left;
    width: 80px;
    text-align: center;
    min-height: 20px;
}

.download-group .item .attachment .system span {
    font-size: 32px;
    color: rgba(87, 87, 87, 0.5);
}

.download-group .item .attachment .version {
    float: left;
    width: 80px;
}

.download-group .item .attachment .link {
    float: right;
    width: 80px;
    text-align: center;
}

.download-group .item .attachment .link a {
    font-weight: bold;
    color: black;
}


/***************************************
    Consulting List
****************************************/

div#map_canvas {
    float: left;
    width: 100%;
    height: 550px;
}

/***************************************
    Consulting List
****************************************/

#faq-list-filter {
    float: left;
    width: 100%;
    margin: 0 -2%;
}

#faq-list-filter > div {
    float: left;
    width: 29.33%;
    margin: 0 2%;
}

#faq-list-filter span {
    float: left;
    margin-bottom: 5px;
    margin-right: 10px;
    margin-left: 18px;
    font-size: 18px;
    font-weight: 400;
}

#faq-list-filter .select-wrapper {
    float: left;
    clear: both;
    position: relative;
    width: 100%;
    padding: 0 15px;
}

#faq-list-filter .select-wrapper:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 15px;
    height: 100%;
    border-bottom-left-radius: 20px;
    border-top-left-radius: 20px;
    background-color: rgba(87, 87, 87, 0.5);
}

#faq-list-filter .select-wrapper:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 15px;
    height: 100%;
    border-bottom-right-radius: 20px;
    border-top-right-radius: 20px;
    background-color: rgba(87, 87, 87, 0.5);
}

#faq-list-filter .select-wrapper select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    border-radius: 0;
    font-size: 1em;
    background-color: rgba(87, 87, 87, 0.5);
    font-weight: 600;
    color: white;
    padding: 5px 0;
    font-size: 14px;
    overflow: visible;
    width: 100%;
    height: 100%;
}

.success_request {
    border-top: 1px solid rgba(87, 87, 87, 0.5);
    font-weight: 400;
    padding-top: 10px;
    margin-top: 10px;
}

iframe#ticket_frame {
    display: none;
    width: 0;
    height: 0;
}

form.grid {
    display: flex;
    flex-direction: row;
    flex-basis: auto;
    flex-wrap: wrap;
    width: calc(100% + 20px);
    margin-left: -20px;
}

form.grid .item {
    width: calc(100% - 20px);
    margin: 15px 0 15px 20px;
}

form.grid .item.third {
    width: calc(33.33% - 20px);
    margin: 15px 0 15px 20px;
}

form.grid .item.half {
    width: calc(50% - 20px);
    margin-left: 20px;
}

.support.download span {
    display: block;
}

