/*
Theme Name: Gutenberg Intermedia
Theme URI: 
Description: Masterstudiengang an der Fachhochschule Mainz
Author: Melih Bilgil
Author: URI: http://www.lonja.de
Author: Thomas Lempa
Author URI: http://thomaslempa.de
version: 1.0
*/

@import url(reset.css);
@import url(defaults.css);

@font-face {
	font-family: 'EduDiatype Regular';
	src:  url('fonts/EduDiatype-Regular.woff2') format('woff2'),
		  url('fonts/EduDiatype-Regular.woff') format('woff');
	font-display: swap;
  }

/* ----------------------------------------------------- GENERIC */
*{
	max-width: 100%;
}
body {
 color: #000;
 background: #fff;
 font: 14px/120% Georgia, "Times New Roman", Times, serif;
 margin: 16px;
 border: none;
}
a, a:link, a:visited {
 color: #000;
 text-decoration: underline;
}
a:hover, a:active {
 text-decoration: underline;
}
em, i {
 font-style: italic;
}
h1 {
 font-size: 20px;
 padding: 0 0 0 0;
 line-height: 26px;
}
h2 {
 font-size: 14px;
 padding: 0 0 10px 0;
}
.home h2, .blog h2{
	font-size: 20px;
	padding: 0 0 0 0;
	line-height: 26px;
}
.home h2 a, .blog h2 a{
	text-decoration: none;
}
h3 {
 font-size: 20px;
 margin-top: 24px;
 line-height: 20px;
}
#wrapper {
 overflow: hidden;
 max-width: 100%;
}
hr {
 height: 0;
 border: 0;
 border-top: 1px solid #000;
 padding: 0;
}
strong, b {
 font-weight: bold;
}
.only-desktop{
	display: none!important;
}
.left {
 float: left;
}
.right {
 float: right;
}
#load-spinner{
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	margin-top: -8px;
	margin-left: -8px;
	z-index: 100000;
}

/* ----------------------------------------------------- HEADER */
#header {
 height: 85px;
 float: left;
 background: #fff;
 width: 100%;
 position:fixed;
 left: 0;
 top: 0;
 padding: 16px 0 16px 16px;
 z-index: 100000;
}
#logo_wrapper {
 float: left;
}
#logo_wrapper h1 a,
#logo_wrapper h2 a{
	font-family: 'EduDiatype Regular', sans-serif;
	text-decoration: none;
	font-size: 20px;
	line-height: 20px;
	font-weight: normal;
	width: 100%;
	height: 100%;
	display: block;
}
#logo {
 width: 257px;
 height: 80px;
 margin-top: 0px;
 float: left;
}
#logo span {
 display: none;
}
#logofh {
 display: none;
 position: absolute;
 right: 30px;
 top: 16px;
 width: 70px;
 height: 69px;
}
#logofh a{
 width: 100%;
 height: 100%;
 display: block;
 background: #fff url(_img/HSM_Logo.png) no-repeat top left;
 }
#logofh span {
 display: none;
}
#mobile-nav-trigger{
	width: 20px;
	height: 20px;
	position: absolute;
	right: 30px;
	top: 55px;
	cursor: pointer;
}
#menu {
	display: none;
	position: fixed;
	z-index: 9999999;
	top: 85px;
	left: 0;
	right: 0;
	bottom: 0;
	overflow-y: scroll;
	background: #ffffff;
}
#menu a, #menu a:link, #menu a:visited {
 color: #000;
 text-decoration: none;
 text-transform: lowercase;
}
#menu a:hover, #menu a:active {
 text-decoration: underline;
}
#menu li.current_page_item a,
#menu li.current-menu-item a {
 text-decoration: underline;
}
.navigation {
	background: #fff;
	font-size: 14px;
	line-height: 18px;
	display: block;
}
.navigation li {
 display: block;
 padding: 10px 20px;
 border-bottom: 1px solid grey;
}
.navigation li.left{
	width: 100%;
}
.navigation li.current-menu-item,
.navigation li.current-page-ancestor{
	font-weight: bold;
}
.navigation li.current-menu-item a{
	text-decoration: none!important;
}
#seperator_top{
 margin: 70px 0 0 2px;
 height: 1px;
 width: 80px;
 border-top: 1px solid #000;
}
.person-nav{
	margin: 15px 0 50px!important;
}
.person-nav li{
	float: left!important;
	padding: 5px 5px 5px 0!important;
	background: none!important;
	margin: 0!important;
}
.person-nav li::after{
	content: " \\ "!important;
}
.person-nav li a{
	text-decoration: none!important;
}
.person-nav li a:hover{
	text-decoration: underline!important;
}
/* ----------------------------------------------------- CONTENT */
#content {
 	margin-top: 100px;
}
.post {
 position: relative;
 margin: 0 0 40px 0;
 display: inline;
 float: left;
 width: 100%;
}
.post-categories {
    margin-top: 17px;
}
.singlepost {
 position: relative;
 margin: 0 0 80px 0;
 display: block;
 float: left;
 width: auto;
}
.single .singlepost{
	float: none;
}
a.lang {
 position: relative;
 right: 0;
 top: 20px;
 float: right;
 width: auto;
 z-index: 10001;
 color: #fff;
}
a:link.lang {
 color: #fff;
}
.text {
 padding: 16px 0;
 position: static;
 left: 0;
 top: 80px;
 width: 400px;
 background: #fff;
 z-index: 10000;
}
.single .singlepost .text {
	top: 80px!important;
}
.text p{
 padding: 5px 0;
 line-height: 18px;
}
.text h1 a, .text h1 a:link, .text h1 a:visited {
 text-decoration: none;
}
.text h1 a:hover, .text h1 a:active {
 text-decoration: underline;
}
.text h1 a.active {
 text-decoration: underline;
} 
.text blockquote p{
 font-size: 40px;
 line-height: 42px;
 margin: 20px 0;
}
.text p.meta{
 font-size: 12px;
 padding: 4px;
 display: none;
}
.text li {
 margin: 10px 0;
 padding-left: 16px;
 background: transparent url(_img/liste.png) no-repeat 0 0;
}
.person-galerie{
	position: relative;
	min-height: 300px;
	margin-bottom: 20px;
}
.draggable {
 position: static!important;
 float: left;
 width: auto;
 cursor: move;
 background-color: black;
}
.draggable span{
 background: #fff;
 position: absolute;
 left: 0;
 bottom: 0;
 width: 32px;
 height: 32px;
}
.draggable span img{
 cursor: pointer;
}
.draggable img {
 float: left;
}
.draggable p {
 background: #fff;
 position: absolute;
 left: 0;
 top: 0;
 padding: 8px;
 margin: 10px;
}

.draggable blockquote  {
 font-size: 40px;
 line-height: 42px;
 margin: 20px 0;
	}

.special {
 padding: 16px;
 background: transparent url(_img/bg_text.gif) repeat-x center center;
 color: #fff;
}
.special a {
 color: #fff;
}
.comments {
 float: left;
 background: #fff;
 width: 360px;
/* margin: 0 0 0 120px;*/
 position: absolute;
 padding-bottom: 40px;
}
.comments span {
 font-size: 12px;
 line-height: 14px;
 font-style: italic;
 display: block;
}
.comments p{
 width: 346px;
}
.comments hr{
 margin: 4px 0 10px 0;
}
.comments .seperator {
 padding: 20px 0;
}
.addcomment{
 margin-bottom: 20px;
}
.addcomment div{
 padding: 2px 0;
 float: left;
 width: 360px;
}
.addcomment .submit{
 padding: 10px 0 0 256px;
}
#page_navigation {
 width: 400px;
 font-size: 32px;
 font-weight: normal;
 margin: 0 0 40px 16px;
}
#page_navigation a{
 text-decoration: none;
}
#post3092 .text{
	position: static;
}
#post3092 .text h2{
	font-size: 20px;
    padding: 0;
    line-height: 26px;
	margin: 60px 0 20px;
}
#post3090 .draggable{
	display: none;
}
#post3090 .only-mobile .draggable{
	display: block;
	margin-top: 16px;
}

/* ----------------------------------------------------- publications */
.archive #content,
.blog #content {
	width: 960px;
}
.archive .post,
.blog .post{
	-webkit-box-sizing: border-box;
    -moz-box-sizing:    border-box;
    box-sizing:         border-box;
	width: 100%;
	max-width: 480px;
	padding: 10px;
	margin: 0;
	float: left;
	padding-bottom: 40px!important;
}
.archive .post.second-child,
.blog .post.second-child{
	margin-top: 110px;
}
.archive .post .text,
.blog .post .text{
	top: 0!important;
	padding: 0;
	margin: 0 0 20px;
}
.archive .post .text p,
.archive .post .text div,
.archive .post .text ul,
.archive .post .text iframe,
.blog .post .text p,
.blog .post .text div,
.blog .post .text ul,
.blog .post .text iframe{
	display: none;	
}
.archive .post .draggable,
.blog .post .draggable{
	max-width: 400px;
	position: relative!important;
	left: 0!important;
	top: 0!important;
	cursor: pointer;
}
img{
	max-width: 100%;
	height: auto;
}
.archive .post + .clearfix,
.blog .post + .clearfix{
	display: none;
}
.archive #page_navigation,
.blog #page_navigation{
	position: absolute;
	bottom: 0;
}
/* ----------------------------------------------------- SUBSCRIBE */
#subscribe {
 float: left;
 background: #fff;
 width: 360px;
}
#subscribe div {
 padding: 2px 0;
 float: left;
 width: 360px;
}
#subscribe .submit{
 padding: 10px 0 0 256px;
}
.highlight {
 background: #ffff99;
 padding: 5px;
}


/* ----------------------------------------------------- FORMS */
textarea {
 font: 12px/120% Georgia, "Times New Roman", Times, serif;
 width: 342px;
 height: 110px;
 margin: 1px 1px 10px 1px;
 padding: 8px;
 background: #fff;
 border: 1px solid #000;
}
input {
 font: 12px/120% Georgia, "Times New Roman", Times, serif;
 margin: 1px;
 background: #fff;
 width: 260px;
 border: none;
 border-bottom: 1px solid #000;
 float: left;
}
input#submit {
 border: none;
 width: auto;
 font-size: 14px;
}
input#s {
 border: none;
 width: auto;
 font-size: 18px;
 margin: -3px 0 0;
 cursor: pointer;
}
label {
 font-size: 12px;
 display: block;
 float: left;
 margin: 7px 0 0 4px;
 width: auto;
}
/* ----------------------------------------------------- FOOTER */
#footer {
 float: left;
 width: 100%;
 margin-top: 100px;
}
#fh {
 width: 300px; 
 margin: 0px 0 0 16px;
 font-size: 12px;
}
#seperator_bottom{
 margin: 0 0 8px -14px;
 height: 1px;
 width: 80px;
 border-top: 1px solid #000;
}
/* ----------------------------------------------------- WP STATS */
img#wpstats{display:none}

.bestaetigt {background-color: #FFFF00;}



/* ----------------------------------------------------- media queries */
@media only screen and (min-width: 481px) {
	#logo_wrapper h1 a,
	#logo_wrapper h2 a{
		font-size: 28px;
		line-height: 28px;
	}
	#header {
		height: 85px;
	}
	#seperator_top{
		margin: 85px 0 0 2px;
	}
	#content {
		margin-top: 120px;
   	}
	#menu {
		top: 100px;
	}
	.archive .post
	.blog .post{
		padding: 60px 40px!important;
	}

}
@media only screen and (min-width: 768px) {
	
	#logo_wrapper h1 a,
	#logo_wrapper h2 a{
		font-size: 50px;
		line-height: 48px;
	}
	#header {
		height: 130px;
	}
	#seperator_top{
		margin: 125px 0 0 2px;
	}
	#content {
		margin-top: 150px;
   	}
	#menu {
		top: 150px;
	}
	#mobile-nav-trigger{
		width: 25px;
		height: 25px;
	}
	.archive .post,
	.blog .post{
		width: 50%;
	}
	.text{
		padding: 16px;
	}
	.parent-pageid-3092 .text{
		width: 600px;
	}
	.parent-pageid-3092 .draggable.initial-placement{
		left: 450px!important;
	}
	.parent-pageid-3092 .draggable.initial-placement-one{
		left: 300px!important;
		top: 0!important;
	}
	.parent-pageid-3092 .draggable.initial-placement-two{
		left: 560px!important;
		top: 90px!important;
	}

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

	#logo_wrapper h1 a,
	#logo_wrapper h2 a{
		font-size: 36px;
		line-height: 36px;
	}
	#header {
		height: 130px;
	}
	#seperator_top{
		margin: 110px 0 0 2px;
	}
	#content {
		margin-top: 130px;
   	}
	.post {
		margin: 0 0 140px 0;
	}
	.archive .post,
	.blog .post{
		padding-bottom: 110px!important;
	}
	.only-desktop{
		display: inline-block!important;
	}
	#logofh{
		display: block;
	}
	#mobile-nav-trigger{
		display: none;
	}
	#menu {
		display: block;
		float: left;
		width: 385px;
		margin: 10px 0 0 24px;
		position: static;
		overflow-y: visible
	}
	.navigation {
		background: #fff;
		float: left;
		font-size: 14px;
		line-height: 18px;
		width: 100%;
	}
	.navigation li {
		display: inline;
		padding: 0 0 0 3px;
		width: auto;
		border-bottom: none;
	}
	.navigation li a{
		font-size: 18px;
		line-height: 20px;
	}
	.navigation li.current-menu-item,
	.navigation li.current-page-ancestor{
		font-weight: normal;
	}
	.navigation li.current-menu-item a{
		text-decoration: underline!important;
	}
	.navigation li.long {
		padding-right: 190px;
	}
	.navigation li.left.search-wrapper{
		width: 60px;
		padding-top: 1px;
	}
	.navigation li.left::after{
		content: " \ "
	}
	.navigation li.left.search-wrapper::after{
		content: ""
	}
	.navigation li::after{
		content: " \\ "
	}
	.draggable{
		position: absolute!important;
	}
	.person-galerie .draggable{
		position: static!important;
	}
	.text{
		position: relative;
	}
	.text p.meta{
		display: block;
	}

	.only-mobile{
		display: none;
	}
	#post3090 .draggable{
		display: block;
	}
}

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

	.person-galerie{
		margin-bottom: 0;
	}
	.person-galerie .draggable{
		position: absolute!important;
	}

	#logo_wrapper h1 a,
	#logo_wrapper h2 a{
		font-size: 50px;
		line-height: 48px;
	}
	#seperator_top{
		margin: 125px 0 0 2px;
	}
	#content {
		margin-top: 150px;
   	}
}

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

	#menu {
		margin-left: 80px;
	}
	#logofh{
		position: static;
		float: left;
		margin-left: 80px;
	}
}
