.ngpluginshopteaserpicturetext>div>ul { margin: 0; padding: 0; box-sizing: border-box; display: block; } .ngpluginshopteaserpicturetext img { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .ngpluginshopteaserpicturetextpicturealignleft p, .ngpluginshopteaserpicturetextpicturealignright p, .ngpluginshopteaserpicturetextpicturealignleftright p { margin: 0 0 10px 0; } .ngpluginshopteaserpicturetext>div>ul>li { margin: 0 0 40px 0; padding: 0; box-sizing: border-box; display: flex; list-style: none; justify-content: space-between; } .ngpluginshopteaserpicturetext>div>ul>li>div { display: flex; flex-direction: column; justify-content: space-between; } .ngpluginshopteaserpicturetext .ngpluginshopteaserpicturetextpicturecontainer { height: 0; position: relative; } .ngpluginshopteaserpicturetextpicturealigntop>div>ul>li { flex-flow: column nowrap; } .ngpluginshopteaserpicturetextpicturealignright>div>ul>li>div.ngpluginshopteaserpicturetextleftcontainer { order: 2; } .ngpluginshopteaserpicturetextpicturealignright>div>ul>li>div:ngpluginshopteaserpicturetextrightcontainer { order: 1; } .ngpluginshopteaserpicturetextpicturealignleftright>div>ul>li:nth-child(2n)>div.ngpluginshopteaserpicturetextleftcontainer { order: 2; } .ngpluginshopteaserpicturetextpicturealignleftright>div>ul>li:nth-child(2n+1)>div.ngpluginshopteaserpicturetextrightcontainer { order: 1; } .ngpluginshopteaserpicturetext2cols>div>ul, .ngpluginshopteaserpicturetext3cols>div>ul, .ngpluginshopteaserpicturetext4cols>div>ul { display: flex; flex-flow: row wrap; justify-content: flex-start; } .ngpluginshopteaserpicturetext2cols>div>ul>li { width: 48%; margin-right: 4%; } .ngpluginshopteaserpicturetext2cols>div>ul>li:nth-child(2n) { margin-right: 0; } .ngpluginshopteaserpicturetext3cols>div>ul>li { width: 30.66%; margin-right: 4%; } .ngpluginshopteaserpicturetext3cols>div>ul>li:nth-child(3n) { margin-right: 0; } .ngpluginshopteaserpicturetext4cols>div>ul>li { width: 22%; margin-right: 4%; } .ngpluginshopteaserpicturetext4cols>div>ul>li:nth-child(4n) { margin-right: 0; } .ngpluginshopteaserpicturetext .ngpluginshopteaserpicturetextresult form { display: block; margin: 20px 0 0 0; padding: 0; } .ngpluginshopteaserpicturetext table { width: 100%; margin: 10px 0; } .ngpluginshopteaserpicturetext table td { width: 50%; box-sizing: border-box; } .ngpluginshopteaserpicturetext table td:nth-child(1) { padding: 5px 5px 5px 0; } .ngpluginshopteaserpicturetext table td:nth-child(2) { padding: 5px 0 5px 5px; } .ngpluginshopteaserpicturetext>div>ul>li>div>div>a, .ngpluginshopteaserpicturetext>div>ul>li>div>div>a:hover, .ngpluginshopteaserpicturetext>div>ul>li>div>div>a:visited { text-decoration: none; color: #636848; } .ngpluginshopteaserpicturetext form button { border-color: #e3e6db; border-width: 1px; border-style: solid; padding: 10px 20px 10px 20px; background: #f5f7f1; font: 15px Vollkorn,Times,'Times New Roman',serif; color: #7a8250; letter-spacing: 0px; text-transform: uppercase; box-shadow: 0px 1px 3px rgba(0,0,0,0.1); border-radius: 0px; display: inline-block; cursor: pointer; outline: none; -webkit-appearance: none; box-sizing: border-box; margin: 0; vertical-align: middle; } .ngpluginshopteaserpicturetext form button:hover { border-color: #7a8250; background: #7a8250; font-weight: normal; font-style: normal; text-transform: uppercase; color: #ffffff; } .ngpluginshopteaserpicturetext form.ngpluginshopteaserpicturetextputright { text-align: right; } .ngpluginshopteaserpicturetext form.ngpluginshopteaserpicturetextputcenter, .ngpluginshopteaserpicturetext form.ngpluginshopteaserpicturetextputstretch { text-align: center; } .ngpluginshopteaserpicturetext form.ngpluginshopteaserpicturetextputstretch button { display: block; width: 100%; } .ngpluginshopteaserpicturetext svg { width: 1.1em; height: 1.1em; display: inline-block; vertical-align: -0.18em; } .ngpluginshopteaserpicturetexttopcontainer .ngpluginshopteaserpicturetextpicturesizecontainer { margin-left: auto; margin-right: auto; } .ngpluginshopteaserpicturetext form select { border-color: #e3e6db; border-width: 1px; border-style: solid; padding: 7px; background: #ffffff; font: 15px Vollkorn,Times,'Times New Roman',serif; color: #5a5a5a; letter-spacing: 0px; box-shadow: 3px 3px 3px rgba(0,0,0,0.0); border-radius: 0px; box-sizing: border-box; display: block; margin: 0 0 0 0; -webkit-appearance: none; vertical-align: middle; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2225%22%20height%3D%2216%22%20viewBox%3D%220%200%2025.00%2016.00%22%20enable-background%3D%22new%200%200%2025.00%2016.00%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20fill%3D%22%235a5a5a%22%20d%3D%22M%206.36396%2C12.7782L%204.94975%2C11.364L%200%2C6.41422L%201.41421%2C5L%206.36396%2C9.94975L%2011.3137%2C5L%2012.7279%2C6.41421L%207.77817%2C11.364L%206.36396%2C12.7782%20Z%20%22%2F%3E%3C%2Fsvg%3E"); background-repeat: no-repeat; background-position: right center; padding-right: 30px; box-sizing: border-box; } .ngpluginshopteaserpicturetext form select:focus { border-color: #e3e6db; background: #ffffff; background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2225%22%20height%3D%2216%22%20viewBox%3D%220%200%2025.00%2016.00%22%20enable-background%3D%22new%200%200%2025.00%2016.00%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20fill%3D%22%235a5a5a%22%20d%3D%22M%206.36396%2C12.7782L%204.94975%2C11.364L%200%2C6.41422L%201.41421%2C5L%206.36396%2C9.94975L%2011.3137%2C5L%2012.7279%2C6.41421L%207.77817%2C11.364L%206.36396%2C12.7782%20Z%20%22%2F%3E%3C%2Fsvg%3E"); background-repeat: no-repeat; background-position: right center; box-shadow: 3px 3px 3px rgba(0,0,0,0.0); } .ngpluginshopteaserpicturetext form select::-ms-expand { display: none; } .ngpluginshopteaserpicturetext .ngpluginshopteaserpicturetextnomatch { margin: 30px; text-align: center; display: none; } .ngpluginshopteaserpicturetextfilterleft, .ngpluginshopteaserpicturetextfilterright { display: flex; } .ngpluginshopteaserpicturetextfilter label { display: block; margin: 0 10px 5px 0; padding: 0; } .ngpluginshopteaserpicturetextfilter input[type=checkbox] { margin: 0 6px 0 0; vertical-align: middle; } .ngpluginshopteaserpicturetextfilter label span { vertical-align: middle; } .ngpluginshopteaserpicturetextfilter select { width: 100%; } .ngpluginshopteaserpicturetextfilterright>.ngpluginshopteaserpicturetextfilter { order: 2; } .ngpluginshopteaserpicturetextfilterright>.ngpluginshopteaserpicturetextresult { order: 1; } .ngpluginshopteaserpicturetextfiltertop .ngpluginshopteaserpicturetextfilter { display: flex; flex-wrap: wrap; padding: 0; margin: 0 0 20px 0; } .ngpluginshopteaserpicturetextfiltertop .ngpluginshopteaserpicturetextfilter>div { margin: 0 30px 20px 0; } .ngpluginshopteaserpicturetextfilterleft .ngpluginshopteaserpicturetextfilter>div { margin: 0 30px 20px 0; } .ngpluginshopteaserpicturetextfilterright .ngpluginshopteaserpicturetextfilter>div { margin: 0 0 20px 30px; } @media (max-width: 1023px) { .sqr .ngpluginshopteaserpicturetext>div>ul, .sqr .ngpluginshopteaserpicturetext2cols>div>ul, .sqr .ngpluginshopteaserpicturetext3cols>div>ul, .sqr .ngpluginshopteaserpicturetext4cols>div>ul { display: block; } .sqr .ngpluginshopteaserpicturetext2cols>div>ul>li, .sqr .ngpluginshopteaserpicturetext3cols>div>ul>li, .sqr .ngpluginshopteaserpicturetext4cols>div>ul>li { width: 100%; } .sqr .ngpluginshopteaserpicturetextfilter { display: block !important; margin: 0 0 30px 0 !important; } .sqr .ngpluginshopteaserpicturetextfilter>div { margin: 0 0 10px 0 !important; } .sqr .ngpluginshopteaserpicturetextfilterleft, .sqr .ngpluginshopteaserpicturetextfilterright { display: block; } .sqr .ngpluginshopteaserpicturetextfilter, .sqr .ngpluginshopteaserpicturetextfilter>div, .sqr .ngpluginshopteaserpicturetextresult { width: 100% !important; } .sqr .ngpluginshopteaserpicturetextfilter>div>div>label { display: inline-block; } } @media (max-width: 767px) { .sqr .ngpluginshopteaserpicturetext2cols>div>ul>li, .sqr .ngpluginshopteaserpicturetext3cols>div>ul>li, .sqr .ngpluginshopteaserpicturetext4cols>div>ul>li { display: block; } .sqr .ngpluginshopteaserpicturetext .ngpluginshopteaserpicturetextleftcontainer, .sqr .ngpluginshopteaserpicturetext .ngpluginshopteaserpicturetextrightcontainer { width:100% !important; } .sqr .ngpluginshopteaserpicturetext>ul>li>div { display: block; } }