
/**********************************
Site Name: Homann Güner Blum - 2015
Author: Stephan Simonis
**********************************/

/***************************
Farben:
#ffffff - Hintergrund
#e75511 - hgb Orange
#40454f - Typo
#40454f - Links
#232833 - hover
#232833 - h1-h3
#677081 - heller
***************************/

html {
	height:100%;
	font-size:62.5%;
}

body {
	height:100%;
	font-family:"Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size:16px;
	font-size:1.6rem;
	font-weight:300;
	font-style:normal;
	font-stretch:normal;
	line-height:1.5625;
	color:#657083;
	background:#fff;
	-webkit-font-smoothing:antialiased;
	position:relative;
}

#container {
	margin:0;
}

#content {
	margin:0;
}

#inner-content {
	margin:0;
	margin-left:20px;
	clear:left;
}

img {
	max-width:100%;
	height:auto;
	border:0;
}

header,section,footer {
	width:100%;
	height:auto;
}

#inner-footer {
	margin-left:20px;
}

a,a:visited {
	color:#232833;
	text-decoration:none;
}

a:hover,a:visited:hover {
	color:#677081;
}

b,strong,.strong {
	font-weight:400;
}

h1,h3,h3,h4,h5 {
	text-rendering:optimizelegibility;
	font-weight:400;
	font-style:normal;
	color:#232833;
}

h1 a,h3 a,h3 a,h4 a,h5 a {
	text-decoration:none;
}

h1 {
	font-size:28px;
	font-size:2.8rem;
	line-height:1.25;
	margin-bottom:.375em;
}

h3 {
	font-size:28px;
	font-size:2.8rem;
	line-height:1.25;
	margin-bottom:.375em;
}

h3 {
	font-size:22px;
	font-size:2.2rem;
	line-height:1.364;
	margin-bottom:1.5rem;
}

h4 {
	font-size:18px;
	font-size:1.8rem;
	line-height:1.389;
	margin-bottom:0;
}

h5 {
	font-size:16px;
	font-size:1.6rem;
	line-height:1.563;
	text-transform:uppercase;
	letter-spacing:2px;
}

.header {
	height:200px;
}

.logo {
	width:92px;
	height:90px;
	margin-top:55px;
	margin-right:10px;
	float:right;
	background:url(../images/hgb-logo-dunkel.png);
	background:none,url(../images/hgb-logo-dunkel.svg);
	background-repeat:no-repeat;
	background-size:70% 70%;
	display:block;
}

@media only screen and (min-width: 768px) {
	.logo {
		background-size:85% 85%;
	}
}

@media only screen and (min-width: 1030px) {
	.logo {
		background-size:100% 100%;
	}
}

.navigation {
	margin-top:40px;
	margin-left:20px;
	float:left;
}

.nav {
	border-bottom:0;
	margin:0;
}

.nav li a {
	display:block;
	text-decoration:none;
	color:#657083;
}

.nav li a:hover,.nav li a:focus {
	color:#232833;
}

.nav li ul.sub-menu li a,.nav li ul.children li a {
	padding-left:0;
}

.current-menu-item a,.current-page-parent a {
	color:#e75511!important;
}

menu {
	padding:0 0 0 40px;
}

ol,ul {
	padding:0;
	list-style-type:none;
}


/* .page-id-4376 = Datenschutz */

.page-id-4376 #content ul {
	list-style: circle;
	padding-left: 20px;
}
	.page-id-4376 #content ul li {
		margin-bottom: 10px;
	}



nav ul,nav ol {
	list-style:none;
	list-style-image:none;
}

article.news {
	margin-bottom:80px;
}

article h3,article h1 {
	margin-left:20px;
	margin-right:20px;
}

article .text {
	margin:20px;
	max-width:600px;
}

video {
	width:100%!important;
	height:auto!important;
}

.film embed {
	width:100%!important;
}

.film {
	width:100%;
}

.atelier-film {
	width:100%;
}

.projekt-img,.news-img {
	width:100%;
	height:300px;
	background-repeat:no-repeat;
	background-position:center;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	background-size:cover;
}

article .tags {
	float:left;
	margin:0;
}

article p.ausstellungsdaten {
	font-size:14px;
	font-size:1.4rem;
}

article p.ausstellungsdaten,article footer.article-footer {
	max-width:450px;
}

footer p,footer ul,article footer.article-footer p {
	margin-top:0;
	margin-bottom:0;
}

.tags a:hover,.tags a:visited:hover {
	color:#677081;
	border-bottom:2px solid #e75511;
}

.date {
	float:left;
	color:#677081;
}

.date-liste {
	color:#677081;
}

.projekt-liste div {
	max-width:600px;
	margin-bottom:10px;
}

.projekt-liste a {
	font-weight:400;
}

#auswahl-projekte {
	float:left;
}

.item img {
	width:100%;
	height:auto;
}

.project-tile,.project-tile-no-image {
	margin:0;
	padding:0;
	display:block;
	position:relative;
	width:100%;
	height:auto;
	line-height:0;
	float:left;
}

.project-tile:hover span,.project-tile-no-image:hover span {
	opacity:1;
}

.project-tile span,.project-tile-no-image span {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	padding:10% 1rem 0;
	margin:0;
	text-align:center;
	opacity:0;
	background:rgba(255,255,255,0.85);
	-webkit-transition:200ms opacity ease-out;
	-moz-transition:200ms opacity ease-out;
	transition:200ms opacity ease-out;
}

.project-tile-no-image span {
	opacity:.6;
}

.project-tile span h3,.project-tile-no-image span h3 {
	font-size:18px;
	font-size:1.8rem;
	line-height:1.389;
	margin:0;
}

.project-tile span p,.project-tile-no-image span p {
	font-size:16px;
	font-size:1.6rem;
	line-height:1.563;
	margin:0;
}

.project-tile span p.kunde {
	color:#232833;
}

#masonry-container {
	width:100%;
	float:left;
	margin-top:5px;
}

.projekt-img,.item {
	width:100%;
	border:5px solid transparent;
}

.projekt-text {
	margin-bottom:40px;
}

.projekt-text p {
	margin:20px 40px 10px 20px;
}

.tags {
	margin:0;
}

.gallerie_einspaltig {
	max-width:1024px;
}

.projekt ul {
	list-style:disc;
	margin-left:40px;
}

.pagination,.wp-prev-next {
	margin:1.5em 0;
}

.pagination {
	margin-left:20px;
}

.pagination ul {
	display:inline-block;
	background-color:#fff;
	white-space:nowrap;
	padding:0;
	clear:both;
	border-radius:3px;
}

.pagination li {
	padding:0;
	margin:0;
	float:left;
	display:inline;
	overflow:hidden;
	border-right:1px solid #edeff3;
}

.pagination a,.pagination span {
	margin:0;
	text-decoration:none;
	padding:0;
	line-height:1em;
	font-size:1em;
	font-weight:300;
	padding:.75em;
	min-width:1em;
	display:block;
	color:#232833;
}

.pagination a:hover,.pagination a:focus,.pagination span:hover,.pagination span:focus {
	background-color:#e85410;
	color:#fcfcfc;
}

.pagination .current {
	cursor:default;
	color:#e85410;
}

.pagination .current:hover,.pagination .current:focus {
	background-color:#fff;
	color:#e85410;
}

.wp-prev-next .prev-link {
	float:left;
}

.wp-prev-next .next-link {
	float:right;
}

.mitarbeiter span {
	color:#232833;
	font-weight:400;
}

.kontakt a:hover,.kontakt a:visited:hover {
	color:#e75511!important;
}

.kunden-liste li {
	color:#40454f;
	margin-bottom:10px;
}

.hinweis {
	color:#e75511;
}

.hinweis a,.hinweis a:visited {
	color:#fff;
	background-color:#e75511;
	padding:2px;
}

.hinweis a:hover {
	color:#000!important;
}

.suche {
	max-width:600px;
	padding-top:40px;
	padding-bottom:30px;
}

h1 span.schlagwort {
	color:#fcfcfc;
	background:#e75511;
	padding:0 3px;
}

span.search-everything-highlight {
	border-bottom:2px solid #e75511;
}

.projekt-liste .date-liste a {
	color:#657083;
	font-weight:300;
}

.weitere_tags {
	margin-top:60px;
	max-width:600px;
}

.weitere_tags h3,.weitere_tags a {
	color:#677081!important;
}

.weitere_tags h3 {
	font-size:14px;
	font-size:1.4rem;
}

.weitere_tags a:hover,.weitere_tags a:visited:hover {
	border-bottom:2px solid #e75511;
}

.no-widgets {
	background-color:#fff;
	padding:1.5em;
	text-align:center;
	border:1px solid #677081ccc;
	border-radius:2px;
	margin-bottom:1.5em;
}

.footer {
	clear:both;
	padding-top:100px;
	padding-bottom:30px;
}

@media only screen and (min-width: 768px) {
	.footer {
		padding-top:150px;
	}
}

@media only screen and (min-width: 1030px) {
	.footer {
		padding-top:250px;
	}
}

.footer ul li,.footer ul li a {
	margin:0;
}

.footer .column {
	padding-bottom:50px;
}

.footer .widget_search label {
	display:none;
}

.footer .widget_search {
	max-width:388px;
}

input[type="text"],input[type="password"],input[type="datetime"],input[type="datetime-local"],input[type="date"],input[type="month"],input[type="time"],input[type="week"],input[type="number"],input[type="email"],input[type="url"],input[type="search"],input[type="tel"],input[type="color"],select,textarea,.field {
	display:block;
	height:40px;
	line-height:40px;
	padding:0 12px;
	margin-bottom:14px;
	font-size:1em;
	color:#5c6b80;
	border-radius:3px;
	vertical-align:middle;
	box-shadow:none;
	border:0;
	width:100%;
	max-width:400px;
	background-color:#eaedf2;
	-webkit-transition:background-color .24s ease-in-out;
	transition:background-color .24s ease-in-out;
}

input[type="text"]:focus,input[type="text"]:active,input[type="password"]:focus,input[type="password"]:active,input[type="datetime"]:focus,input[type="datetime"]:active,input[type="datetime-local"]:focus,input[type="datetime-local"]:active,input[type="date"]:focus,input[type="date"]:active,input[type="month"]:focus,input[type="month"]:active,input[type="time"]:focus,input[type="time"]:active,input[type="week"]:focus,input[type="week"]:active,input[type="number"]:focus,input[type="number"]:active,input[type="email"]:focus,input[type="email"]:active,input[type="url"]:focus,input[type="url"]:active,input[type="search"]:focus,input[type="search"]:active,input[type="tel"]:focus,input[type="tel"]:active,input[type="color"]:focus,input[type="color"]:active,select:focus,select:active,textarea:focus,textarea:active,.field:focus,.field:active {
	background-color:#f7f8fa;
}

.widget_search input[type="text"] {
	width:70%;
	float:left;
	height:40px;
}

.widget_search input[type="submit"] {
	width:30%;
	float:right;
	color:#fff;
	height:40px;
	border:none;
	margin:0;
	padding:0;
	background:#ccc;
}

.widget_search input[type="submit"]:hover {
	background:#e75511;
}

.copyright {
	margin-top:20px;
}

@media only screen and (min-width: 481px) {
	body {
		font-size:16px;
		font-size:1.6rem;
	}
	
	#container {
		margin:0 20px;
	}
}

@media only screen and (min-width: 768px) {
	body {
		font-size:18px;
		font-size:1.8rem;
		line-height:1.6666666666667;
	}
	
	#container {
		margin:0 30px;
	}
	
	.header {
		height:160px;
	}
	
	.logo {
		margin-top:30px;
	}
	
	h1,.h1 {
		font-size:32px;
		font-size:3.2rem;
		line-height:1.25em;
	}
	
	h3,.h3 {
		font-size:32px;
		font-size:3.2rem;
		line-height:1.25em;
	}
	
	h3,.h3 {
		font-size:25px;
		font-size:2.5rem;
		line-height:1.36em;
	}
	
	h4,.h4 {
		font-size:20px;
		font-size:2rem;
		line-height:1.25em;
	}
	
	h5,.h5 {
		font-size:18px;
		font-size:1.8rem;
		line-height:1.389em;
	}
	
	.projekt-img,.news-img {
		height:400px;
	}
	
	.project-tile {
		width:50%;
	}
	
	.item {
		width:50%;
	}
	
	.navigation {
		margin-top:50px;
	}
	
	.nav {
		border:0;
	}
	
	.nav ul {
		margin-top:0;
	}
	
	.nav li {
		float:left;
		position:relative;
	}
	
	.nav li a {
		border-bottom:0;
		padding:.75em 1.5em .75em 0;
	}
	
	.footer .nav li a {
		border-bottom:0;
		padding:0;
	}
}

.error404 {
	background-color:#444;
	color:#999;
}

.error404 a,.error404 a:link,.error404 a:visited,.error404 p {
	color:#999;
}

.error404 a:hover {
	color:#fff!important;
}

#post-not-found h1 {
	font-weight:400;
	font-size:3em;
	line-height:.8em;
	margin:0;
	color:#999;
}

#post-not-found h3 {
	font-size:2em;
	margin:0;
	color:#999;
}

#post-not-found {
	text-align:center;
}

#post-not-found #s {
	margin:0 auto;
}

@media only screen and (min-width: 1030px) {
	.footer .column {
		padding-bottom:50px;
	}
	
	.projekt-img,.news-img {
		height:600px;
	}
	
	.project-tile span h3,.project-tile-no-image span h3 {
		font-size:28px;
		font-size:2.8rem;
		line-height:1.25;
		margin-bottom: 5px;
	}
	
	.project-tile span p,.project-tile-no-image span p {
		font-size:18px;
		font-size:1.8rem;
		line-height:1.389;
	}
	
	#post-not-found h1 {
		font-size:6em;
	}
	
	#post-not-found h3 {
		font-size:4em;
	}
}

@media only screen and (min-width: 1240px) {

	#container {
		margin:0 40px;
	}
	
	article .text {
		max-width:800px;
	}
	
	.project-tile {
		width:25%;
	}
	
	.item {
		width:33.33333%;
	}
}


#iframe {
	height:auto;
}

#iframe > body {
	margin:0;
}


@media screen and (max-device-width: 768px) {
	.project-tile {
		margin-bottom:30px;
	}
	
	.project-tile span {
		position:relative;
		height:inherit;
		opacity:1;
		background:none;
		line-height:1;
		padding:0;
	}
	
	.project-tile span h3 {
		font-size:16px;
		font-size:1.6rem;
		line-height:1.563;
		margin:0;
	}
	
	.project-tile span p {
		font-size:14px;
		font-size:1.4rem;
		line-height:1.429;
		margin:0;
		margin-top:10px;
	}
	
	.project-tile span p.kunde {
		margin-top:0;
	}
}

.attachments-browser .attachment {
	width:inherit!important;
}

.attachments-browser .attachment-preview .thumbnail,.attachments-browser .attachment .thumbnail {
	width:inherit!important;
}

* {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

.clearfix:after {
	visibility:hidden;
	display:block;
	font-size:0;
	content:" ";
	clear:both;
	height:0;
}

.clearfix {
	display:inline-block;
}

* html .clearfix {
	height:1%;
}

#wpadminbar {
	position:fixed!important;
}

#nav-btn {
	display:none;
}

@media only screen and (max-width: 768px) {
	.header #nav-btn {
		display:inherit;
		cursor:pointer;
		height:56px;
		opacity:0;
		position:absolute;
		left:17px;
		top:55px;
		width:56px;
		z-index:100;
	}
	
	.header #nav-btn + label {
		display:block;
		height:2px;
		height:56px;
		left:18px;
		position:absolute;
		left:23px;
		top:80px;
		width:40px;
	}
	
	.header #nav-btn + span {
		background-color:#aaa;
		cursor:pointer;
		display:block;
		height:2px;
		position:absolute;
		left:25px;
		top:80px;
		width:40px;
		z-index:99;
	}
	
	.header #nav-btn + span::before,.header #nav-btn + span::after {
		background-color:#aaa;
		content:"";
		display:block;
		height:2px;
		left:0;
		position:absolute;
		width:40px;
	}
	
	.header #nav-btn + span::before {
		top:-12px;
	}
	
	.header #nav-btn + span::after {
		bottom:-12px;
	}
	
	.header #nav-btn:checked + span {
		background-color:#F5060A;
	}
	
	.header #nav-btn + span::before,.header #nav-btn + span::after {
		transition-delay:0.3s,0;
		transition-duration:0.3s,.3s;
	}
	
	.header #nav-btn + span::before {
		transition-property:top,transform;
	}
	
	.header #nav-btn + span::after {
		transition-property:bottom,transform;
	}
	
	.header #nav-btn:checked + span {
		background:none;
	}
	
	.header #nav-btn:checked + span::before {
		top:0;
		transform:rotate(45deg);
	}
	
	.header #nav-btn:checked + span::after {
		bottom:0;
		transform:rotate(-45deg);
	}
	
	.header #nav-btn:checked + span::before,.header #nav-btn:checked + span::after {
		transition-delay:0s,.3s;
	}
	
	.header #nav-btn:checked ~ nav {
		left:0;
		opacity:100;
		position:fixed;
		visibility:1;
		z-index:98;
	}
	
	.header #nav-btn:checked ~ nav ul {
		transform:translate(-50%,-50%);
	}
	
	.header .navigation {
		margin-left:0;
		margin-top:0;
	}
	
	.header nav {
		background:rgba(255,255,255,0.9) none repeat scroll 0 0;
		height:100%;
		opacity:0;
		position:absolute;
		top:0;
		left:0;
		transition:opacity .3s ease 0s,visibility 0 ease .3s;
		visibility:0;
		width:100%;
		z-index:-1;
	}
	
	.header nav ul {
		left:50%;
		moz-transition:all .3s ease-in-out;
		o-transition:all .3s ease-in-out;
		position:absolute;
		top:50%;
		transform:translate(-50%,0%);
		transition:all .3s ease-in-out;
		webkit-transition:all .3s ease-in-out;
	}
	
	.header nav li {
		font-size:30px;
		list-style:none;
		padding-bottom:10px;
		text-align:center;
	}
	
	.header nav ul li a:hover {
		color:#000;
	}
	
	.header nav li a {
		color:#232833;
		text-decoration:none;
	}
}
.cn-button, .cn-button:visited { color: #e75511;  text-decoration: underline; }
.cn-button:hover { color: #e75511; text-decoration: none; }

::selection {
	color:#fcfcfc;
	background:#e75511;
}

#cookie-notice {
	padding-top: 20px;
	padding-bottom: 20px;
	background: rgba(200,200,200,0.9) !important;
	font-size: 120% !important;
	line-height: 1.6 !important;
	color: #000;
}

.cookie-notice-hidden {
	display: none;
}

iframe {
	width: 100%;
	height: 350px;
}
@media only screen and (min-width: 768px) {
	iframe {
		height: 250px;
	}
}

@media only screen and (min-width: 1030px) {
	iframe {
		height: 220px;
	}
}