.mod-list.row > [class*="col"]{
    padding-left:15px;
    padding-right:15px;
}

/*Custom Fields-Liste ausblenden*/
.fields-container {
    display:none;
}
.page-header {
    padding-bottom:1em;
}

.item-image.right,
.item-image.left {
    float:none;
}

/* Home  Slider Start */
.slick-dots {
    width:85%;
    bottom: -35px!important;
}
.slick-dots li button::before {
    border-radius:50%;
    width:15px;
    height:15px;
    opacity:1;
 }
 .slick-dots li.slick-active button::before{
   opacity:1;
 }

.slick-dots li button::before {
    content:"";
    background-color:#ccc;
}

.logo-homeslider {
    position:absolute;

    right:-1%;
    top:calc(50px + 45vw);
    width:50%;
    z-index:100;
    pointer-events:none;


}

@keyframes slideInFromRight {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(0);
    }
}

li .logo-homeslider {
    opacity:0;
}
li.slick-active .logo-homeslider {
    opacity:1; 
    animation: 0.5s ease-out 0s 1 slideInFromRight;
}

.homeslider img.mainimage {
   width:100%;
    aspect-ratio:3/2.2;
    object-fit: cover;
}
@media (min-width: 992px) {
    .homeslider img.mainimage {
        aspect-ratio:3/1.9;
    }
}
@media (min-width: 1600px) {
    .homeslider img.mainimage {
        aspect-ratio:3/2.2;
    }
}
.homeslider .textbox {
    left:0;
    width:85vw;
    position:relative;
    z-index:100;
    margin-right:15vw;
    top:9px;
    padding:20px;
    text-align:center;
    display:none;
 }
 /* Homeslider fix gegen flackern am Anfang */
 .homeslider .slick-slide .textbox {
    display:block;
 }
 .homeslider ul.slickslider > li + li {
     display:none;
 }
 .homeslider ul.slickslider > li + li.slick-slide {
    display:block;
 }


 .homeslider li.slick-active .textbox {
    animation: 0.5s ease-out 0s 1 slideInFromLeft;
    -webkit-animation: 0.5s ease-out 0s 1 slideInFromLeft;
}
@keyframes slideInFromLeft {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(0);
    }
}
@-webkit-keyframes slideInFromLeft {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(0);
    }
}

@keyframes fadeinframes{
    0%{opacity:0}
    80%{opacity:0}
    100%{opacity:1}
}
@-webkit-keyframes fadeinframes{
    0%{opacity:0}
    80%{opacity:0}
    100%{opacity:1}
}

@-webkit-keyframes fadeinframes{
    0%{opacity:0}
    80%{opacity:0}
    100%{opacity:1}
}
.homeslider li.slick-active .textbox h2 {
    font-size:2.3rem;
    line-height:1.2em;
    font-weight:300;
    border-bottom:1px solid #414666;
    margin-bottom:20px;
    padding-bottom:15px;
    animation:1s ease 0s normal forwards 1 fadeinframes;
    -webkit-animation:1s ease 0s normal forwards 1 fadeinframes;
    opacity:1
}
.homeslider li.slick-active .textbox .introtext  {
    font-size:1.3rem;
    line-height:1.6em;
    font-weight:300;
    font-style: italic;
    margin-bottom:25px;
    animation:1.1s ease 0s normal forwards 1 fadeinframes;
    -webkit-animation:1.1s ease 0s normal forwards 1 fadeinframes;
    opacity:1
}
.homeslider .slick-slider,
.homeslider .slick-list,
.homeslider .slick-track,
.homeslider .slick-slide  {
    padding-left:0;
    padding-right:0;
    margin-left:0;
    margin-right:0;
}
.homeslider ul.slick-slider.row{
    margin-left:0;
    margin-right:0;
}
.homeslider .slick-list {
    overflow-y:visible;
    overflow-x:clip;
}
.homeslider ul.slick-track {
    transform:none!important;
}
.homeslider .slick-list li.slick-slide{
    position:relative;
    overflow-x:clip;
}




 /*
.homeslider .slick-list li.slick-slide:after{
    content: "";
    display: block;
    width: 800px;
    height: 800px;
    position: absolute;
    left: 200px;
    background-color: red;
    top: -50px;
    z-index: 0;
}
*/

/* Home  Slider End */

/* Custom Fields */
.gallerywrapper  {
    padding-top:50px;
    clear:both;
}
.downloaddateienwrapper {
    margin-top:70px;
    margin-bottom:50px;
    clear:both;
    border-top-style:solid;
    border-bottom-style:solid;
    border-width:1px;
    border-color:var(--font-color);
    padding:10px 0;
}
.downloaddateienwrapper div.downloadlink {
   display:block;
}

.downloaddateienwrapper a {
    display:block;
    padding:10px 0;
    line-height:35px;
    margin:5px 0;
    color:var(--font-color);
}
.downloaddateienwrapper a:hover {
    color:var(--primary-color);
}

.downloaddateienwrapper a .icon  {
    display:inline-block;
    width:35px;
    height:35px;
    margin-right:15px;
    color: var(--primary-color-contrast);
    background-color:var(--font-color);
    border-radius:50%;
    text-align:center;
}
.downloaddateienwrapper a:hover {
    color:var(--primary-color);
}
.downloaddateienwrapper a:hover .icon {
    transform: scale(1.25);
    background-color:var(--primary-color);
}
.videodiv {
    margin:40px 0;
}
.videodiv .tf-video-embed-wrapper {
    aspect-ratio: 16/9;
}

table {
  border-top:1px solid #f2f2f2;
}

table tr {
    border-bottom:1px solid #f2f2f2;
}
table tr td {
    padding:7px 5px 7px 0;
}


a.weiter {
    padding:10px 20px 10px 20px;
    border-radius:6px;
    display:inline-block;
    text-transform:uppercase;
}

.homeslider li.slick-active a.weiter {
    animation:1.2s ease 0s normal forwards 1 fadeinframes;
    -webkit-animation:1.2s ease 0s normal forwards 1 fadeinframes;
    opacity:1
}


a.weiter:after {
    content:"";
    background-image:url('/templates/tomppa/images/arrow-right-white.svg');
    background-size:contain;
    background-size:100% auto;
    background-position:center;
    background-repeat:no-repeat;
    display:block;
    float:right;
    width:30px;
    height:1.4em;
    margin-left:30px;
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}
a.weiter:hover:after{
    transform: translateX(10px);
}


a.weiterlight {
    padding:0 20px 10px 0;
    border-radius:6px;
    display:inline-block;
    text-transform:uppercase;
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}
a.weiterlight:after {
    content:"";
    background-image:url('/templates/tomppa/images/arrow-right-blue.svg');
    background-size:contain;
    background-size:100% auto;
    background-position:center;
    background-repeat:no-repeat;
    display:block;
    float:right;
    width:30px;
    height:1.4em;
    margin-left:20px;
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}
a.weiterlight:hover:after{
    transform: translateX(10px);
}

/* modul-articlelist */
.modul-articlelist .alert.alert-info {
    display:none;
}
.modul-articlelist #main #component {
    margin-bottom: 0;
}
.modul-articlelist #main .moduletable {
    margin-top:0;
}

/* Article Links */
ul.com-content-article__links {
    list-style:none;
    margin-top:20px;
}
ul.com-content-article__links li {
   display:inline-block;
   margin:0;
   padding:0;
}
ul.com-content-article__links li a {
    display:inline-block;
    padding:5px 15px;
    margin:0 2px 2px 0;
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
    border-radius:4px;
}

ul.com-content-article__links li:before {
    display:none;
}

/* News */
.news.liste {
    margin-top:30px;
}
.news.liste ul li:before {
    display:none;
}
.news.liste .textbox h2{
   padding:15px 0 0px 0;
}
.news.liste .introtext {
    padding:0 0 10px 0;
    margin:0;
}
.news.liste .mainimage,
.news.liste .noimage  {
     aspect-ratio:4/3;
     background-size:cover;
     background-repeat:no-repeat;
     background-position:center;
}

.liste ul li:before {
    display:none;
}

/* Medien Liste */
.medien.liste {
    padding-top:45px;
}
.medien.liste li .articlewrapper {
    padding-bottom:30px;
    margin-bottom:30px;
    border-bottom-style:solid;
    border-width:1px;
}

.medien.liste .imagewrapper {
    width:60px;
    height:60px;
    float:left;
    box-sizing:border-box;
}
.medien.liste .imagewrapper {
    border-radius: 50%;
    margin-right: 15px;
    padding:12px;
}
.medien.liste .textwrapper {
    width:calc(100% - 75px);
    float:left;
}
.medien.liste h3 {
    text-transform:none;
    padding-bottom:3px;
}
.medien.liste .daterow{
    padding-bottom:3px;
}

.medien.liste .daterow  .date,
.medien.liste .daterow  .media {
    display:inline-block;
    margin-right:20px;
}
.medien.liste .weiterlight {
    margin-top:5px;
}

/* Kundenstimmen Liste */
.kundenstimmen.liste {
    max-width:900px;
    margin:0 auto;
}
.kundenstimmen.liste .articlewrapper {
    margin-bottom:40px;
}
.kundenstimmen.liste .imagewrapper{
    text-align:center;
    position: relative;
    z-index: 1;
}

.kundenstimmen.liste .imagewrapper .img {
    aspect-ratio:1/1;
    width:150px;
    object-fit:cover;
    object-position:center top;
    border-radius:50%;
    border-style:solid;
    border-width:10px;
    border-color:var(--primary-color);
    background-color:var(--font-color);
    margin:0 auto;
    overflow:hidden;
}
.kundenstimmen.liste .imagewrapper .img img {
    aspect-ratio:1/1;
    width:150px;
    object-fit:cover;
    object-position:center top;
}
.kundenstimmen.liste .imagewrapper .img img.noimage {
    width:90px;
    margin:20px;
    object-fit:contain;
    object-position:center center;
}
.kundenstimmen.liste .textwrapper{
    border-radius:20px;
    padding:30px 20px 20px 70px;
    background-color:var(--background-color2);
    margin-top:-10px;
    position:relative;
}
.kundenstimmen.liste .textwrapper:before {
    content:"\"";
    font-size:7rem;
    position:absolute;
    left:0px;
    top:60px;
    font-style:italic;
}
.kundenstimmen.liste .textwrapper .kundenstimme {
    font-size:1.5rem;
    line-height:1.4em;
    font-style:italic;
    padding-bottom:20px;
}



@media (min-width: 768px) {

    .logo-homeslider {
        right:5%;
        top:-100px;
    }

    .homeslider img.mainimage {
        width:55%;
    }
    .homeslider .textbox,
    .homeslider li.slick-active .textbox {
        width:50%;
        position:absolute;
        top:20%;
        right:0;
        left:auto;
        margin-right:0;
        min-height:60%;
        padding:40px;
    }
    .homeslider .textbox h2,
    .homeslider li.slick-active .textbox h2 {
        font-size:2.6rem;
        line-height:1.2em;
        margin-bottom:30px;
        padding-bottom:20px;
    }
    .slick-dots {
        width:70%;
    }

    .item-image.right {
        float:right;
        width:40%;
        margin: 5px 0 20px 30px;
    }
    .item-image.left {
        float:left;
        width:40%;
        margin: 7px 30px 20px 0;
    }

}
@media (min-width: 992px) {
    li .logo-homeslider,
    li.slick-active .logo-homeslider {
        right:5%;
        top:-150px;
    }


    .homeslider .textbox {
        padding:70px;
    }
}