.ngpluginshopteasertileframe ul { margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: stretch; gap: var(--ngpluginshopteasertileframemargin); } .ngpluginshopteasertileframe ul li { list-style: none; margin: 0; padding: var(--ngpluginshopteasertileframepadding); background: var(--ngpluginshopteasertileframebackground); border-radius: var(--ngpluginshopteasertileframeroundedcorners); box-shadow: var(--ngpluginshopteasertileframeshadow); box-sizing: border-box; display: flex; flex-flow: column; gap: var(--ngpluginshopteasertileframepadding); width: 100%; } .ngpluginshopteasertileframe ul li .ngpluginshopteasertileframepicture picture { width: 100%; display: block; } .ngpluginshopteasertileframe ul li .ngpluginshopteasertileframepicture picture img { display: block; width: 100%; border-radius: var(--ngpluginshopteasertileframeroundedcorners); box-shadow: var(--ngpluginshopteasertileframeshadow); transition: filter 0.2s; } .ngpluginshopteasertileframehover ul li .ngpluginshopteasertileframepicture picture img:hover { filter: brightness(115%); } .ngpluginshopteasertileframe ul li .ngpluginshopteasertileframetext { color: var(--ngpluginshopteasertileframesummarycolor); font-size: var(--ngpluginshopteasertileframesummarysize); display: flex; flex-grow: 1; gap: var(--ngpluginshopteasertileframepadding); justify-content: space-between; flex-flow: column; } .ngpluginshopteasertileframe ul li .ngpluginshopteasertileframetext a { color: var(--ngpluginshopteasertileframesummarycolor); text-decoration: none; } .ngpluginshopteasertileframe ul li .ngpluginshopteasertileframetext .ngshopputform { text-align: var(--ngpluginshopteasertileframelinkalign); } .ngpluginshopteasertileframe ul li .ngpluginshopteasertileframetext .ngshopputform button { border-radius: var(--ngpluginshopteasertileframelinkroundedcorners); color: var(--ngpluginshopteasertileframelinkcolor); background-color: var(--ngpluginshopteasertileframelinkbackground); border: var(--ngpluginshopteasertileframelinkborder); font-size: var(--ngpluginshopteasertileframelinksize); font-weight: var(--ngpluginshopteasertileframelinkweight); text-transform: var(--ngpluginshopteasertileframelinktexttransform); display: var(--ngpluginshopteasertileframelinkdisplay); width: var(--ngpluginshopteasertileframelinkwidth); padding: 10px 14px; text-decoration: none; transition: opacity 0.2s; cursor: pointer; } .ngpluginshopteasertileframehover ul li .ngpluginshopteasertileframetext .ngshopputform button:hover { opacity: 0.8; } .ngpluginshopteasertileframepriceinfo { margin-top: var(--ngpluginshopteasertileframemargin); } @media (min-width: 1024px) { .ngpluginshopteasertileframe ul { flex-wrap: wrap; align-items: stretch; } .ngpluginshopteasertileframe ul li { display: flex; flex-flow: column; list-style: none; width: var(--ngpluginshopteasertileframecolumnwidth); } } .ngpluginshopteasertileframe ul form { display: block; margin: 0; padding: 0; } .ngpluginshopteasertileframe table { width: 100%; margin: 10px 0; } .ngpluginshopteasertileframe table td { width: 50%; box-sizing: border-box; } .ngpluginshopteasertileframe table td:nth-child(1) { padding: 5px 5px 5px 0; } .ngpluginshopteasertileframe table td:nth-child(2) { padding: 5px 0 5px 5px; } .ngpluginshopteasertileframe form select { border-color: #e5e5e5; border-width: 1px; border-style: solid; padding: 6px 12px 6px 12px; background: #ffffff; font: 16px 'Open Sans',Verdana,Helvetica,sans-serif; color: #808080; letter-spacing: 0px; 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%23808080%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; } .ngpluginshopteasertileframe form select::-ms-expand { display: none; } .ngpluginshopteasertileframe .ngpluginshopteasertileframenomatch { margin: 30px; text-align: center; display: none; } .ngpluginshopteasertileframefilterleft, .ngpluginshopteasertileframefilterright { display: flex; } .ngpluginshopteasertileframefilter label { display: block; margin: 0 10px 5px 0; padding: 0; } .ngpluginshopteasertileframefilter input[type=checkbox] { margin: 0 6px 0 0; vertical-align: middle; } .ngpluginshopteasertileframefilter label span { vertical-align: middle; } .ngpluginshopteasertileframefilter select { width: 100%; } .ngpluginshopteasertileframefilterright>.ngpluginshopteasertileframefilter { order: 2; } .ngpluginshopteasertileframefilterright>.ngpluginshopteasertileframeresult { order: 1; } .ngpluginshopteasertileframefiltertop .ngpluginshopteasertileframefilter { display: flex; flex-wrap: wrap; padding: 0; margin: 0 0 20px 0; } .ngpluginshopteasertileframefiltertop .ngpluginshopteasertileframefilter>div { margin: 0 30px 20px 0; width: var(--ngpluginshopteasertileframefilterwidth); } .ngpluginshopteasertileframefilterleft .ngpluginshopteasertileframefilter, .ngpluginshopteasertileframefilterright .ngpluginshopteasertileframefilter { width: var(--ngpluginshopteasertileframefilterwidth); } .ngpluginshopteasertileframefilterleft .ngpluginshopteasertileframeresult, .ngpluginshopteasertileframefilterright .ngpluginshopteasertileframeresult { width: var(--ngpluginshopteasertileframeresultwidth); } .ngpluginshopteasertileframefilterleft .ngpluginshopteasertileframefilter>div { margin: 0 30px 20px 0; } .ngpluginshopteasertileframefilterright .ngpluginshopteasertileframefilter>div { margin: 0 0 20px 30px; } @media (max-width: 1023px) { .sqr .ngpluginshopteasertileframefilter { display: block !important; margin: 0 0 30px 0 !important; } .sqr .ngpluginshopteasertileframefilter>div { margin: 0 0 10px 0 !important; } .sqr .ngpluginshopteasertileframefilterleft, .sqr .ngpluginshopteasertileframefilterright { display: block; } .sqr .ngpluginshopteasertileframefilter, .sqr .ngpluginshopteasertileframefilter>div , .sqr .ngpluginshopteasertileframeresult { width: 100% !important; } .sqr .ngpluginshopteasertileframefilter>div>div>label { display: inline-block; } }