/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 12.07.2016, 07:24:47
    Author     : barthelfr
*/
.clearfix {padding:0; margin:0; line-height:0;}
.visible-xxs-block {display: none !important;}

.highlightView {position:relative; margin-bottom: 20px}
#noHighlightView .btn-view-box {display:none;}

/********************************************/
/* SLIDEDOWN  */
#highlightView .slidedown .btn-view {display:none;}
#highlightView .slidedown .itemContainer .highlightItemTitle {
    z-index:20; width:100%; font-size: 20px;
   text-align: center;text-transform: uppercase;
    position:absolute; top:0;padding:0 10px; background:#980098; color:#FFF;line-height:50px
}
#highlightView .slidedown .itemContainer .highlightItemTitle strong { font-weight: normal;}
#highlightView .slidedown .highlightView{position:relative;height:270px;overflow:hidden}
#highlightView .slidedown .itemContainer .highlightItemTitle a {color:#FFF;}

#highlightView .slidedown  .highlightView div[class*="ItemIntroText"] {
    -webkit-transition: all 0.6s ease-in-out; z-index:10;;
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
    height:240px; position:absolute; top:-240px; background:rgba(152,0,152,0.7);
    padding:10px;
    color:#FFF;
    text-align:center;
    width:100%;
}

#highlightView .slidedown .highlightView:hover div[class*="ItemIntroText"] {
    -webkit-transition: all 0.6s ease-in-out;
    -moz-transition: all 0.6s ease-in-out;
    -o-transition: all 0.6s ease-in-out;
    transition: all 0.6s ease-in-out;
    top:40px; 
}
#highlightView .slidedown .lastone .highlightItemTitle strong{display:none;}
#highlightView .slidedown .lastone .highlightView div[class*="ItemIntroText"] {
     top:0px; background:rgba(152,0,152,1); height:270px;
}

/********************************************/
/* OVERLAY  */
#highlightView .overlay div[class*="ItemImageBlock"] > span {margin:0;}
#highlightView .overlay .itemContainer {position:relative; overflow:hidden; margin-bottom: 20px}
#highlightView .overlay .itemContainer .highlightItemTitle {padding: 10px 27px;width:100%; bottom:80px;font-size:18px;line-height:32px;}
#highlightView .overlay .itemContainer .highlightView div[class*="ItemIntroText"] { padding: 0 27px;width:100%}

#highlightView .overlay .itemContainer:hover  .itemContent {opacity: 0;}
#highlightView .overlay .itemContent {

    transition: opacity 400ms;
    -webkit-transition: opacity 400ms;
    -moz-transition: opacity 400ms;
    -o-transition: opacity 400ms;
    position: absolute;z-index: 2;
    top: 0;  bottom: 0;  left: 0;  right: 0;
    text-align: center; color: #fff;
    padding: 0; margin: 0;
    background: rgba(0, 0, 0, 0.8);
}
#highlightView .overlay .itemContainer .highlightView div[class*="ItemIntroText"] {position:absolute; bottom:20px;}
#highlightView .overlay .itemContainer div[class*="ItemImageBlock"]{float:none; padding: 0;}
/*#t3-mainbody .overlay .itemContainer .catItemImageBlock span.catItemImage {margin:0;}*/

#highlightView .overlay .itemContainer .btn-view-box {display:none;}
#highlightView .overlay .itemContainer .btn-view-box {display:block;z-index:999;top:0; left:0;position:absolute;width:100%; height:100%;}
#highlightView .overlay .itemContainer .btn-view-box > p {display:table; height:100%; width:100%}
#highlightView .overlay .itemContainer .btn-view { 
    display:table-cell;text-align:center; vertical-align:middle; opacity:0; 
    -webkit-transform: scale3d(0, 0, 0);
    -o-transform: scale3d(0, 0, 0);
    -moztransform: scale3d(0, 0, 0);
    transform: scale3d(0, 0, 0);
    -webkit-transition: all 400ms;
    -moz-transition: all 400ms;
    -o-transition: all 400ms;
    transition: all 400ms;

}
#highlightView .overlay .itemContainer:hover .btn-view {   
    opacity:1;
    -webkit-transform: scale3d(1, 1, 1);
    -moz-transform: scale3d(1, 1, 1);
    -o-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
}
#highlightView .overlay .itemContainer .btn-view i.fa.fa-link{
    border: 1px solid #FFF;
    border-radius: 100px;
    padding:20px;
    color:#FFF;
    background: rgba(0, 0, 0, 0.5);
}
#highlightView .overlay .itemContainer .btn-view i.fa.fa-link:before{font-size:28px}

/********************************************/
/* BOXED  */
#highlightView .boxed .itemContainer {padding:0;}
#highlightView .boxed .itemContainer > div {background:#FFF; margin:0 5px; padding:5px}
#highlightView .boxed .itemContainer .moduleItemIntroText {display:none;}

#highlightView .boxed .itemContainer .itemContent {padding:10px}
#highlightView .boxed .itemContainer .highlightView {position:relative; background:#FFF}
#highlightView .boxed .itemContainer .highlightView .highlightItemTitle {font-size: 18px;color:#980098; font-weight:bold; line-height:32px;padding-bottom:0px;}
#highlightView .boxed .itemContainer .highlightView .highlightItemTitle a {color:#980098;font-size: 18px; }
#highlightView .boxed .itemContainer .highlightView .highlightItemTitle, 
#highlightView .boxed .itemContainer .highlightView div[class*="ItemIntroText"] {text-align:center!important; }
#highlightView .boxed .itemContainer .highlightView div[class*="ItemIntroText"] p:last-child:not(:first-child) {left:0px;position:absolute; bottom: 10px; }
#highlightView .boxed .itemContainer .highlightView div[class*="ItemIntroText"] p:last-child a{ 
    color: #FFF;padding:10px;text-align:center; display:inline-block;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    background-color: #005fb7; 
}
#highlightView .boxed .itemContainer .highlightView div[class*="ItemIntroText"] p:last-child a:hover{
    -webkit-transition: background-color 0.5s ;
    -moz-transition: background-color 0.5s;
    -o-transition: background-color 0.5s;;
    transition: background-color 0.5s;
    background-color:red;
    text-decoration:none
}
#highlightView .boxed .itemContainer  div[class*="ItemImageBlock"] {position:relative; padding:0;}
#highlightView .boxed .itemContainer .btn-view-box {display:none;z-index:999;bottom:-5px;; right:30px;position:absolute;width:30px; height:30px}
#highlightView .boxed .itemContainer .btn-view-box > p {display:table; height:30px; width:30px}
#highlightView .boxed .itemContainer .btn-view { display:table-cell;text-align:center; vertical-align:middle; opacity:1; 
                                                 background: #edf2f6;border-radius: 100px;
}
#highlightView .boxed .itemContainer .btn-view i {
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}
#highlightView .boxed .itemContainer .btn-view i:hover{   
    -webkit-transform: rotateY(-180deg);
    -moz-transform: rotateY(-180deg);
    -ms-transform: rotateY(-180deg);
    transform: rotateY(-180deg);
}
#highlightView .boxed .itemContainer .btn-view i.fa.fa-link{
    border: 1px solid #FFF;border-radius: 100px;
    padding:10px;margin:3px;
    color:#FFF;
    background: #005fb7;
}
#highlightView .boxed .itemContainer .btn-view i.fa.fa-link:before{font-size:22px}



/*****************************************************************************************/
/* 4x1 Kacheln  */
.kacheln4x1 {line-height:normal;}
.kacheln4x1 .kachelItemTitle:before, .kacheln4x1 .kachelItemTitle:after {display:none;}
.kacheln4x1 div[class*="col-"]{padding:0;color:#5d3620}
.kacheln4x1 {background-color: lightgray;}
.kacheln4x1 .moduleItemIntrotext { padding:20px;}
.kacheln4x1 .kachelItemTitle {margin-top:0;color:#ce0000; font-weight:700; font-size:24px; margin-bottom:10px;}
/*.kacheln4x1 img { max-width:100%}*/
.kacheln4x1 .row.box div[class*="col-"]{height:260px;overflow:hidden; font-size:16px}
.kacheln4x1 .row.box {position:relative; height:200px; overflow: hidden;}
.kacheln4x1 .row.box .moduleItemIntrotext > p + p:last-child {position:absolute; bottom:0;right:0;margin:0; padding:0; }
.kacheln4x1 .row.box .moduleItemIntrotext > p + p:last-child i {font-size:30px;padding:5px 5px 0 5px; margin:0;}
.kacheln4x1 .row.box .moduleItemIntrotext > p + p:last-child a.plus {height:45px;color: gray;background:silver; display:inline-block; padding:5px; text-align:center}
.kacheln4x1 .row.box .moduleItemIntrotext > p + p:last-child a.plus + a {display:none;width:200px;font-size:16px; height:35px}
.kacheln4x1 .row.box .moduleItemIntrotext > p + p:last-child a.plus + a, 
.kacheln4x1 .row.box  a.more {  padding:5px 10px; vertical-align:top;  background: rgba(128,128,128,0.7); color:white; }
.kacheln4x1 .row.box a.more {   position:absolute; bottom:0; width:100%; height:45px;font-size:20px;padding-top:10px}
.kacheln4x1 .row.box .moduleItemIntrotext > p + p:last-child {right:0;}

/*****************************************************************************************/
/* 2x2 Kacheln Startseite */
.kacheln2x2 {line-height:normal;}
.kacheln2x2 .kachelItemTitle:before, .kacheln2x2 .kachelItemTitle:after {display:none;}
.kacheln2x2 div[class*="col-"]{padding:0;color:#5d3620}
.kacheln2x2 {background-color: lightgray;}
.kacheln2x2 .moduleItemIntrotext { padding:20px;}
.kacheln2x2 .kachelItemTitle {margin-top:0;color:#ce0000; font-weight:700; font-size:24px; margin-bottom:10px;}
/*.kacheln2x2 img { max-width:100%}*/
.kacheln2x2 .row.box div[class*="col-"]{height:260px;overflow:hidden; font-size:16px}
.kacheln2x2 .row.box {position:relative}
.kacheln2x2 .row.box .moduleItemIntrotext > p + p:last-child {position:absolute; bottom:0;right:0;margin:0; padding:0; }
.kacheln2x2 .row.box .moduleItemIntrotext > p + p:last-child i {font-size:30px;padding:5px 5px 0 5px; margin:0;}
.kacheln2x2 .row.box .moduleItemIntrotext > p + p:last-child a.plus {height:45px;color: gray;background:silver; display:inline-block; padding:5px; text-align:center}
.kacheln2x2 .row.box .moduleItemIntrotext > p + p:last-child a.plus + a {display:none;width:200px;font-size:16px; height:35px}
.kacheln2x2 .row.box .moduleItemIntrotext > p + p:last-child a.plus + a, 
.kacheln2x2 .row.box .moduleItemImage a.more {  padding:5px 10px; vertical-align:top;  background: rgba(128,128,128,0.7); color:white;}
.kacheln2x2 .row.box .moduleItemImage a.more {   position:absolute; bottom:0; width:100%; height:45px;font-size:20px;padding-top:10px}
.kacheln2x2 .row.box .col-md-push-6 .moduleItemIntrotext > p + p:last-child {left:0;}
.kacheln2x2 .row.box .col-md-pull-6 .moduleItemImage a.more  {text-align:right;  }
.kacheln2x2 .row.box .moduleItemImage a.more  {  left:-300px; }
.kacheln2x2 .row.box .col-md-pull-6 .moduleItemImage a.more  {    left:300px; }
.kacheln2x2 .row.box .moduleItemImage a.more.show {      left:0; }
.kacheln2x2 .row.box .moduleItemImage a.more,
.kacheln2x2 .row.box .col-md-pull-6 .moduleItemImage a.more,
.kacheln2x2 .row.box .moduleItemImage a.more.show {
    -webkit-transition: left 500ms ease-in-out;
    -moz-transition: left 500ms ease-in-out;
    -o-transition: left 500ms ease-in-out;
    transition: left 500ms ease-in-out;
}

.kacheln2x2 .square {
    position:absolute; width:36px; height:36px; top: 30px;background: lightgray; left: 46%; left: calc(50% - 18px);z-index:100;
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

.kacheln2x2 .even .square {left: 48%; left: calc(50% - 18px);}


/*****************************************************************************************/
/* 1x2 Kacheln Startseite */
.kacheln1x2 {line-height:normal;}
.kacheln1x2 .kachelItemTitle:before, .kacheln1x2 .kachelItemTitle:after {display:none;}
.kacheln1x2 div[class*="col-"]{padding:0;color:#5d3620}
.kacheln1x2 {background-color: lightgray;}
.kacheln1x2 .moduleItemIntrotext { padding:20px;}
.kacheln1x2 .kachelItemTitle {margin-top:0;color:#ce0000; font-weight:700; font-size:24px; margin-bottom:10px;}
/*.kacheln1x2 img { max-width:100%}*/
.kacheln1x2 .row.box div[class*="col-"]{height:260px;overflow:hidden; font-size:16px}
.kacheln1x2 .row.box {position:relative}
.kacheln1x2 .row.box .moduleItemIntrotext > p + p:last-child {position:absolute; bottom:0;right:0;margin:0; padding:0; }
.kacheln1x2 .row.box .moduleItemIntrotext > p + p:last-child i {font-size:30px;padding:5px 5px 0 5px; margin:0;}
.kacheln1x2 .row.box .moduleItemIntrotext > p + p:last-child a.plus {height:45px;color: gray;background:silver; display:inline-block; padding:5px; text-align:center}
.kacheln1x2 .row.box .moduleItemIntrotext > p + p:last-child a.plus + a {display:none;width:200px;font-size:16px; height:35px}
.kacheln1x2 .row.box .moduleItemIntrotext > p + p:last-child a.plus + a, 
.kacheln1x2 .row.box .moduleItemImage a.more {
    padding:5px 10px; vertical-align:top;
    background: rgba(128,128,128,0.7); color:white;
}
.kacheln1x2 .row.box .moduleItemImage a.more {   position:absolute; bottom:0; width:100%; height:45px;font-size:20px;padding-top:10px}
.kacheln1x2 .row.box .col-md-push-6 .moduleItemIntrotext > p + p:last-child {left:0;}
.kacheln1x2 .row.box .col-md-pull-6 .moduleItemImage a.more  {text-align:right;  }
.kacheln1x2 .row.box .moduleItemImage a.more  {  left:-600px; }
.kacheln1x2 .row.box .col-md-pull-6 .moduleItemImage a.more  {    left:600px; }
.kacheln1x2 .row.box .moduleItemImage a.more.show {      left:0; }
.kacheln1x2 .row.box .moduleItemImage a.more,
.kacheln1x2 .row.box .col-md-pull-6 .moduleItemImage a.more,
.kacheln1x2 .row.box .moduleItemImage a.more.show {
    -webkit-transition: left 500ms ease-in-out;
    -moz-transition: left 500ms ease-in-out;
    -o-transition: left 500ms ease-in-out;
    transition: left 500ms ease-in-out;
}

.kacheln1x2 .square {
    position:absolute; width:36px; height:36px; top: 30px;background: lightgray; left: 46%; left: calc(50% - 18px);z-index:100;
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

.kacheln1x2 .even .square {left: 48%; left: calc(50% - 18px);}


/********************************************************************/
/* HoverBox */
#highlightView .hoverbox .btn-view {display:none;}

#highlightView .hoverbox div[class*="ItemImageBlock"]{ 
    background:#FFF;
    opacity: 1; 
    transition: opacity 500ms ease-in-out;
    -moz-transition: opacity 500ms ease-in-out;
    -webkit-transition: opacity 500ms ease-in-out;
}
#highlightView .hoverbox .highlightView:hover div[class*="ItemImageBlock"] {
    opacity: 0.1; 
    transition: opacity 500ms ease-in-out;
    -moz-transition: opacity 500ms ease-in-out;
    -webkit-transition: opacity 500ms ease-in-out;}

#highlightView .hoverbox .itemContent {
    position: absolute;
    text-align:center;
    width:100%;
    z-index:10;
    padding:20px;
    width: 100%;
    height: auto;
    opacity: 0;
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%,-50%,0) scale(0,0);
    -moz-transform: translate3d(-50%,-50%,0) scale(0,0);
    transform: translate3d(-50%,-50%,0) scale(0,0);
    transition-duration: 400ms;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.7,1,0.7,1);

}
#highlightView .hoverbox .highlightView:hover .itemContent{
    opacity: 1;
    -webkit-transform: translate3d(-50%,-50%,0) scale(1,1);
    -moz-transform: translate3d(-50%,-50%,0) scale(1,1);
    transform: translate3d(-50%,-50%,0) scale(1,1);
    transition-duration: 400ms;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.7,1,0.7,1);
}
/********************************************************************/
.animatedNumbersText {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%,-50%,0);
    -moz-transform: translate3d(-50%,-50%,0);
    transform: translate3d(-50%,-50%,0);
    text-align:center;
}

.animatedNumbersText .counter {
    font-size:20px;
    float:none;
}

/********************************************************************/
div[class*="kachel"] .row.box .noHighlightLink > p + p:last-child {position:static}

.kacheln4x1.hoverbox .moduleItemHoverBox {margin:5px;background:transparent}
.kacheln4x1.hoverbox,
.kacheln4x1.hoverbox > div[class*="col"] {background:none;}


/*----------------------------------------------------------------------*/
@media only screen and (min-width: 481px) and (max-width: 991px) {
    .kacheln1x2 .row.box.odd .moduleItemIntrotext > p + p:last-child,
    .kacheln2x2 .row.box.odd .moduleItemIntrotext > p + p:last-child,
    .kacheln4x1 .row.box.odd .moduleItemIntrotext > p + p:last-child{
        right:0;left:initial
    }
    .kacheln1x2 .row.box.odd .moduleItemImage a.more,
    .kacheln1x2 .row.box.even .moduleItemImage a.more,
    .kacheln1x2 .row.box.odd .moduleItemImage a.more.show,
    .kacheln1x2 .row.box.even .moduleItemImage a.more.show,

    .kacheln2x2 .row.box.odd .moduleItemImage a.more,
    .kacheln2x2 .row.box.even .moduleItemImage a.more,
    .kacheln2x2 .row.box.odd .moduleItemImage a.more.show,
    .kacheln2x2 .row.box.even .moduleItemImage a.more.show,

    .kacheln4x1 .row.box.odd .moduleItemImage a.more,
    .kacheln4x1 .row.box.even .moduleItemImage a.more,
    .kacheln4x1 .row.box.odd .moduleItemImage a.more.show,
    .kacheln4x1 .row.box.even .moduleItemImage a.more.show
    {
        /*        -webkit-transition: left 500ms ease-in-out;
                -moz-transition: left 500ms ease-in-out;
                -o-transition: left 500ms ease-in-out;
                transition: left 500ms ease-in-out;*/
    }
    .kacheln4x1 .row.box.odd .moduleItemIntrotext > p + p:last-child,
    .kacheln1x2 .row.box.even .moduleItemIntrotext > p + p:last-child,
    .kacheln2x2 .row.box.even .moduleItemIntrotext > p + p:last-child
    {
        right:initial; left:0;
    }
    .kacheln2x2 .row.box.odd .moduleItemImage a.more { 
        left:-360px; 
        text-align:left;
    }
    .kacheln1x2 .row.box.odd .moduleItemImage a.more.show,
    .kacheln2x2 .row.box.odd .moduleItemImage a.more.show,
    .kacheln4x1 .row.box.odd .moduleItemImage a.more.show{ 
        left:0px; 
    }
    .kacheln2x2 .row.box.even .moduleItemImage a.more { 
        left:360px; 
        text-align:right;
    }
    .kacheln1x2 .row.box.even .moduleItemImage a.more.show,
    .kacheln2x2 .row.box.even .moduleItemImage a.more.show,
    .kacheln4x1 .row.box.even .moduleItemImage a.more.show{ 
        left:0; 
    }

    .kacheln1x2 .kachelItemTitle, .kacheln2x2 .kachelItemTitle, .kacheln4x1 .kachelItemTitle {font-size:22px}

    .kacheln4x1 > div:nth-of-type(4n+1),
    .kacheln4x1 > div:nth-of-type(4n+4)
    {
        background: #FFF;
    }
}


@media only screen and  (min-width: 480px) and (max-width: 640px) {
    .kacheln1x2 .row.box div[class*="col-"],
    .kacheln2x2 .row.box div[class*="col-"],
    .kacheln4x1 .row.box div[class*="col-"]{ height:230px}

    .kacheln1x2 .row.box .moduleItemIntrotext > p + p:last-child i,
    .kacheln2x2 .row.box .moduleItemIntrotext > p + p:last-child i,
    .kacheln4x1 .row.box .moduleItemIntrotext > p + p:last-child i{
        font-size:20px
    }

    .kacheln1x2 .row.box .moduleItemIntrotext > p + p:last-child a.plus,
    .kacheln2x2 .row.box .moduleItemIntrotext > p + p:last-child a.plus,
    .kacheln4x1 .row.box .moduleItemIntrotext > p + p:last-child a.plus{height:36px}

    .kacheln1x2 .row.box .moduleItemImage a.more,
    .kacheln2x2 .row.box .moduleItemImage a.more,
    .kacheln4x1 .row.box .moduleItemImage a.more {height:36px; font-size:18px; padding-top:8px}

}
@media only screen and (min-width: 480px) and (max-width: 767px) {
    .kacheln1x2 h3, .kacheln2x2 .kachelItemTitle {font-size:18px}
    .kacheln1x2 .row.box div[class*="col-"],
    .kacheln2x2 .row.box div[class*="col-"],
    .kacheln4x1 .row.box div[class*="col-"]{font-size:14px}

}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .kacheln1x2 .kachelItemTitle, .kacheln2x2 .kachelItemTitle, .kacheln4x1 .kachelItemTitle {font-size:20px}

    #highlightView .overlay .itemContainer .moduleItemIntrotext p:first-child{display:none;}
    
    #highlightView .slidedown  .highlightView div[class*="ItemImageBlock"] {margin-top:10px;}

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .kacheln1x2 .row.box div[class*="col-"],
    .kacheln2x2 .row.box div[class*="col-"],
    .kacheln4x1 .row.box div[class*="col-"] { height:230px; font-size:14px}

    .kacheln1x2 .kachelItemTitle, .kacheln2x2 .kachelItemTitle, .kacheln4x1 .kachelItemTitle {font-size:22px}

    .kacheln4x1 > div:nth-of-type(2n+1) {
        background: #FFF;
    }

    #highlightView .slidedown  .highlightView div[class*="ItemImageBlock"] {margin-top:50px;}
}

@media only screen and (max-width: 991px){
    #highlightView .boxed .itemContainer {margin-bottom:20px;}

    #highlightView .overlay .itemContainer .highlightItemTitle, 
    #highlightView .overlay .itemContainer .highlightView div[class*="ItemIntroText"] {padding:0 7px;}
}

@media only screen and (max-width: 767px){


    /*#highlightView div[class*="-12"] div.itemContainer div[class*="ItemImageBlock"] {margin:0;}*/

    #highlightView .itemContent {padding: 20px; text-align: left!important; position:static!important}

    #highlightView .highlightView div[class*="ItemIntroText"],
    #highlightView .itemContainer .highlightItemTitle {position:static!important}
    #highlightView .itemContainer {float:none; width:100%!important; padding:0;}
    #highlightView .itemContainer .highlightView {height:auto!important;}
    #highlightView .itemContainer .btn-view-box  {display:none!important;}
    #highlightView .itemContainer  div[class*="ItemImageBlock"] { float: left;  width: 33%;   margin-right: 3%;   }

    #highlightView .boxed .itemContainer .itemContent {padding: 0;}
    #highlightView .boxed .itemContainer .highlightView div[class*="ItemIntroText"] p:last-child:not(:first-child) {bottom:initial; margin-top: 10px;position:relative; text-align:right;}

    #highlightView .overlay .itemContainer .highlightItemTitle {margin:10px 0 20px 0}
    #highlightView .overlay .itemContainer:hover  .itemContent {opacity: 1;}

    #highlightView .overlay .itemContainer .highlightItemTitle,
    #highlightView .overlay .itemContainer .highlightView div[class*="ItemIntroText"] {margin-top:0;position:static;padding:0;} 
    #highlightView .overlay .itemContainer div[class*="ItemImageBlock"] {float:left}
    #highlightView .overlay .itemContent {padding:10px; text-align:left}


    #highlightView .slidedown .itemContainer .moduleItemImageBlock {display:none; /*float:left; width:33%*/}
    #highlightView .slidedown .highlightView div[class*="ItemIntroText"] {height:auto;}

    #aftermainbody > .container {padding:20px 15px}

    #highlightView .slidedown .itemContent {padding: 0;}
    
    #highlightView .hoverbox .itemContent {top:0; top:0;transform: none; opacity:1}
    
    #highlightView .hoverbox .highlightView:hover .itemContent,
    #highlightView .hoverbox .highlightView:hover div[class*="ItemImageBlock"] {opacity:1; transition:none;transform:none;}
}

@media only screen and (max-width: 480px) {
    .kacheln1x2 .row.box div[class*="col-"],
    .kacheln2x2 .row.box div[class*="col-"],
    .kacheln4x1 .row.box div[class*="col-"]{ height:auto}

    .kacheln1x2 .row.box .moduleItemImage a.more,
    .kacheln2x2 .row.box .moduleItemImage a.more,
    .kacheln4x1 .row.box .moduleItemImage a.more{display:none!important;}

    .kacheln1x2 .row.box .moduleItemIntrotext > p + p:last-child a.plus + a,
    .kacheln2x2 .row.box .moduleItemIntrotext > p + p:last-child a.plus + a,
    .kacheln4x1 .row.box .moduleItemIntrotext > p + p:last-child a.plus + a{display:inline-block;padding:8px 10px}

    .kacheln1x2 .row.box .col-md-push-6 .moduleItemIntrotext > p + p:last-child,
    .kacheln2x2 .row.box .col-md-push-6 .moduleItemIntrotext > p + p:last-child,
    .kacheln4x1 .row.box .col-md-push-6 .moduleItemIntrotext > p + p:last-child{ left:initial; right:0;}

    .kacheln1x2 .row.box .moduleItemIntrotext > p + p:last-child,
    .kacheln2x2 .row.box .moduleItemIntrotext > p + p:last-child,
    .kacheln4x1 .row.box .moduleItemIntrotext > p + p:last-child{ bottom:initial;}

    .kacheln1x2 .row.box .moduleItemIntrotext > p + p:last-child i,
    .kacheln2x2 .row.box .moduleItemIntrotext > p + p:last-child i,
    .kacheln4x1 .row.box .moduleItemIntrotext > p + p:last-child i{font-size:20px;padding: 3px 3px 0 3px;}

    .kacheln1x2 .row.box .moduleItemIntrotext > p + p:last-child a.plus,
    .kacheln2x2 .row.box .moduleItemIntrotext > p + p:last-child a.plus,
    .kacheln4x1 .row.box .moduleItemIntrotext > p + p:last-child a.plus{height:35px;}

    .kacheln1x2 .square {bottom: 382px; top:auto;}
    .kacheln2x2 .square {bottom: 249px; top:auto;}


    .kacheln1x2 .row.box .moduleItemIntrotext > p + p:last-child {position:relative;}

    .kacheln1x2 .kachelItemTitle, .kacheln2x2 .kachelItemTitle, .kacheln4x1 .kachelItemTitle {font-size:18px}

    .kacheln1x2 .row.box .moduleItemIntrotext > p + p:last-child,
    .kacheln2x2 .row.box .moduleItemIntrotext > p + p:last-child,
    .kacheln4x1 .row.box .moduleItemIntrotext > p + p:last-child{position:relative; margin-bottom:20px;}


    .kacheln4x1 > div:nth-of-type(2n+1) {  background: #FFF;  }

    .col-xxs-12 { float:none; width:100%;right:0;left:0;}


    .animatedNumbersText {position: static; -moz-transform: none;
                          -ms-transform: none;
                          -o-transform: none;
                          -webkit-transform: none}

    #highlightView .itemContainer .highlightView {margin: 0 30px 20px 30px}
    #highlightView .itemContainer  div[class*="ItemImageBlock"]{float:none!important; width:100%!important}

    /*.t3-spotlight .fixed-columns  .moduleItemImageBlock,
    .t3-spotlight .responsive-columns .moduleItemImageBlock 
    .t3-spotlight .overlay .modulcontent {float:none!important; width:100%!important; margin:0!important;}*/

    #highlightView .highlightView {height:auto !important; }

    #highlightView .overlay .itemContent {padding: 20px; position:static}


    #highlightView .boxed .itemContainer .itemContent {padding: 10px;}

    #highlightView .slidedown .itemContainer .itemContent  {padding:0;}
    #highlightView .slidedown .highlightView div[class*="ItemIntroText"] {padding: 10px!important}


    

}



@media (min-width: 1200px) {
    .kacheln4x1 > div:nth-of-type(8n+1),
    .kacheln4x1 > div:nth-of-type(8n+3),
    .kacheln4x1 > div:nth-of-type(8n+6),
    .kacheln4x1 > div:nth-of-type(8n+8){
        background: #FFF;
    }

}


@media (min-width: 481px) and (max-width: 991px) {
    .col-fbsm-pull-6 {
        right: 50%;
    }
    .col-fbsm-push-6 {
        left: 50%;
    }
}