Initial Commit

This commit is contained in:
bmen 2019-03-22 11:10:07 +01:00
commit e5ffcb6e70
17 changed files with 1344 additions and 0 deletions

BIN
.DS_Store vendored Normal file

Binary file not shown.

3
README.md Normal file
View File

@ -0,0 +1,3 @@
# OHO - Openource Hardware Observatory
Es geht darum ein Interfacekonzept für das Mediawiki umzusetzen. Es handelt sich hierbei nur um statische HTML, CSS und Javascript Dateien, die keinen Webserver oder Datenbank benötigen.

6
css/icheck-material.min.css vendored Executable file

File diff suppressed because one or more lines are too long

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

BIN
img/backgroun01.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 914 KiB

BIN
img/backgroun02.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 629 KiB

BIN
img/backgroun03.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 572 KiB

BIN
img/backgroun04.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 979 KiB

BIN
img/icon-flag-spain.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

BIN
img/news-thumb.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

BIN
img/oho-logo-imprint.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.9 KiB

92
img/oho_logo_WHITE.svg Normal file
View File

@ -0,0 +1,92 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 23.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 749 181" style="enable-background:new 0 0 749 181;" xml:space="preserve">
<style type="text/css">
.st0{fill:#FFFFFF;}
</style>
<g>
<g>
<path class="st0" d="M316.8,27.26c-16.21-16.23-38.71-26.29-63.47-26.29c-24.76,0-47.25,10.06-63.47,26.29
c-7.04,7.03-12.91,15.24-17.31,24.31c-4.4-9.07-10.28-17.28-17.31-24.31C139.03,11.03,116.54,0.96,91.78,0.97
c-24.76,0-47.25,10.06-63.47,26.29C12.09,43.47,2.02,65.97,2.03,90.72c-0.01,24.76,10.06,47.25,26.29,63.47
c16.21,16.23,38.71,26.29,63.47,26.29c24.76,0,47.25-10.06,63.47-26.29c7.04-7.03,12.91-15.24,17.31-24.31
c4.4,9.07,10.28,17.28,17.31,24.31c16.21,16.23,38.71,26.29,63.47,26.29c24.76,0,47.25-10.06,63.47-26.29
c16.23-16.21,26.29-38.71,26.29-63.47C343.1,65.97,333.03,43.47,316.8,27.26z M202.57,39.95c11.03-11.01,25.55-18.43,41.8-20.45
v62.25h-62.25C184.14,65.5,191.55,50.98,202.57,39.95z M163.01,81.75h-62.25V19.5c16.25,2.02,30.77,9.44,41.8,20.45
C153.57,50.98,160.98,65.5,163.01,81.75z M19.98,90.72C19.98,70.87,28,52.97,41.01,39.95c11.03-11.01,25.55-18.43,41.8-20.45
v142.45c-16.25-2.02-30.77-9.44-41.8-20.45C28,128.47,19.98,110.58,19.98,90.72z M142.55,141.49
c-11.03,11.01-25.55,18.43-41.8,20.45V99.7h62.25C160.98,115.94,153.57,130.47,142.55,141.49z M182.11,99.7h62.25v62.25
c-16.24-2.02-30.77-9.44-41.8-20.45C191.55,130.47,184.14,115.94,182.11,99.7z M304.11,141.49
c-11.03,11.01-25.55,18.43-41.8,20.45V19.5c16.25,2.02,30.77,9.44,41.8,20.45c13.01,13.02,21.03,30.92,21.03,50.77
C325.14,110.58,317.12,128.47,304.11,141.49z"/>
</g>
<g>
<path class="st0" d="M404.82,38.82c0,5.19-1.27,9.14-3.82,11.85c-2.55,2.7-6.28,4.06-11.19,4.06c-4.84,0-8.55-1.36-11.14-4.08
c-2.58-2.72-3.87-6.67-3.87-11.87c0-5.14,1.28-9.06,3.85-11.77c2.57-2.71,6.3-4.06,11.2-4.06c4.91,0,8.64,1.34,11.17,4.03
C403.56,29.66,404.82,33.61,404.82,38.82z M383.58,38.82c0,5.97,2.08,8.95,6.23,8.95c2.11,0,3.68-0.72,4.7-2.17
c1.02-1.45,1.53-3.71,1.53-6.78c0-3.08-0.52-5.36-1.55-6.83c-1.03-1.47-2.58-2.2-4.63-2.2C385.67,29.78,383.58,32.8,383.58,38.82z
"/>
<path class="st0" d="M437.99,33.25c0,3.45-1.02,6.11-3.05,7.99c-2.03,1.88-4.92,2.82-8.67,2.82h-2.34V54.3h-8.34V23.43h10.68
c3.9,0,6.83,0.85,8.78,2.55C437.01,27.69,437.99,30.11,437.99,33.25z M423.93,37.26h1.52c1.25,0,2.25-0.35,2.99-1.05
c0.74-0.7,1.11-1.67,1.11-2.91c0-2.08-1.15-3.12-3.46-3.12h-2.15V37.26z"/>
<path class="st0" d="M466.43,54.3H448.1V23.43h18.33v6.69h-9.99v4.86h9.25v6.69h-9.25v5.83h9.99V54.3z"/>
<path class="st0" d="M506.41,54.3h-10.94L484.2,32.55h-0.19c0.27,3.42,0.4,6.03,0.4,7.83V54.3h-7.39V23.43h10.9l11.23,21.45h0.13
c-0.2-3.11-0.3-5.61-0.3-7.49V23.43h7.43V54.3z"/>
<path class="st0" d="M402.4,106.19h-8.38V93.6h-9.69v12.59h-8.38V75.32h8.38v11.44h9.69V75.32h8.38V106.19z"/>
<path class="st0" d="M433.2,106.19l-1.52-5.79h-10.03l-1.56,5.79h-9.16l10.07-31h11.13l10.2,31H433.2z M429.94,93.56l-1.33-5.07
c-0.31-1.13-0.69-2.58-1.13-4.37c-0.44-1.79-0.74-3.07-0.88-3.84c-0.13,0.72-0.38,1.9-0.75,3.55c-0.37,1.65-1.2,4.89-2.48,9.73
H429.94z"/>
<path class="st0" d="M459.18,94.96v11.23h-8.34V75.32h10.11c8.39,0,12.59,3.04,12.59,9.12c0,3.58-1.75,6.34-5.24,8.3l8.99,13.45
h-9.46l-6.55-11.23H459.18z M459.18,88.68h1.56c2.91,0,4.37-1.29,4.37-3.86c0-2.12-1.43-3.19-4.29-3.19h-1.65V88.68z"/>
<path class="st0" d="M511.5,90.1c0,5.15-1.42,9.12-4.25,11.91c-2.84,2.79-6.82,4.18-11.96,4.18h-9.99V75.32h10.68
c4.95,0,8.78,1.27,11.48,3.8C510.15,81.65,511.5,85.31,511.5,90.1z M502.84,90.4c0-2.83-0.56-4.93-1.68-6.29s-2.82-2.05-5.1-2.05
h-2.43v17.29h1.86c2.53,0,4.39-0.73,5.57-2.21C502.25,95.67,502.84,93.42,502.84,90.4z"/>
<path class="st0" d="M554.7,106.19h-9.86l-2.96-13.45c-0.14-0.56-0.36-1.68-0.67-3.36c-0.3-1.67-0.52-3.07-0.66-4.2
c-0.11,0.91-0.3,2.05-0.55,3.41c-0.25,1.36-0.5,2.61-0.75,3.75c-0.25,1.14-1.27,5.76-3.07,13.85h-9.86l-7.64-30.87h8.04
l3.36,15.48c0.76,3.42,1.28,6.14,1.56,8.17c0.18-1.44,0.51-3.39,0.98-5.85c0.47-2.46,0.91-4.51,1.32-6.12l2.72-11.68h7.73
L547.03,87c0.45,1.87,0.91,4.03,1.37,6.48c0.46,2.45,0.77,4.28,0.93,5.49c0.18-1.56,0.68-4.27,1.5-8.13l3.42-15.52h8.04
L554.7,106.19z"/>
<path class="st0" d="M589.55,106.19l-1.52-5.79H578l-1.56,5.79h-9.16l10.07-31h11.13l10.2,31H589.55z M586.3,93.56l-1.33-5.07
c-0.31-1.13-0.69-2.58-1.13-4.37c-0.44-1.79-0.74-3.07-0.88-3.84c-0.13,0.72-0.38,1.9-0.75,3.55c-0.37,1.65-1.2,4.89-2.48,9.73
H586.3z"/>
<path class="st0" d="M615.54,94.96v11.23h-8.34V75.32h10.11c8.39,0,12.59,3.04,12.59,9.12c0,3.58-1.75,6.34-5.24,8.3l8.99,13.45
h-9.46l-6.55-11.23H615.54z M615.54,88.68h1.56c2.91,0,4.37-1.29,4.37-3.86c0-2.12-1.43-3.19-4.29-3.19h-1.65V88.68z"/>
<path class="st0" d="M659.98,106.19h-18.33V75.32h18.33v6.69h-9.99v4.86h9.25v6.69h-9.25v5.83h9.99V106.19z"/>
<path class="st0" d="M404.82,142.6c0,5.19-1.27,9.14-3.82,11.85c-2.55,2.7-6.28,4.06-11.19,4.06c-4.84,0-8.55-1.36-11.14-4.08
c-2.58-2.72-3.87-6.67-3.87-11.87c0-5.14,1.28-9.06,3.85-11.77c2.57-2.71,6.3-4.06,11.2-4.06c4.91,0,8.64,1.34,11.17,4.03
C403.56,133.45,404.82,137.39,404.82,142.6z M383.58,142.6c0,5.97,2.08,8.95,6.23,8.95c2.11,0,3.68-0.72,4.7-2.17
c1.02-1.45,1.53-3.71,1.53-6.78c0-3.08-0.52-5.36-1.55-6.83c-1.03-1.47-2.58-2.2-4.63-2.2
C385.67,133.57,383.58,136.58,383.58,142.6z"/>
<path class="st0" d="M415.59,127.21h10.77c4.19,0,7.31,0.62,9.34,1.87c2.03,1.25,3.05,3.19,3.05,5.82c0,1.73-0.44,3.21-1.33,4.43
c-0.89,1.22-2.06,2.01-3.5,2.36v0.21c1.91,0.51,3.3,1.35,4.16,2.53s1.29,2.72,1.29,4.6c0,2.8-1.05,5.01-3.16,6.62
c-2.1,1.61-4.97,2.42-8.6,2.42h-12.01V127.21z M423.93,139.06h2.51c1.2,0,2.12-0.25,2.78-0.74c0.65-0.49,0.98-1.22,0.98-2.2
c0-1.73-1.31-2.6-3.93-2.6h-2.34V139.06z M423.93,145.16v6.48h2.94c2.6,0,3.91-1.1,3.91-3.29c0-1.03-0.35-1.82-1.05-2.37
c-0.7-0.55-1.71-0.82-3.03-0.82H423.93z"/>
<path class="st0" d="M471.83,148.7c0,1.92-0.49,3.61-1.46,5.1c-0.97,1.48-2.37,2.64-4.2,3.46c-1.83,0.82-3.98,1.24-6.44,1.24
c-2.06,0-3.78-0.14-5.17-0.43c-1.39-0.29-2.84-0.79-4.35-1.51v-7.43c1.59,0.82,3.24,1.45,4.96,1.91c1.72,0.46,3.29,0.68,4.73,0.68
c1.24,0,2.15-0.21,2.72-0.64c0.58-0.43,0.87-0.98,0.87-1.66c0-0.42-0.12-0.79-0.35-1.11c-0.23-0.32-0.6-0.64-1.12-0.96
c-0.51-0.32-1.88-0.99-4.11-1.99c-2.01-0.91-3.52-1.8-4.53-2.66c-1.01-0.86-1.75-1.84-2.24-2.96c-0.49-1.11-0.73-2.43-0.73-3.95
c0-2.84,1.03-5.06,3.1-6.65c2.07-1.59,4.91-2.39,8.53-2.39c3.19,0,6.45,0.74,9.78,2.22l-2.55,6.44c-2.89-1.32-5.38-1.99-7.48-1.99
c-1.08,0-1.87,0.19-2.36,0.57c-0.49,0.38-0.74,0.85-0.74,1.42c0,0.6,0.31,1.15,0.94,1.63s2.33,1.35,5.1,2.62
c2.66,1.2,4.51,2.48,5.54,3.85C471.31,144.89,471.83,146.62,471.83,148.7z"/>
<path class="st0" d="M501.85,158.08h-18.33v-30.87h18.33v6.69h-9.99v4.86h9.25v6.69h-9.25v5.83h9.99V158.08z"/>
<path class="st0" d="M521.65,146.85v11.23h-8.34v-30.87h10.11c8.39,0,12.58,3.04,12.58,9.12c0,3.57-1.75,6.34-5.24,8.3l8.99,13.45
h-9.46l-6.55-11.23H521.65z M521.65,140.58h1.56c2.91,0,4.37-1.29,4.37-3.86c0-2.12-1.43-3.19-4.29-3.19h-1.65V140.58z"/>
<path class="st0" d="M565.09,127.21h9.33l-10.11,30.87h-9.82l-10.07-30.87h9.38l4.2,15.64c0.87,3.48,1.35,5.9,1.44,7.26
c0.1-0.98,0.3-2.22,0.59-3.69s0.56-2.64,0.78-3.48L565.09,127.21z"/>
<path class="st0" d="M601.89,158.08l-1.52-5.79h-10.03l-1.56,5.79h-9.16l10.07-31h11.13l10.2,31H601.89z M598.64,145.45
l-1.33-5.07c-0.31-1.13-0.69-2.58-1.13-4.37c-0.44-1.79-0.74-3.07-0.88-3.84c-0.13,0.72-0.38,1.9-0.75,3.55
c-0.37,1.65-1.2,4.89-2.48,9.73H598.64z"/>
<path class="st0" d="M633.16,158.08h-8.34v-24.05h-7.54v-6.82h23.39v6.82h-7.52V158.08z"/>
<path class="st0" d="M679.16,142.6c0,5.19-1.27,9.14-3.82,11.85c-2.55,2.7-6.28,4.06-11.19,4.06c-4.84,0-8.55-1.36-11.14-4.08
c-2.58-2.72-3.87-6.67-3.87-11.87c0-5.14,1.28-9.06,3.85-11.77c2.57-2.71,6.3-4.06,11.2-4.06c4.91,0,8.64,1.34,11.17,4.03
C677.89,133.45,679.16,137.39,679.16,142.6z M657.92,142.6c0,5.97,2.08,8.95,6.23,8.95c2.11,0,3.68-0.72,4.7-2.17
c1.02-1.45,1.53-3.71,1.53-6.78c0-3.08-0.52-5.36-1.55-6.83c-1.03-1.47-2.58-2.2-4.64-2.2
C660.01,133.57,657.92,136.58,657.92,142.6z"/>
<path class="st0" d="M697.4,146.85v11.23h-8.34v-30.87h10.11c8.39,0,12.59,3.04,12.59,9.12c0,3.57-1.75,6.34-5.24,8.3l8.99,13.45
h-9.46l-6.55-11.23H697.4z M697.4,140.58h1.56c2.91,0,4.37-1.29,4.37-3.86c0-2.12-1.43-3.19-4.29-3.19h-1.65V140.58z"/>
<path class="st0" d="M733.67,138.65l5.32-11.44h9.04l-10.16,18.81v12.05h-8.4v-11.8l-10.16-19.06h9.08L733.67,138.65z"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 8.4 KiB

555
index.html Normal file
View File

@ -0,0 +1,555 @@
<html>
<head>
<title>Open Source Ecology (OSE) Germany - Entwicklungsplattform</title>
<link href="https://fonts.googleapis.com/css?family=Lora|Open+Sans:400,500,600,700,800,900" rel="stylesheet">
<link rel="stylesheet" href="style.css"/>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<script src="js/jquery-3.3.1.min.js"></script>
<script src="js/oseg-search.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$( function() {
$( "#accordion" ).accordion({
header: "h3", collapsible: true, active: false
});
});
</script>
<script>
$(document).ready(function(){
$("#searchfield-global").focus(function(){
$( ".search-filter-quick" ).slideDown( "slow", function() {});
});
});
</script>
<script>
$(function() {
//caches a jQuery object containing the header element
var header = $(".scroll");
$(window).scroll(function() {
var scroll = $(window).scrollTop();
if (scroll >= 1600) {
header.removeClass('scroll').addClass("fixed");
} else {
header.removeClass("fixed").addClass('scroll');
}
});
});
</script>
</head>
<body>
<!--
<div class="header">
<div class="header-content">
<img src="logo.png" width="72" height="72" alt="Logo"/>
<div class="search">
<form id="search-form">
<input class="search-input" type="text" name="lname">
<input id="search-form-input-clear" class="search__clear js-search-clear" type="button" tabindex="3" value="x">
<button type="submit" value="Submit" id="submitButton">
<i class="fa fa-search"></i>
</button>
</form>
</div>
</div>
</div>
-->
<div class="header-black">
<ul>
<li><a class="logo" href="#"><img src="img/oho-logo-imprint.png" width="47" height="25" /></a></li>
<li><a href="#">news</a></li>
<li><a href="#">about <i class="fas fa-caret-down"></i></a></li>
<li><a href="#">metadata repository <i class="fas fa-caret-down"></i></a></li>
<li><a href="#">list of platforms</a></li>
<li><a href="#">categories <i class="fas fa-caret-down"></i></a></li>
<li><a href="#">menupunkt <i class="fas fa-caret-down"></i></a></li>
</ul>
<div class="clearer">&nbsp;</div>
</div>
<div class="banner">
<img src="img/oho_logo_WHITE.svg" />
</div>
<div class="row headline">
<form class="search-content">
<input class="search-field-content" id="searchfield-global" type="text" name="search" placeholder="What Open Hardware are you looking for?" />
<button type="submit" value="Submit">
<i class="fa fa-search"></i>
</button>
<div class="search-filter-quick">
<a href="#">Refine search <i class="fas fa-caret-up"></i></a> <a href="#">Go to categories...</a>
<div class="clearer">&nbsp;</div>
<select class="search-content-licence">
<option value="licence">Licence</option>
<option value="cc-by-sa-1">CC-BY-SA-1</option>
<option value="cc-by-sa-2">CC-BY-SA-1</option>
<option value="cc-by-sa-3">CC-BY-SA-1</option>
<option value="cc-by-sa-4">CC-BY-SA-1</option>
</select>
<select class="search-content-source">
<option value="licence">Source</option>
<option value="cc-by-sa-1">CC-BY-SA-1</option>
<option value="cc-by-sa-2">CC-BY-SA-1</option>
<option value="cc-by-sa-3">CC-BY-SA-1</option>
<option value="cc-by-sa-4">CC-BY-SA-1</option>
</select>
<select class="search-content-language">
<option value="licence">Language</option>
<option value="cc-by-sa-1">CC-BY-SA-1</option>
<option value="cc-by-sa-2">CC-BY-SA-1</option>
<option value="cc-by-sa-3">CC-BY-SA-1</option>
<option value="cc-by-sa-4">CC-BY-SA-1</option>
</select>
<div class="clearer">&nbsp;</div>
</div>
</form>
<p>OHO is a search engine for open hardware, open design and maker projects.<br />We crawl the web and make its content searchable for you.<br />Start searching and build a better tomorrow.</p>
</div>
<div class="row text-example">
<div class="col-777">
<h1><strong>Headline1</strong></h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie conse co.</p>
<h2>Headline 2 Seed diam nonum</h2>
<p>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie conse</p>
</div>
</div>
<div class="row search-result-example-anton">
<div class="filter-vert">
<h2>Categories</h2>
<div id="accordion">
<h3><i class="red far fa-dot-circle"></i> Agriculture, forest <i class="red fas fa-caret-down"></i></h3>
<div>
<p><i class="red far fa-dot-circle"></i> Drinking Water treatment <br /><i class="red far fa-circle"></i> Recycling<br /><i class="red far fa-circle"></i> Waste water</p>
</div>
<h3><i class="red far fa-circle"></i> Business, industrie <i class="red fas fa-caret-down"></i></h3>
<div>
<p><i class="red far fa-circle"></i> Drinking Water treatment <br /><i class="red far fa-circle"></i> Recycling<br /><i class="red far fa-circle"></i> Waste water</p>
</div>
<h3><i class="red far fa-circle"></i> Computer, electronics <i class="red fas fa-caret-down"></i></h3>
<div>
<p><i class="red far fa-circle"></i> Drinking Water treatment <br /><i class="red far fa-circle"></i> Recycling<br /><i class="red far fa-circle"></i> Waste water</p>
</div>
<h3><i class="red far fa-circle"></i> Environmental technologies <i class="red fas fa-caret-down"></i></h3>
<div>
<p><i class="red far fa-circle"></i> Drinking Water treatment <br /><i class="red far fa-circle"></i> Recycling<br /><i class="red far fa-circle"></i> Waste water</p>
</div>
<h3><i class="red far fa-circle"></i> Health <i class="red fas fa-caret-down"></i></h3>
<div>
<p><i class="red far fa-circle"></i> Drinking Water treatment <br /><i class="red far fa-circle"></i> Recycling<br /><i class="red far fa-circle"></i> Waste water</p>
</div>
<h3><i class="red far fa-circle"></i> Mobility, Logistics <i class="red fas fa-caret-down"></i></h3>
<div>
<p><i class="red far fa-circle"></i> Drinking Water treatment <br /><i class="red far fa-circle"></i> Recycling<br /><i class="red far fa-circle"></i> Waste water</p>
</div>
</div>
</div>
<div class="col-777">
<h1>Suchergebnisgallerie von Anton</h1>
<div class="search-results-anton">
<div class="col-1-4">
<div class="search-results-anton-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
<div class="search-results-anton-item-info">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore ...</p>
<div class="search-results-anton-item-info-tags">
<a href="#"><i class="far fa-clock"></i> 03.04.2017</a>
<a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a><br />
<a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a>
</div>
</div>
</div>
</div>
<div class="col-1-4">
<div class="search-results-anton-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
<div class="search-results-anton-item-info">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore ...</p>
<div class="search-results-anton-item-info-tags">
<a href="#"><i class="far fa-clock"></i> 03.04.2017</a>
<a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a><br />
<a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a>
</div>
</div>
</div>
</div>
<div class="col-1-4">
<div class="search-results-anton-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
<div class="search-results-anton-item-info">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore ...</p>
<div class="search-results-anton-item-info-tags">
<a href="#"><i class="far fa-clock"></i> 03.04.2017</a>
<a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a><br />
<a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a>
</div>
</div>
</div>
</div>
<div class="col-1-4">
<div class="search-results-anton-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
<div class="search-results-anton-item-info">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore ...</p>
<div class="search-results-anton-item-info-tags">
<a href="#"><i class="far fa-clock"></i> 03.04.2017</a>
<a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a><br />
<a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a>
</div>
</div>
</div>
</div>
<div class="col-1-4">
<div class="search-results-anton-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
<div class="search-results-anton-item-info">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore ...</p>
<div class="search-results-anton-item-info-tags">
<a href="#"><i class="far fa-clock"></i> 03.04.2017</a>
<a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a><br />
<a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a>
</div>
</div>
</div>
</div>
<div class="col-1-4">
<div class="search-results-anton-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
<div class="search-results-anton-item-info">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore ...</p>
<div class="search-results-anton-item-info-tags">
<a href="#"><i class="far fa-clock"></i> 03.04.2017</a>
<a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a><br />
<a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a>
</div>
</div>
</div>
</div>
<div class="col-1-4">
<div class="search-results-anton-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h2><span>Aserradero portatil Bolport Rm100</span></h2>
<div class="search-results-anton-item-info">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore ...</p>
<div class="search-results-anton-item-info-tags">
<a href="#"><i class="far fa-clock"></i> 03.04.2017</a>
<a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a><br />
<a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a>
</div>
</div>
</div>
</div>
<div class="clearer">&nbsp;</div>
</div>
</div>
</div>
<div class="row search-result-example-bmen">
<div class="filter scroll">
<div class="filter-content">
<div class="filter-category">
<div class="filter-title"><i class="fas fa-sitemap"></i> Kategorie <i class="fas fa-angle-down"></i></div>
<ul class="filter-selection">
<li><a href="#">Agriculture, forest</a></li>
<li><a href="#">Business, industry</a></li>
<li><a href="#">Computer, electronics</a></li>
<li><a href="#">Environmental technologies</a></li>
<li><a href="#">Health</a></li>
<li><a href="#">Mobility, Logistics</a></li>
<li><a href="#">Renewable energies</a></li>
</ul>
</div>
<div class="filter-release">
<div class="filter-title"><i class="far fa-clock"></i> Ver&ouml;ffentlicht <i class="fas fa-angle-down"></i></div>
<ul class="filter-selection">
<form>
<li><input type="checkbox" id="blue1" /><label for="blue1">Heute</label></li>
<li><input type="checkbox" id="blue2" /><label for="blue2">dieses Jahr</label></li>
<li><input type="checkbox" id="blue2" /><label for="blue3">letztes Jahr</label></li>
<li><input type="checkbox" id="blue2" /><label for="blue4">vorletztes Jahr</label></li>
<li><input type="checkbox" id="blue2" /><label for="blue5">letzten 5 Jahre</label></li>
<li><input type="checkbox" id="blue2" /><label for="blue6">letzten 10 Jahre</label></li>
</form>
</ul>
</div>
<div class="clearer"></div>
</div>
</div>
<div class="search-results-bmen">
<h1>Suchergebnisgallerie von Bastian</h1>
<div class="clearer">&nbsp;</div>
<div class="search-results-bmen-grid">
<div class="search-results-bmen-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h3>Aserradero portatil Bolport Rm100 mejorado para la fabricacion</h3>
<p class="recerpt">Aserradero portatil Bolport Rm100 mejorado para la fabricacion<br />Estimados clientes: La Empresa fabricante de Aserraderos Portátiles Bolport termino la etapa de perfeccionamiento de las ..</p>
<div class="meta-infos">
<div class="language"><img src="img/icon-flag-spain.png" /></div>
<div class="source"><i class="fas fa-user"></i> Timm Wille |</div>
<div class="category"><i class="fas fa-sitemap"></i> Saw mills</div>
</div>
<ul class="short-infos">
<li class="published"><a href="#"><i class="far fa-clock"></i> 03.04.2017</a></li>
<li class="licence"><a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a></li>
<li class="outlay"><a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a></li>
<li class="costs"><a href="#"><i class="fas fa-money-bill"></i> 100 €</a></li>
</ul>
</div>
</div>
<div class="search-results-bmen-grid">
<div class="search-results-bmen-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h3>Aserradero portatil Bolport Rm100 mejorado para la fabricacion</h3>
<p class="recerpt">Aserradero portatil Bolport Rm100 mejorado para la fabricacion<br />Estimados clientes: La Empresa fabricante de Aserraderos Portátiles Bolport termino la etapa de perfeccionamiento de las ..</p>
<div class="meta-infos">
<div class="language"><img src="img/icon-flag-spain.png" /></div>
<div class="source"><i class="fas fa-user"></i> Timm Wille |</div>
<div class="category"><i class="fas fa-sitemap"></i> Saw mills</div>
</div>
<ul class="short-infos">
<li class="published"><a href="#"><i class="far fa-clock"></i> 03.04.2017</a></li>
<li class="licence"><a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a></li>
<li class="outlay"><a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a></li>
<li class="costs"><a href="#"><i class="fas fa-money-bill"></i> 100 €</a></li>
</ul>
</div>
</div>
<div class="search-results-bmen-grid">
<div class="search-results-bmen-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h3>Aserradero portatil Bolport Rm100 mejorado para la fabricacion</h3>
<p class="recerpt">Aserradero portatil Bolport Rm100 mejorado para la fabricacion<br />Estimados clientes: La Empresa fabricante de Aserraderos Portátiles Bolport termino la etapa de perfeccionamiento de las ..</p>
<div class="meta-infos">
<div class="language"><img src="img/icon-flag-spain.png" /></div>
<div class="source"><i class="fas fa-user"></i> Timm Wille |</div>
<div class="category"><i class="fas fa-sitemap"></i> Saw mills</div>
</div>
<ul class="short-infos">
<li class="published"><a href="#"><i class="far fa-clock"></i> 03.04.2017</a></li>
<li class="licence"><a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a></li>
<li class="outlay"><a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a></li>
<li class="costs"><a href="#"><i class="fas fa-money-bill"></i> 100 €</a></li>
</ul>
</div>
</div>
<div class="search-results-bmen-grid">
<div class="search-results-bmen-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h3>Aserradero portatil Bolport Rm100 mejorado para la fabricacion</h3>
<p class="recerpt">Aserradero portatil Bolport Rm100 mejorado para la fabricacion<br />Estimados clientes: La Empresa fabricante de Aserraderos Portátiles Bolport termino la etapa de perfeccionamiento de las ..</p>
<div class="meta-infos">
<div class="language"><img src="img/icon-flag-spain.png" /></div>
<div class="source"><i class="fas fa-user"></i> Timm Wille |</div>
<div class="category"><i class="fas fa-sitemap"></i> Saw mills</div>
</div>
<ul class="short-infos">
<li class="published"><a href="#"><i class="far fa-clock"></i> 03.04.2017</a></li>
<li class="licence"><a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a></li>
<li class="outlay"><a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a></li>
<li class="costs"><a href="#"><i class="fas fa-money-bill"></i> 100 €</a></li>
</ul>
</div>
</div>
<div class="search-results-bmen-grid">
<div class="search-results-bmen-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h3>Aserradero portatil Bolport Rm100 mejorado para la fabricacion</h3>
<p class="recerpt">Aserradero portatil Bolport Rm100 mejorado para la fabricacion<br />Estimados clientes: La Empresa fabricante de Aserraderos Portátiles Bolport termino la etapa de perfeccionamiento de las ..</p>
<div class="meta-infos">
<div class="language"><img src="img/icon-flag-spain.png" /></div>
<div class="source"><i class="fas fa-user"></i> Timm Wille |</div>
<div class="category"><i class="fas fa-sitemap"></i> Saw mills</div>
</div>
<ul class="short-infos">
<li class="published"><a href="#"><i class="far fa-clock"></i> 03.04.2017</a></li>
<li class="licence"><a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a></li>
<li class="outlay"><a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a></li>
<li class="costs"><a href="#"><i class="fas fa-money-bill"></i> 100 €</a></li>
</ul>
</div>
</div>
<div class="search-results-bmen-grid">
<div class="search-results-bmen-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h3>Aserradero portatil Bolport Rm100 mejorado para la fabricacion</h3>
<p class="recerpt">Aserradero portatil Bolport Rm100 mejorado para la fabricacion<br />Estimados clientes: La Empresa fabricante de Aserraderos Portátiles Bolport termino la etapa de perfeccionamiento de las ..</p>
<div class="meta-infos">
<div class="language"><img src="img/icon-flag-spain.png" /></div>
<div class="source"><i class="fas fa-user"></i> Timm Wille |</div>
<div class="category"><i class="fas fa-sitemap"></i> Saw mills</div>
</div>
<ul class="short-infos">
<li class="published"><a href="#"><i class="far fa-clock"></i> 03.04.2017</a></li>
<li class="licence"><a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a></li>
<li class="outlay"><a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a></li>
<li class="costs"><a href="#"><i class="fas fa-money-bill"></i> 100 €</a></li>
</ul>
</div>
</div>
<div class="search-results-bmen-grid">
<div class="search-results-bmen-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h3>Aserradero portatil Bolport Rm100 mejorado para la fabricacion</h3>
<p class="recerpt">Aserradero portatil Bolport Rm100 mejorado para la fabricacion<br />Estimados clientes: La Empresa fabricante de Aserraderos Portátiles Bolport termino la etapa de perfeccionamiento de las ..</p>
<div class="meta-infos">
<div class="language"><img src="img/icon-flag-spain.png" /></div>
<div class="source"><i class="fas fa-user"></i> Timm Wille |</div>
<div class="category"><i class="fas fa-sitemap"></i> Saw mills</div>
</div>
<ul class="short-infos">
<li class="published"><a href="#"><i class="far fa-clock"></i> 03.04.2017</a></li>
<li class="licence"><a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a></li>
<li class="outlay"><a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a></li>
<li class="costs"><a href="#"><i class="fas fa-money-bill"></i> 100 €</a></li>
</ul>
</div>
</div>
<div class="search-results-bmen-grid">
<div class="search-results-bmen-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h3>Aserradero portatil Bolport Rm100 mejorado para la fabricacion</h3>
<p class="recerpt">Aserradero portatil Bolport Rm100 mejorado para la fabricacion<br />Estimados clientes: La Empresa fabricante de Aserraderos Portátiles Bolport termino la etapa de perfeccionamiento de las ..</p>
<div class="meta-infos">
<div class="language"><img src="img/icon-flag-spain.png" /></div>
<div class="source"><i class="fas fa-user"></i> Timm Wille |</div>
<div class="category"><i class="fas fa-sitemap"></i> Saw mills</div>
</div>
<ul class="short-infos">
<li class="published"><a href="#"><i class="far fa-clock"></i> 03.04.2017</a></li>
<li class="licence"><a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a></li>
<li class="outlay"><a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a></li>
<li class="costs"><a href="#"><i class="fas fa-money-bill"></i> 100 €</a></li>
</ul>
</div>
</div>
<div class="search-results-bmen-grid">
<div class="search-results-bmen-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h3>Aserradero portatil Bolport Rm100 mejorado para la fabricacion</h3>
<p class="recerpt">Aserradero portatil Bolport Rm100 mejorado para la fabricacion<br />Estimados clientes: La Empresa fabricante de Aserraderos Portátiles Bolport termino la etapa de perfeccionamiento de las ..</p>
<div class="meta-infos">
<div class="language"><img src="img/icon-flag-spain.png" /></div>
<div class="source"><i class="fas fa-user"></i> Timm Wille |</div>
<div class="category"><i class="fas fa-sitemap"></i> Saw mills</div>
</div>
<ul class="short-infos">
<li class="published"><a href="#"><i class="far fa-clock"></i> 03.04.2017</a></li>
<li class="licence"><a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a></li>
<li class="outlay"><a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a></li>
<li class="costs"><a href="#"><i class="fas fa-money-bill"></i> 100 €</a></li>
</ul>
</div>
</div>
<div class="search-results-bmen-grid">
<div class="search-results-bmen-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h3>Aserradero portatil Bolport Rm100 mejorado para la fabricacion</h3>
<p class="recerpt">Aserradero portatil Bolport Rm100 mejorado para la fabricacion<br />Estimados clientes: La Empresa fabricante de Aserraderos Portátiles Bolport termino la etapa de perfeccionamiento de las ..</p>
<div class="meta-infos">
<div class="language"><img src="img/icon-flag-spain.png" /></div>
<div class="source"><i class="fas fa-user"></i> Timm Wille |</div>
<div class="category"><i class="fas fa-sitemap"></i> Saw mills</div>
</div>
<ul class="short-infos">
<li class="published"><a href="#"><i class="far fa-clock"></i> 03.04.2017</a></li>
<li class="licence"><a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a></li>
<li class="outlay"><a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a></li>
<li class="costs"><a href="#"><i class="fas fa-money-bill"></i> 100 €</a></li>
</ul>
</div>
</div>
<div class="search-results-bmen-grid">
<div class="search-results-bmen-item">
<img src="img/aserradero-portatil-bolport.jpg" />
<h3>Aserradero portatil Bolport Rm100 mejorado para la fabricacion</h3>
<p class="recerpt">Aserradero portatil Bolport Rm100 mejorado para la fabricacion<br />Estimados clientes: La Empresa fabricante de Aserraderos Portátiles Bolport termino la etapa de perfeccionamiento de las ..</p>
<div class="meta-infos">
<div class="language"><img src="img/icon-flag-spain.png" /> </div>
<div class="source"><i class="fas fa-user"></i> Timm Wille |</div>
<div class="category"><i class="fas fa-sitemap"></i> Saw mills</div>
</div>
<ul class="short-infos">
<li class="published"><a href="#"><i class="far fa-clock"></i> 03.04.2017</a></li>
<li class="licence"><a href="#"><i class="fab fa-creative-commons"></i> CC BY-SA</a></li>
<li class="outlay"><a href="#"><i class="fas fa-business-time"></i> 8 Stunden</a></li>
<li class="costs"><a href="#"><i class="fas fa-money-bill"></i> 100 €</a></li>
</ul>
</div>
</div>
</div>
<div class="clearer">&nbsp;</div>
</div>
<div class="row news-example">
<div class="col-777">
<h1>Some very interesting news</h1>
<div class="clearer">&nbsp;</div>
<img style="float:left; margin-right:20px;" src="img/news-thumb.jpg" />
<p style="margin-top:0;">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie conse co.</p>
<h2>Headline 2 Seed diam nonum</h2>
<p>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie conse</p>
</div>
</div>
<div class="footer">
<div class="col-1055">
<div class="col-1-5">
<h3>Categories</h3>
<ul>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
</ul>
</div>
<div class="col-1-5">
<h3>Categories</h3>
<ul>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
</ul>
</div>
<div class="col-1-5">
<h3>Categories</h3>
<ul>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
</ul>
</div>
<div class="col-1-5">
<h3>Categories</h3>
<ul>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
</ul>
</div>
<div class="col-1-5">
<h3>Categories</h3>
<ul>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
<li><a href="#">sit amet</a></li>
</ul>
</div>
<div class="clearer">&nbsp;</div>
</div>
</div>
<div class="imprint">
<p><img src="img/oho-logo-imprint.png" width="36" height="19" /> CC 2019 open hardware observatory&nbsp;&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">imprint</a>&nbsp;&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">legal</a></p>
</div>
</body>
</html>

2
js/jquery-3.3.1.min.js vendored Normal file

File diff suppressed because one or more lines are too long

29
js/oseg-search.js Normal file
View File

@ -0,0 +1,29 @@
$(function(){
$('#search-form-input-clear').click(function(){
$(':input','#search-form')
.not(':button, :submit, :reset, :hidden')
.val('')
.removeAttr('checked')
.removeAttr('selected');
});
});
$(function(){
$('.filter-selection li').click(function() {
$(this).toggleClass("selected");
});
});
// IE9+
$('.row').on('click', function() {
// Clicking on the parent row will toggle the child check box
$('input[type=checkbox]', this).prop('checked', function(i, checked){
return !checked
})
// Add selected class when box is checked
if($('input[type=checkbox]', this).prop('checked'))
$(this).addClass('selected');
else
$(this).removeClass('selected');
});
// Slide in quick filters for searchform

BIN
logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 929 B

657
style.css Normal file
View File

@ -0,0 +1,657 @@
/****** GENERAL ******/
body {
margin:0;
font-family: 'Open Sans', sans-serif;
color:#002b3e;
font-size: 14px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: 900;
line-height: 22px;
}
h1 {
font-size: 18px;
font-weight : bolder;
color:#296178;
border-bottom: 1px #a14032 solid;
display:inline-block;
}
h2 {
font-size: 100%;
margin-bottom:-14px;
font-weight: bold;
}
p {
line-height: 22px;
margin:18px 0;
}
a {
color:#000;
text-decoration: none;
}
a:hover {
color: green;
}
.clearer {
clear: both;
height:0;
line-height: 0;
margin:0;
padding:0;
}
.red {
color: #db513d;
}
.row {
clear: both;
background: #fff;
padding:60px 0;
display: block;
position: relative;
min-width: 777px;
}
.row:nth-child(2n) {
background: #fef0e4;
}
.row::before {
width:120px;
height:20px;
background: #a24033;
display: block;
content: "";
position: absolute;
top: -10px;
left: 0;
}
.row::after {
width:120px;
height:20px;
background: #a24033;
display: block;
content: "";
position: absolute;
top: -10px;
right: 0;
}
.col-777 {
max-width:777px;
margin:0 auto;
}
.col-1055 {
max-width: 1055px;
margin:0 auto;
}
.col-1-4 {
width:22%;
margin-right:20px;
float:left;
position: relative;
min-height: 250px;
}
.col-1-5 {
width:20%;
float:left;
position: relative;
}
/****** HEADER ******/
.header {
background:#86bc24;
margin:0;
padding:5px;
}
.header .header-content {
max-width:1024px;
margin:0 auto;
height:72px;
}
.header .header-content img {
float:left;
display: block;
}
.header .search {
width:500px;
margin:12px 0 0 12px;
float:left;
box-sizing: border-box;
border-radius: 3px;
display: block;
position: relative;
height: 2.8em;
background-color: #fff;
border: 1px solid rgba(0,0,0,0.15);
box-shadow: 0 2px 3px rgba(0,0,0,0.06);
}
.header .search input.search-input {
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
-o-appearance: none;
appearance: none;
-webkit-tap-highlight-color: rgba(0,0,0,0);
font-size: 1.1em;
font-weight: normal;
color: #333;
display: block;
width: 100%;
background: #fff;
outline: none;
border: none;
padding: 4px;
position: relative;
height: 44px;
}
.header .search:hover button#submitButton {
background:#A3C762;
color:#fff;
}
.header .search:hover input#search-form-input-clear,
.header .search search-input:focus input#search-form-input-clear {
opacity: 1;
}
.header .search input#search-form-input-clear {
position: absolute;
top:5px;
right:10px;
background: transparent;
outline: none;
border: none;
font-size:22px;
opacity: 0;
cursor: pointer;
}
.header .search button#submitButton {
position: absolute;
top:-1px;
right:-48px;
border-radius: 0 2px 2px 0;
min-width: 26px;
color: #999;
font-size: 1.25em;
padding: 0 .64em;
height: 45px;
line-height: 1.5;
background-color: #fff;
background-position: 50% 50%;
background-repeat: no-repeat;
-webkit-font-smoothing: subpixel-antialiased;
cursor: pointer;
}
/****** HEADER BLACK ******/
.header-black {
position: fixed;
top: 0;
left: 0;
width: 100%;
background: rgba(0, 0, 0, 0.7);
z-index: 10000;
}
.header-black ul {
max-width:900px;
margin:0 auto;
}
.header-black li {
list-style: none;
float:left;
margin:0;
}
.header-black li a {
color:#fcd4b1;
font-size: 110%;
padding:20px 15px 20px 15px;
display: block;
}
.header-black li a:hover {
background: #296178;
}
/****** FILTER HORIZONTAL ******/
.filter {
background:#a24033;
background: rgba(162, 64, 51, 0.7);
margin:0;
z-index:10000;
}
.filter.fixed {
position: fixed;
top:65px;
}
.filter.scroll {
position: relative;
top:0;
}
.filter .filter-content {
max-width:1024px;
margin:0 auto;
color:#fff;
}
.filter .filter-content div {
cursor: pointer;
position: relative;
border-right:1px #fff solid;
}
.filter .filter-content div.filter-category,
.filter .filter-content div.filter-category ul {
width:320px;
float:left;
}
.filter .filter-content div.filter-release,
.filter .filter-content div.filter-release ul {
width:180px;
float:left;
}
.filter .filter-content div div.filter-title,
.filter .filter-content div ul.filter-selection li a {
padding:5px 10px;
}
.filter .filter-content div div.filter-title .fa-angle-down {
float:right;
margin-top:5px;
}
.filter .filter-content div ul.filter-selection {
position: absolute;
top:29px;
left:0;
z-index:1001;
margin:0;
float:none;
padding:0;
}
.filter .filter-content div ul.filter-selection li {
background: rgba(162, 64, 51, 0.7);
padding:5px 10px;
list-style-type: none;
display:none;
position: relative;
}
.filter .filter-content div ul.filter-selection li.selected,
.filter .filter-content .filter-category:hover ul.filter-selection li,
.filter .filter-content .filter-release:hover ul.filter-selection li {
display: block;
}
.filter .filter-content div ul.filter-selection li a {
color:#fff;
float:none;
}
.filter .filter-content div ul.filter-selection li:hover {
color:#fff;
background: rgba(162, 64, 51, 0.7);
}
.filter .filter-content div ul.filter-selection li.selected,
.filter .filter-content div ul.filter-selection li.selected a,
.filter .filter-content div ul.filter-selection li.selected a:hover {
color:#BFFF4A;
}
/****** FILTER VERTIKAL ******/
.filter-vert {
position:absolute;
top:80px;
left:20px;
width:180px;
min-height:400px;
}
.filter-vert h2 {
background:#296178;
color:#fff;
font-size: 100%;
margin:3px -10px;
padding: 0 10px;
}
.filter-vert h3 {
font-size: 100%;
margin:0;
cursor: pointer;
}
.filter-vert #accordion div,
.filter-vert p {
margin:0;
}
.filter-vert #accordion div {
padding-left:15px;
}
/****** BANNER ******/
.banner {
background: url(img/backgroun01.jpg) 0 0 no-repeat;
padding: 100px 0 40px 0;
}
.banner img {
width:392px;
display: block;
margin: 0 auto;
}
/****** HEADLINE ******/
.headline {
text-align: center;
font-family: 'Lora', serif;
font-style: italic;
font-size: 150%;
line-height: 150%;
}
.headline p {
line-height: 140%;
}
.headline form {
position: relative;
width:550px;
margin:20px auto 40px auto;
}
.headline input.search-field-content {
border:2px #a14032 solid;
border-radius: 8px;
font-size:100%;
padding:10px 40px 10px 10px;
color:#002b3e;
width: 100%;
margin:2px;
}
.headline input.search-field-content:focus {
border:3px #a14032 solid;
outline:none;
margin:1px;
}
.headline .search-filter-quick {
display: none;
}
.headline button {
position: absolute;
color:#a14032;
top:0;
right:0;
border:0;
font-size: 140%;
cursor: pointer;
padding:9px 9px 9px 11px;
margin: 2px 0 0 0;
background: transparent;
border-bottom-right-radius: 8px;
border-top-right-radius: 8px;
}
.headline button:hover {
color:#fff;
background:#a14032;
}
.search-filter-quick {
text-align: left;
padding:0 20px;
}
.search-filter-quick a {
font-family: 'Open Sans', sans-serif;
font-style: normal;
color:#a14032;
font-size: 70%;
}
.search-filter-quick a:last-of-type {
float: right;
}
.headline select {
position: relative;
display: block;
border:2px #a14032 solid;
background: transparent;
width: 150px;
padding: 5px;
font-size: 100%;
line-height: 1;
border-radius: 8px;
height: 45px;
-webkit-appearance: none;
float: left;
margin: 3px 30px 0 0;
}
.headline select:last-of-type {
margin-right: 0;
}
.headline select:focus {
outline:none;
}
.headline select::after {
content:"\f0dc";
font-family: FontAwesome;
color: #000;
padding: 12px 8px;
position: absolute; right: 0; top: 0;
background: red;
z-index: 1;
text-align: center;
width: 10%;
height: 100%;
pointer-events: none;
box-sizing: border-box;
}
/****** FOOTER ******/
.footer {
background: url(img/backgroun02.jpg) 0 0 no-repeat;
padding:60px 0;
}
.footer h3 {
color:#fff;
margin: 4px 0;
}
.footer a {
color:#fcd4b1;
}
.footer a:hover {
color:#a14032;
}
.footer ul {
padding:0;
margin: 0;
}
.footer li {
list-style-type: none;
padding: 2px 0;
margin: 0;
}
/****** IMPRINT ******/
.imprint {
background: #000;
text-align: center;
color:#fcd4b1;
padding:10px 0;
}
.imprint a {
color:#fcd4b1;
}
.imprint a:hover {
color:#a14032;
}
.imprint img {
margin:0 10px -3px 0;
}
/****** SEARCH RESULTS Anton ******/
.search-results-anton-item {
width:100%;
display: block;
position: relative;
}
.search-results-anton-item:hover {
border:1px #a14032 solid;
-webkit-box-shadow: 10px 10px 60px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 10px 60px 0px rgba(0,0,0,0.75);
box-shadow: 10px 10px 60px 0px rgba(0,0,0,0.75);
}
.search-results-anton-item h2 {
position: absolute;
top: 7px;
left: 42px;
margin:0;
z-index: 1001;
width:60%;
}
.search-results-anton-item h2 span {
background:#fff;
display:inline;
padding:2px 5px;
}
.search-results-anton-item:hover h2 {
top:175px;
left: 5px;
width:98%;
}
.search-results-anton-item {
clip-path: inset(0 15% 0 15%);
z-index: 999;
margin-left: -20%;
width:140%;
}
.search-results-anton-item:hover {
position: absolute;
top:-10px;
clip-path: inset(0 0 0 0);
z-index: 1000;
border:1px #a14032 solid;
-webkit-box-shadow: 10px 10px 60px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 10px 60px 0px rgba(0,0,0,0.75);
box-shadow: 10px 10px 60px 0px rgba(0,0,0,0.75);
transition: all 0.1s ease;
}
.search-results-anton-item .search-results-anton-item-info {
background: #fef0e4;
padding:0 10px;
display: none;
}
.search-results-anton-item:hover .search-results-anton-item-info {
display: block;
}
.search-results-anton-item .search-results-anton-item-info-tags {
background: #fcd4b1;
margin: 0 -10px;
padding:10px;
}
/****** SEARCH RESULTS BMEN ******/
.search-results-bmen {
max-width: 1024px;
margin: 40px auto;
}
.search-results-bmen .search-results-bmen-grid {
width:25%;
float:left;
position: relative;
display: block;
min-height: 350px;
margin:20px 0;
}
.search-results-bmen .search-results-bmen-item {
width: 90%;
position: relative;
}
.search-results-bmen .search-results-bmen-item img {
width:100%;
}
.search-results-bmen .search-results-bmen-item h3 {
margin:4 0;
}
.search-results-bmen .search-results-bmen-item .language img {
width:32px;
margin-top:-3px;
}
.search-results-bmen .search-results-bmen-item .meta-infos div {
float:left;
margin:0 5px;
}
.search-results-bmen .search-results-bmen-item .recerpt {
clear:both;
}
.search-results-bmen .search-results-bmen-item .short-infos {
position: absolute;
top:0;
right:10px;
padding:15px 20px 15px 50px;
background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(255,255,255,0.31) 19%, rgba(255,255,255,0.65) 40%);
background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(255,255,255,0.31) 19%,rgba(255,255,255,0.65) 40%);
background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(255,255,255,0.31) 19%,rgba(255,255,255,0.65) 40%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6ffffff',GradientType=1 );
}
.search-results-bmen .search-results-bmen-item .recerpt {
display: none;
}
.search-results-bmen .search-results-bmen-item .short-infos {
opacity:0;
}
.search-results-bmen .search-results-bmen-item .short-infos ul {
padding:0;
display: inline;
}
.search-results-bmen .search-results-bmen-item .short-infos li {
margin: 10px -50px 10px 0;
opacity: 0;
padding:0;
list-style-type: none;
font-size: 140%;
}
.search-results-bmen .search-results-bmen-item:hover {
width: 120%;
position: absolute;
top:-20px;
left:-55px;
cursor: pointer;
z-index: 1000;
padding:20px;
background: #fff;
border: 1px #999999 solid;
border-radius: 10px;
-webkit-box-shadow: 10px 10px 60px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 10px 60px 0px rgba(0,0,0,0.75);
box-shadow: 10px 10px 60px 0px rgba(0,0,0,0.75);
}
.search-results-bmen .search-results-bmen-item:hover .recerpt {
display: block;
}
.search-results-bmen .search-results-bmen-item:hover .short-infos {
opacity: 1;
}
.search-results-bmen .search-results-bmen-item:hover .short-infos li {
opacity: 1;
margin-right:0;
-webkit-transition: all 0.2s ease-in;
-moz-transition: all 0.2s ease-in;
-o-transition: all 0.2s ease-in;
transition: all 0.2s ease-in;
}
/** https://codepen.io/chrisota/pen/rpaLw
*, *:before, *:after { box-sizing: border-box; }
.row{ background: #fff; padding: 20px; position: relative; margin: 0 0 1px 0;
&:hover{
cursor: pointer;
}
&.selected{
background: #f3f3f3;
}
}
label {
cursor: pointer;
&:before{
display: inline-block;
content: "+";
margin: 0 10px 0 0;
width: 35px;
height: 35px;
border: 3px solid $color;
border-radius: 100%;
vertical-align: middle;
color: $color;
font-size: 30px;
text-align: center;
font-weight: 700;
line-height: 0.9em;
transition: transform 0.2s ease-in-out;
}
}
input[type=checkbox]:checked + label:before{
background: $color;
color: #fff;
transform:rotate(135deg);
transform-origin: center center;
}
input[type=checkbox] { visibility: hidden; }
*/