/* === ARBEITEN MENU === */


.menu-arbeiten-container { float: right; }
ul.arbeiten-menu { list-style-type: none; }
ul.arbeiten-menu li { display: inline-block; float: left; margin: 0; padding: 0; }
ul.arbeiten-menu li:before { display: none; }
ul.arbeiten-menu li a { color: #009bff; display: block; padding: .2em .8em; margin: 0 .1em; font-size: .9em; border-radius: 40px; }
ul.arbeiten-menu li.current_page_item a { background: #009bff; color: #202935; }
ul.arbeiten-menu li a:hover { background: rgba(0,0,0,0.3); color: #009bff; cursor: pointer; }
ul.arbeiten-menu li a:hover:after { display: none; }


/* === BANNER === */


#banner { height: 50vh; background-color: #fff; background-size: cover; background-position: center center; background-repeat: no-repeat; }


/* === ARTICLES OVERVIEW === */


body.blog { background: #f5f5f7; }

.bloglist { clear: left; }

.blog-title { background: #009bff; display: block; float: left; width: 100%; padding-top: 3em; text-align: center; }
.blog-title h1 { margin-left: .3em; color: #fff; }

#blog-overview { padding: 0; margin: 0; }
#blog-overview h1 { padding-left: 1em; margin-top: 1em; margin-bottom: 0; }

#blog-overview .item { position: relative; padding: 0; margin: 0 0 1.5em 0; width: 100%; background: #fff; }
#blog-overview .item h3, #blog-overview .item p { color: #696056; }
#blog-overview .item:hover h3, #blog-overview .item:hover p { color: #009bff; }
#blog-overview .item .button:hover { background: #696056; }

#blog-overview .clmn.item .meta { position: absolute; top: 0; left: 0; box-sizing: border-box; padding: 1em; background: #696056; color: #fff; font-size: .6em; }

#blog-overview .clmn.item .image { position: relative; border-radius: 0; overflow: hidden; margin-bottom: 0; padding: 0; }
#blog-overview .clmn.item h3 { margin-bottom: 0.5em; margin-top: 1em; line-height: 1.2; }
#blog-overview .clmn.item .excerpt { font-size: .9em; line-height: 1.5; }

#blog-sidebar { padding-top: 4.5em; }
#blog-sidebar .sidebar-widget { width: 100%; float: left; display: block; margin-bottom: 2em; padding-bottom: 2em; border-bottom: 2px dotted #8da67f; }
#blog-sidebar h3 { text-transform: none; font-size: 1.5em; }

#blog-sidebar #searchform .screen-reader-text { display: none; }
#blog-sidebar #searchform input#s { width: 100%; background: #009bff; border-radius: 30px; border: none; padding: .5em 1em; }
#blog-sidebar #searchform #searchsubmit { display: none; }


/* === ARTICLE PAGES === */


/* === BLOG ARTICLES === */


section.blogcontent { padding: 2em 0; }
section.blogcontent h2 { font-size: 2.0em; color: #009bff; margin-bottom: 1em;}
section.blogcontent h3 { font-size: 1.5em; margin-top:1em; margin-bottom: 1em;}
section.blogcontent h2:before { content: "* * *"; display:block; margin:0 auto; margin-top:1em; }
section.blogcontent .col75 { width: calc(72% - 2em); }
section.blogcontent .col75 p { text-align: justify; hyphens:auto;}


/* — BLOG CONTENT — */


.blogcontent .col75 img { display:block; border-radius: 1.5em; overflow:hidden; margin-top:1.5em; margin-bottom:1.5em; }

.blogcontent .col75 .blog-highlight { display: block; border-radius: 1.5em; overflow: hidden; margin-top: 1.5em; margin-bottom: 1.5em; box-sizing: border-box; padding: 1.5em; color: #fff; background: #009bff; }
.blogcontent .col75 .blog-highlight p, 
.blogcontent .col75 .blog-highlight h1, 
.blogcontent .col75 .blog-highlight h2, 
.blogcontent .col75 .blog-highlight h3 { text-align: center; color: #fff; }
.blogcontent .col75 .blog-highlight h1, 
.blogcontent .col75 .blog-highlight h2, 
.blogcontent .col75 .blog-highlight h3 { margin-bottom: .5em; }
.blogcontent .col75 .blog-highlight h2:before { display: none; }
.blogcontent .col75 .blog-highlight .button { background: #fff; color: #004592; }
.blogcontent .col75 .blog-highlight .button.arrow { background-image: url("images/arrow_black.png"); }

.blogcontent .col75 .navigation { display: block; position: relative; width: 100%; margin-top: 2em; padding-top: 2em; border-top: 1px solid rgba(0,0,0,0.2); }
.blogcontent .col75 .navigation .prev-posts { float: left; }
.blogcontent .col75 .navigation .next-posts { float: right; }
.blogcontent .col75 .navigation a { color: #009bff; }
.blogcontent .col75 .navigation a:hover { color: #00bef1; }


/* === PROJECT PAGES === */


body.projekt-single .blogheader { height: 40vh; min-height: 360px; position: relative; display: flex; align-items: center; background-position: center center; background-size: cover !important; padding-top: 2em !important; padding-bottom: 0 !important; }
body.projekt-single .blogheader .blogheader-overlay { z-index: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgb(32,41,53); background: linear-gradient(0deg, rgba(32,41,53,1) 0%, rgba(32,41,53,0.5) 100%);; -webkit-backdrop-filter: saturate(150%) blur(200px); -moz-backdrop-filter: saturate(150%) blur(200px); -o-backdrop-filter: saturate(150%) blur(200px); -ms-backdrop-filter: saturate(150%) blur(200px); backdrop-filter: saturate(150%) blur(200px); }
body.projekt-single .blogheader .inside { z-index: 1; padding-top: 3em; }
body.projekt-single .blogheader .inside p { color: rgba(255,255,255,0.75); border-left: 2px solid #fff; padding-left: 2em; }

body.projekt-single .inside h1 { padding-top: 0; }

body.projekt-single .blogcontent { /* padding-top: 8em; */ padding-top: 0 !important; }
body.projekt-single .blogcontent .intro { font-family: 'merriweatherlight', sans-serif; font-weight: lighter; font-size: 1em; color: #c4cbd4; line-height: 1.6; border-top: 1px solid rgba(255,255,255,0.04); border-bottom: 1px solid rgba(255,255,255,0.04); padding: 2em 0; margin: 2em 0; }
body.projekt-single .blogcontent .projectMeta { margin-top: 1em; font-size: 1em; color: #62646e; padding-bottom: 2em; margin-bottom: 2em; } 
body.projekt-single .blogcontent img { width: 100%; border-radius: 1em; }

body.projekt-single .blogcontent .more-projects { display: block; width:100%; margin-top: 4vw; margin-bottom: 4vw; box-sizing: border-box; padding: 4vw; padding-bottom: 1vw; border-radius: 1em; background-color: rgba(0,0,0,0.15); }
body.projekt-single .blogcontent .more-projects h2 {color: #fff; margin-top: 0; margin-bottom: 2em; }
body.projekt-single .blogcontent .more-projects h2:before { display: none; }
body.projekt-single .blogcontent .more-projects .wp-show-posts .wp-show-posts-inner:hover { background: transparent !important; box-shadow: none !important; }
body.projekt-single .blogcontent .more-projects .wp-show-posts .wp-show-posts-inner h3 { font-size: 1em; color: #fff; }
body.projekt-single .blogcontent .more-projects .wp-show-posts .wp-show-posts-entry-title a { color: #617084; }
body.projekt-single .blogcontent .more-projects .wp-show-posts .wp-show-posts-inner:hover .wp-show-posts-entry-title a { color: #fff; }


/* === WP SHOW POSTS - ARBEITEN === */


.arbeiten .wp-show-posts-columns { }
.arbeiten .wp-show-posts-columns .wp-show-posts-single { }
.arbeiten .wp-show-posts-columns .wp-show-posts-single:hover {  }
.arbeiten .wp-show-posts-columns .wp-show-posts-single .wp-show-posts-inner { border-radius: 0; position: relative; padding: 0; }
.arbeiten .wp-show-posts-columns .wp-show-posts-single .wp-show-posts-inner:hover { background: transparent; transform: none; }

.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(1) .wp-show-posts-inner { border-top-left-radius: 1em; }
.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(2) .wp-show-posts-inner { border-top-right-radius: 1em; }
.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(19) .wp-show-posts-inner { border-bottom-left-radius: 1em; }
.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(20) .wp-show-posts-inner { border-bottom-right-radius: 1em; }
.arbeiten .wp-show-posts-columns .wp-show-posts-single .wp-show-posts-inner .wp-show-posts-image { margin-bottom: 0; transition: all .3s ease-in-out; }
.arbeiten .wp-show-posts-columns .wp-show-posts-single .wp-show-posts-inner:hover .wp-show-posts-image { transform: scale(1.1); }
.arbeiten .wp-show-posts-columns .wp-show-posts-single .wp-show-posts-inner .wp-show-posts-entry-header { position: absolute; opacity: 0; bottom: -100%; left: 0; width: 100%; height: auto; padding: 2em; margin: 0; background: #1a222dd6; color: #fff; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); transition: all .2s ease-in-out; }
.arbeiten .wp-show-posts-columns .wp-show-posts-single:hover .wp-show-posts-inner .wp-show-posts-entry-header { bottom: 0; opacity: 1; }
.arbeiten .wp-show-posts-columns .wp-show-posts-single .wp-show-posts-inner .wp-show-posts-entry-header a { color: #fff; }
.arbeiten .wp-show-posts-columns .wp-show-posts-single .wp-show-posts-inner .wp-show-posts-entry-summary { display: none; }
.arbeiten .wp-show-posts-columns .wp-show-posts-single .wp-show-posts-inner .wpsp-read-more { display: none; }

.arbeiten .wpsp-load-more { }
.arbeiten .wpsp-load-more a.prev,
.arbeiten .wpsp-load-more a.next { display: none; }
.arbeiten .wpsp-load-more .page-numbers { display: inline-block; width: 36px; height: 36px; line-height: 36px; text-align: center; background: rgba(0,0,0,0.2); border-radius: 100%; }
.arbeiten .wpsp-load-more .page-numbers.current { background: #009bff; color: #fff; }
.arbeiten .wpsp-load-more .page-numbers:hover { background: #009bff; color: #fff; }
.arbeiten .wpsp-load-more .page-numbers:hover:after { display: none; }

@media screen and (min-width:1620px) {
	
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(1),
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(2) { width: 100%; margin-bottom: 2em; }
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(1) .wp-show-posts-inner,
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(2) .wp-show-posts-inner { display: block; }
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(1) .wp-show-posts-inner .wp-show-posts-image,
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(2) .wp-show-posts-inner .wp-show-posts-image { display: inline-block; width: 64%; border-radius: 1em; overflow: hidden; padding: 0; margin: 0; transform: none; }
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(1) .wp-show-posts-inner .wp-show-posts-entry-header,
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(2) .wp-show-posts-inner .wp-show-posts-entry-header { display: inline-block; opacity: 1; position: relative; bottom: auto; float: left; margin: 0; width: 30%; height: auto; padding: 0; padding-top: 2em; background: transparent; color: #fff; }
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(1) .wp-show-posts-inner .wp-show-posts-entry-header h4,
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(2) .wp-show-posts-inner .wp-show-posts-entry-header h4 { font-size: 1.2em !important; line-height: 1.3 !important; margin-bottom: 1em !important; }
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(1) .wp-show-posts-inner .wp-show-posts-entry-summary,
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(2) .wp-show-posts-inner .wp-show-posts-entry-summary { display: block; display: inline-block; float: left; width: 30%; font-size: .8em; line-height: 1.4; color: rgba(255,255,255,0.6); }
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(1) .wp-show-posts-inner .wpsp-read-more a,
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(2) .wp-show-posts-inner .wpsp-read-more a { display: block; border: 2px solid #009bff; border-radius: 60px; color: #fff; padding: .3em .8em; }
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(1) .wp-show-posts-inner .wpsp-read-more a:hover,
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(2) .wp-show-posts-inner .wpsp-read-more a:hover { background: #009bff; }
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(1) .wp-show-posts-inner .wpsp-read-more a:hover:after,
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(2) .wp-show-posts-inner .wpsp-read-more a:hover:after { display: none; }
	
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(1) .wp-show-posts-inner .wp-show-posts-image { float: left; }
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(1) .wp-show-posts-inner .wp-show-posts-entry-header { margin-left: 5%; }
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(1) .wp-show-posts-inner .wp-show-posts-entry-summary { margin-left: 5%; }
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(1) .wp-show-posts-inner .wpsp-read-more { display: inline-block; margin-left: 5%; }

	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(2) .wp-show-posts-inner .wp-show-posts-image { float: right; }
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(2) .wp-show-posts-inner .wp-show-posts-entry-header { margin-right: 5%; }
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(2) .wp-show-posts-inner .wp-show-posts-entry-summary { margin-right: 5%; }
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(2) .wp-show-posts-inner .wpsp-read-more { display: inline-block; margin-right: 5%; }

	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(3) .wp-show-posts-inner { border-top-left-radius: 1em; border-top-right-radius: 0; }
	.arbeiten .wp-show-posts-columns .wp-show-posts-single:nth-of-type(4) .wp-show-posts-inner { border-top-right-radius: 1em; }

}

/* === RESPONSIVENESS === */

@media screen and (max-width:1280px) {
	#portfolio .gw-gopf-filter .gw-gopf-cats > span { clear: left; float: left; width: auto; }
	#portfolio .gw-gopf-filter .gw-gopf-cats > span a { font-size: 1.1em; }
	body.projekt-single .blogheader .inside { padding-top: 2em; }
}

@media screen and (max-width:1023px) {
	#arbeiten-menu { margin-top: -2em; text-align: center; }
	ul.arbeiten-menu li { float: none; margin: 3px -4px; }
	ul.arbeiten-menu li a { font-size: 1em; }
	.arbeiten .wp-show-posts-columns .wp-show-posts-single { margin-bottom: 1em; }
	.arbeiten .wp-show-posts-columns .wp-show-posts-single .wp-show-posts-inner { border-radius: 1em; }
	body.projekt-single .blogheader { height: auto; min-height: 0; }
	body.projekt-single .blogheader .inside { padding-top: 0; }
	body.projekt-single .blogheader .inside p { border-left: none; padding-left: 0; }
	body.projekt-single .blogheader .inside .clmn { width: 100%; padding-top: 5em; padding-bottom: 1em; text-align: center; }
}


@media screen and (max-width:720px) {
	body.projekt-single .blogcontent { padding-top: 0; }
}