.teaserpictureintro>div {
    width: 25%;
    box-sizing: border-box;
    margin: 0;
}

.teaserpictureintropanorama {
    padding: 30px;
}

.teaserpictureintro>ul {
    width: 75%;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    list-style: none;
}

.teaserpictureintro>ul>li {
    padding: 0;
    display: block;
    float: left;
    box-sizing: border-box;
}

.teaserpictureintroleft>ul {
    float: right;
}

.teaserpictureintroleft>div {
    float: left;
    padding: 0 4% 4% 0;
}

.teaserpictureintroright>ul {
    float: left;
}

.teaserpictureintroright>div {
    float: right;
    padding: 0 0 4% 4%;
}

.teaserpictureintro>div>h3 {
    margin-top:0;
}


.teaserpictureintro>ul.teaserpictureintroc2>li.teaserpictureintrom0 { width: 50%; margin: 0; }
.teaserpictureintro>ul.teaserpictureintroc2>li.teaserpictureintrom1 { width: 49.5%; margin: 0 1% 1% 0; }
.teaserpictureintro>ul.teaserpictureintroc2>li.teaserpictureintrom2 { width: 49%; margin: 0 2% 2% 0; }
.teaserpictureintro>ul.teaserpictureintroc2>li.teaserpictureintrom3 { width: 48.5%; margin: 0 3% 3% 0; }
.teaserpictureintro>ul.teaserpictureintroc2>li.teaserpictureintrom4 { width: 48%; margin: 0 4% 4% 0; }
.teaserpictureintro>ul.teaserpictureintroc2>li:nth-child(2n) { margin-right: 0; }
.teaserpictureintro>ul.teaserpictureintroc2>li:nth-child(2n+1){ clear: both; }

.teaserpictureintro>ul.teaserpictureintroc3>li.teaserpictureintrom0 { width: 33.33%; margin: 0; }
.teaserpictureintro>ul.teaserpictureintroc3>li.teaserpictureintrom1 { width: 32.66%; margin: 0 1% 1% 0; }
.teaserpictureintro>ul.teaserpictureintroc3>li.teaserpictureintrom2 { width: 32%; margin: 0 2% 2% 0; }
.teaserpictureintro>ul.teaserpictureintroc3>li.teaserpictureintrom3 { width: 31.33%; margin: 0 3% 3% 0; }
.teaserpictureintro>ul.teaserpictureintroc3>li.teaserpictureintrom4 { width: 30.66%; margin: 0 4% 4% 0; }
.teaserpictureintro>ul.teaserpictureintroc3>li:nth-child(3n) { margin-right: 0; }
.teaserpictureintro>ul.teaserpictureintroc3>li:nth-child(3n+1){ clear: both; }

.teaserpictureintro>ul.teaserpictureintroc4>li.teaserpictureintrom0 { width: 25%; margin: 0; }
.teaserpictureintro>ul.teaserpictureintroc4>li.teaserpictureintrom1 { width: 24.25%; margin: 0 1% 1% 0; }
.teaserpictureintro>ul.teaserpictureintroc4>li.teaserpictureintrom2 { width: 23.5%; margin: 0 2% 2% 0; }
.teaserpictureintro>ul.teaserpictureintroc4>li.teaserpictureintrom3 { width: 22.75%; margin: 0 3% 3% 0; }
.teaserpictureintro>ul.teaserpictureintroc4>li.teaserpictureintrom4 { width: 22%; margin: 0 4% 4% 0; }
.teaserpictureintro>ul.teaserpictureintroc4>li:nth-child(4n) { margin-right: 0; }
.teaserpictureintro>ul.teaserpictureintroc4>li:nth-child(4n+1){ clear: both; }

.teaserpictureintro>ul.teaserpictureintroc5>li.teaserpictureintrom0 { width: 20%; margin: 0; }
.teaserpictureintro>ul.teaserpictureintroc5>li.teaserpictureintrom1 { width: 19.2%; margin: 0 1% 1% 0; }
.teaserpictureintro>ul.teaserpictureintroc5>li.teaserpictureintrom2 { width: 18.4%; margin: 0 2% 2% 0; }
.teaserpictureintro>ul.teaserpictureintroc5>li.teaserpictureintrom3 { width: 17.6%; margin: 0 3% 3% 0; }
.teaserpictureintro>ul.teaserpictureintroc5>li.teaserpictureintrom4 { width: 16.8%; margin: 0 4% 4% 0; }
.teaserpictureintro>ul.teaserpictureintroc5>li:nth-child(5n) { margin-right: 0; }
.teaserpictureintro>ul.teaserpictureintroc5>li:nth-child(5n+1){ clear: both; }

.teaserpictureintro>ul.teaserpictureintroc6>li.teaserpictureintrom0 { width: 16.66%; margin: 0; }
.teaserpictureintro>ul.teaserpictureintroc6>li.teaserpictureintrom1 { width: 15.83%; margin: 0 1% 1% 0; }
.teaserpictureintro>ul.teaserpictureintroc6>li.teaserpictureintrom2 { width: 15%; margin: 0 2% 2% 0; }
.teaserpictureintro>ul.teaserpictureintroc6>li.teaserpictureintrom3 { width: 14.16%; margin: 0 3% 3% 0; }
.teaserpictureintro>ul.teaserpictureintroc6>li.teaserpictureintrom4 { width: 13.33%; margin: 0 4% 4% 0; }
.teaserpictureintro>ul.teaserpictureintroc6>li:nth-child(6n) { margin-right: 0; }
.teaserpictureintro>ul.teaserpictureintroc6>li:nth-child(6n+1){ clear: both; }


.teaserpictureintro>ul>li>a {
    color: #613183;;
    text-decoration: none;
}

.teaserpictureintro>ul>li>a>img {
    display: block;
    width: 100%;
    height: auto;
    transition: opacity 0.3s;
    transform: scale3d(1,1,1);
}

.teaserpictureintro>ul>li>a:focus-visible>img {
	filter: brightness(50%) contrast(75%);
}

.teaserpictureintrohover>ul>li>a:hover>img {
    opacity: 0.8;
}

.teaserpictureintro>ul>li>a>span {
    display: block;
    padding: 3%;
    box-sizing: border-box;
    text-align: center;
}

.teaserpictureintro:after {
    content: "";
    display: table;
    clear: both;
}

.teaserpictureintromore
{
	border-color: #cccccc;
	border-width: 1px;
	border-style: solid;
	padding: 5px 15px 5px 15px;
	background: url(../../../../../images/gradient/?s=ffffff&e=eeeeee&h=30) repeat-x #eeeeee;
	font: 15px Arial,'Helvetica',sans-serif;
	color: #613183;
	letter-spacing: 0px;
	box-shadow: 1px 1px 5px rgba(0,0,0,0.1);
	border-radius: 5px;
	display: inline-block;
	cursor: pointer;
    outline: none;
    -webkit-appearance: none;
    margin-top: 20px;
    text-decoration: none;
}

.teaserpictureintromore:hover
{
	border-color: #b2b2b2;
	background: #eeeeee;
	font-weight: normal;
	font-style: normal;
	text-transform: none;
	color: #444444;
}


@media (max-width: 1023px) {
    .sqr .teaserpictureintro>div,
    .sqr .teaserpictureintro>ul{
        width: 100%;
        float: none;
    }

    .sqr .teaserpictureintro>div {
        padding: 0 0 4% 0;
    }

}

@media (max-width: 767px) {
    .sqr .teaserpictureintro>ul>li.teaserpictureintrom0 { width: 100%; float: none; margin: 0; }
    .sqr .teaserpictureintro>ul>li.teaserpictureintrom1 { width: 100%; float: none; margin: 0 0 1% 0; }
    .sqr .teaserpictureintro>ul>li.teaserpictureintrom2 { width: 100%; float: none; margin: 0 0 2% 0; }
    .sqr .teaserpictureintro>ul>li.teaserpictureintrom3 { width: 100%; float: none; margin: 0 0 3% 0; }
    .sqr .teaserpictureintro>ul>li.teaserpictureintrom4 { width: 100%; float: none; margin: 0 0 4% 0; }
}