@charset "utf-8";


@media screen and (max-width: 999px) {
	
	body
	{
	
		
	}
	
	#content-main {
		background-image: url("images/bg_sign.jpg");
		background-position: center 30px;;
		background-repeat: no-repeat;
		background-size: 50%;
		margin: auto;
		min-height: 400px;
		padding-bottom: 10px;
		padding-top: 50px;
		width: 100%;
	}
	
	.site-content {
		margin-right: 0;
		margin-top: 0;
		width: 90%;
		padding: 5%;
	}
	
	#logo {
		background-image: url("images/hnh_logo.jpg");
		background-position: 7%;
		background-repeat: no-repeat;
		height: 100px;
		margin: auto;
		width: 100%;
	}
	
	.site-content.with-sidebar {
		margin-right: 0;
		margin-top: 0;
		padding: 5%;
		padding-top: 0%;
		width: 90%;
	}
	
	.widget-area {
		border-left: 0px solid #fff;
		float: left;
		margin-left: 0;
		margin-right: 15px;
		margin-top: 0px;
		padding: 5%;
		padding-top: 0%;
		text-align: left;
		width: 90%;
	}
	
	
	#top {
		background-color: #19171C;
		background-image: url("images/bg_top~.jpg");
		background-repeat: repeat-x;
		background-position:bottom;
		text-align: left;
		width: 100%;
	}
	
	
	#navi {
		margin: auto;
		width: 90%;
		padding: 5%;
		padding-top: 1%;
		height: 30px;
		margin: 0px;
		text-align: center;
	}
	
	
	.menu-main-container {
		overflow: auto;
		height: auto;
		margin: auto;
		text-align: center;
	}
	
	
	#navi ul {
		list-style: outside none none;
		margin: 0;
		padding: 0px;;
		padding-top: 20px;
		float: right;
	}
	
	#navi ul li 
	{
		float: left;
		font-weight: normal;
		height: 35px;
		padding-left: 20px;
		padding-top: 0;
		position: relative;
		width: auto;
	}
	
	#navi ul li:first-last 
	{
		padding-right: 0px;

	}
	
	.main-navigation ul.nav-menu, .main-navigation div.nav-menu > ul {
		display: block !important;
		text-align: left;
	}
	
	.front-teaser 
	{
		background-color: #fff;
		background-image: url("images/teaser-work.jpg");
		background-position: top center;
		background-repeat: no-repeat;
		background-size: 100%;
		border: 0 solid #fff;
		border-radius: 3px;
		box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5);
		height: 160px;
		margin-bottom: 30px !important;
		transition: background 0.5s ease 0s, padding 0.8s linear 0s;
		width: 100%;
	}
	
	.front-teaser .front-title
	{
		width: 100%;
		text-align: center;
		font-size: 18px;
		font-weight: bold;
		padding-top: 120px;
		opacity: 0;
		text-shadow: 1px 1px 2px #000000;
		transition: all 0.5s linear;
	}

	.su-column-size-1-2 
	{
		box-sizing: content-box !important;
		margin-right: 0px !important;
		padding-right: 1%;
		width: 45% !important;
	}
	
	.su-column-size-1-2.last 
	{
		border-right: 0 none;
		padding-left: 4%;
		margin: 0 !important;
		padding-right: 0 !important;
		text-align: justify;
		width: 45% !important;
	}
	
	#content ul.arbeitsgebiete li {
		width: 100%;
	}	
	
	#footer 
	{
		height: auto;
		overflow:auto;
		margin: 0;
		padding: 5%;
		text-align: center;
		width: 90%;
		padding-top: 2%;
	}
	
	
	#footerleft 
	{
		border-right: 0px;
		float: none;
		margin-bottom: 0px;
		overflow: auto;
		padding: 0px;
		text-align: left;
		width: 100%;
		padding-bottom: 2%;
		
	}
	
	#footermid 
	{
		border: 0px;
		border-top: 1px solid #ccc;
		float: none;
		margin-left: 0px;
		overflow: auto;
		padding: 0px;
		text-align: left;
		width: 100%;
		padding-top: 2%;
		padding-bottom: 2%;
	}
	
	
	#footerright 
	{
		border: 0px;
		border-top: 1px solid #ccc;
		float: none;
		margin-left: 0px;
		overflow: auto;
		text-align: left;
		width: 100%;
		padding-top: 2%;
	}
	
}	








@media screen and (max-width: 767px) {
	
	body
	{
	
		
	}
	
	#content-main {
		background-image: url("images/bg_sign.jpg");
		background-position: center 30px;;
		background-repeat: no-repeat;
		background-size: 50%;
		margin: auto;
		min-height: 400px;
		padding-bottom: 10px;
		padding-top: 50px;
		width: 100%;
	}
	
	.site-content {
		margin-right: 0;
		margin-top: 0;
		width: 90%;
		padding: 5%;
	}
	
	#logo {
		background-image: url("images/hnh_logo.jpg");
		background-position: center;
		background-repeat: no-repeat;
		height: 100px;
		margin: auto;
		width: 100%;
	}
	
	.site-content.with-sidebar {
		margin-right: 0;
		margin-top: 0;
		padding: 5%;
		padding-top: 0%;
		width: 90%;
	}
	
	.widget-area {
		border-left: 0px solid #fff;
		float: left;
		margin-left: 0;
		margin-right: 15px;
		margin-top: 0px;
		padding: 5%;
		padding-top: 0%;
		text-align: left;
		width: 90%;
	}
	
	
	#top {
		background-color: #19171C;
		background-image: url("images/bg_top~.jpg");
		background-repeat: repeat-x;
		background-position:bottom;
		height: 210px;
		text-align: left;
		width: 100%;
	}
	
	#navi {
		margin: auto;
		width: 90%;
		padding: 5%;
		padding-top: 0%;
		height: 100px;
	}
	
	#navi ul {
		display: block;
		float:none;
		list-style: outside none none;
		margin: 0;
		padding: 25px 0 0;
	}
	
	#navi ul li {
		display: block;
		float:none;
		font-weight: normal;
		padding: 3px;
		position: relative;
		width: auto;
		border-bottom: 1px solid #555;
		height:auto;
	}
	
	#navi ul li:last-child {
		border-bottom: 0px;
	}
	
	.main-navigation ul.nav-menu, .main-navigation div.nav-menu > ul {
		display: block !important;
		text-align: left;
	}
	
	.front-teaser 
	{
		background-color: #fff;
		background-image: url("images/teaser-work.jpg");
		background-position: top center;
		background-repeat: no-repeat;
		background-size: cover;
		border: 0 solid #fff;
		border-radius: 3px;
		box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5);
		height: 20%;
		margin-bottom: 30px !important;
		transition: background 0.5s ease 0s, padding 0.8s linear 0s;
		width: 95%;
	}
	
	.front-teaser:hover
	{
		background-size: cover;
		-webkit-box-shadow: 0px 0px 7px 0px rgba(0,0,0,1);
		-moz-box-shadow: 0px 0px 7px 0px rgba(0,0,0,1);
		box-shadow: 0px 0px 7px 0px rgba(0,0,0,1);
		cursor:pointer;
	}
	
	.su-column-size-1-2 
	{
		border-right: 0px;
		margin: 0px; !important
		padding: 0px; !important
		padding-left: 1% !important;
		width: 90% !important;
	}
	
	.su-column-size-1-2.last 
	{
		border-right: 0 none;
		padding-left: 1%;
		margin: 0 !important;
		padding-right: 0 !important;
		text-align: justify;
		width: 100% !important;
	}
	
	#content ul.arbeitsgebiete li {
		width: 100%;
	}	
	
	#footer 
	{
		height: auto;
		overflow:auto;
		margin: 0;
		padding: 5%;
		text-align: center;
		width: 90%;
		padding-top: 2%;
	}
	
	
	#footerleft 
	{
		border-right: 0px;
		float: none;
		margin-bottom: 0px;
		overflow: auto;
		padding: 0px;
		text-align: left;
		width: 100%;
		padding-bottom: 2%;
		
	}
	
	#footermid 
	{
		border: 0px;
		border-top: 1px solid #ccc;
		float: none;
		margin-left: 0px;
		overflow: auto;
		padding: 0px;
		text-align: left;
		width: 100%;
		padding-top: 2%;
		padding-bottom: 2%;
	}
	
	
	#footerright 
	{
		border: 0px;
		border-top: 1px solid #ccc;
		float: none;
		margin-left: 0px;
		overflow: auto;
		text-align: left;
		width: 100%;
		padding-top: 2%;
	}
	
}