/*
PHONE
*/
@media screen and (max-width: 640px) {

	header {
		overflow: visible !important;
	}

	.logo {
		margin-left: 0px;
		position: absolute;

	}

	nav {
		float: none;
		background: #434343;
		height: 67px;
		margin-top: 0;
		text-align: center;
		position: absolute;
		width: 96%;
		margin-left: 2%;
		top: 120px;
	}

	.head-content .shopping-card-bg {
		top: 50px;
		right: 0;
	}

	nav.opened .sf-menu {
		display: block;
	}

	#menu-trigger {
		display: block;
		margin: 0 auto;
		width: 30px;
		height: 47px;
		padding: 10px 0;
	}

	#menu-trigger span {
		width: 30px;
		height: 5px;
		background: #fff;
		display: block;
		position: relative;
		top: 20px;
	}

	#menu-trigger span:before {
		content: '';
		width: 30px;
		height: 5px;
		background: #fff;
		position: absolute;
		display: block;
		top: -10px;
	}

	#menu-trigger span:after {
		content: '';
		width: 30px;
		height: 5px;
		background: #fff;
		position: absolute;
		display: block;
		bottom: -10px;
	}

	.sf-menu {
		display: none;
		position: relative;
		width: 92%;
		padding-left: 4%;
		padding-right: 4%;
		background: #434343;
		padding-bottom: 20px;
	}

	ul.sf-menu li {
		background-image: none;
	}

	ul.sf-menu > li > ul {
		position: relative;
		top: 0;
		width: 100%;
	}

	ul.sf-menu > li > ul > li {
		padding: 15px 0;
	}

	ul.sf-menu > li {
		width: 100% !important;
		display: block;
		text-align: left;
		height: auto;
		padding-bottom: 15px;
		margin: 0;
	}

	ul.sf-menu > li > ul {
		width: 100%;
	}

	ul.sf-menu > li > ul > li,
	ul.sf-menu > li.sfHover > ul > li {
		width: 100%;
		display: block;
		background-image: none;
		border-bottom: 1px solid #4f4f4f;
		padding: 0;
	}

	ul.sf-menu > li > a {
		height: auto;
		padding: 15px 0;
		background-image: none !important;
	}

	ul.sf-menu > li > a span {
		font-size: 24px;
	}

	.sf-menu li a span {
		padding: 0;
		color: #fff;
		display: block;
	}

	.sf-menu li li a {
		position: relative;
		padding: 15px 0;
	}

	.sf-menu li li a:before {
		content: '-';
		color: #fff;
		display: inline-block;
	}

	.sf-menu li li a span {
		margin-left: 3px;
	}

	ul.sf-menu > li > ul > li a,
	ul.sf-menu > li.sfHover > ul > li a,
	ul.sf-menu > li.sfHover > ul > li a:hover {
		font-family: 'Economica', sans-serif;
		font-size: 18px;
		line-height: 24px;
		display: block;
	}

	.sf-sub-indicator {
		display: block;
		height: 20px;
		width: 30px;
		position: absolute;
		top: 20px;
		right: 63px;
		cursor: pointer;
		background-image: url("../images/bg_direction_nav_topdown.png");
		background-position: bottom left;
	}
	.sf-menu {
		width: 100%!important;
		display: none;
	}
	.sf-menu.xactive {
		display: block!important;
		padding-left: 0;
		padding-right: 0;
	}
	.sf-menu li {
		float: none!important;
		display: block!important;
		width: 100%!important;
	}
	.sf-menu li a {
		float: none!important;
	}
	.sf-menu ul {
		position:static!important;
		display: none!important;
	}
	.xpopdrop ul {
		display: block!important;
	}

	ul.sf-menu > li > a {
		width: 70%;
	}
	ul.sf-menu li.xpopdrop ul {
		display: block !important;
		visibility: visible !important;
	}
	ul.sf-menu > li > ul {
		background-image: none;
	}
	ul.sf-menu li.xpopdrop .sf-sub-indicator {
		background-position: top left;
	}

	.box-8,
	.box-9 {
		width: 100%;
		float: none;
	}

	.box-9 {
		margin-left: 0;
		margin-top: 15px;
	}

	.map.img-border.img-shadow {
		border: none;
		box-shadow: none;
	}

	.box-4 {
		width: 100%;
	}

	.box-5.greyBox {
		width: 96%;
		margin: 20px 0 0;
		padding: 10px 2%;
	}

	.sub #content {
		margin-top: 0;
	}

	.box-5.greyBox a {
		display: block;
		margin: 0 auto;
		width: 264px;
	}

	.eventList li {
		padding: 0;
		width: 100%;
		margin: 10px 0;
		display: block;
		height: auto;
	}

	.eventList li img {
		margin: 0 auto;
		display: block;
		width: 100%;
		height: auto;
	}

	.eventListTeaser {
		padding: 10px 15px;
	}

	body > header {
		height: 320px !important;
	}

	.newsListRightContent h2 {
		line-height: 1;
	}

	.tx-ttnews-browsebox .pagination li {
		margin-bottom: 10px;
	}

	.start .box-5 {
		width: 100%;
	}

	.box-4 {
		padding: 0 0 20px 0;
	}

	.boxIcon img {
		width: 55px;
		height: auto;
	}

	.box {
		height: 220px;
		margin-top: -60px;
	}

	.start #content {
		margin-top: -80px;
	}

	.zebra.zebra-db th {
		display: inline-block;
		width: auto;
	}

	.zebra.zebra-db td {
		display: block;
	}

	.zebra.zebra-db tr td:last-child {
		margin-bottom: 30px;
	}

	.sidebar {
		width: 100%;
	}

	.main-content {
		width: 100%;
	}

	.tx-nfcverleih-pi1 .sub_navigation, .tx-nfcverleih-pi1 .infoBox {
		width: auto;
		margin: 20px 0;
		padding: 15px 3%;
	}

	.tx-nfcverleih-pi1 .verleih-searchbox {
		width: auto;
		margin-top: 45px;
	}

	.verleih-table td.first-field .listContent {
		width: 100%;
	}

	.verleih-single-content {
		width: 95%;
		padding: 10px 2.5%;
	}

	.verleih-single-content img {
		width: 100%;
		height: auto;
	}

	.tabs-nav li a {
		padding: 0 13px;
	}

	.footer-block .newsletter {
		margin: 20px 0 0 0;
	}

	.verleih-table {
		margin: 0;
	}

	.flex-viewport {
		width: 216px;
		margin: 0 auto;
	}
}

/*
PHONE LANDSCAPE
*/
@media screen and (max-width: 480px) {
	.newsListImg {
		margin: 10px 0;
		float: none;
		display: block;
	}

	.newsListImg img {
		display: block;
		margin: 0 auto;
	}

	.verleih-table .last-field {
		width: 100px;
		position: absolute;
		right: 12px;
	}

	.verleih-single-content-top-text {
		position: relative;
		padding-top: 70%;
	}

	.verleih-single-content .moreDetailImages {
		margin: 0;
	}

	.detailimage1 {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
	}
}

@media screen and (min-width: 520px) and (max-width: 640px) {
	.flex-viewport {
		width: 460px !important;
		margin: 0 auto !important;
	}
}

@media screen and (min-width: 641px) and (max-width: 710px) {
	.verleih-single-content-top-text {
		position: relative;
		padding-top: 70%;
	}

	.verleih-single-content .moreDetailImages {
		margin: 0;
	}

	.detailimage1 {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
	}

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

/*
PHONE AND TABLET
*/
@media screen and (max-width: 1024px) {

	body {
		width: 100% !important;
		min-width: 100% !important;
	}

	h2 {
		line-height: 1;
	}

	.logo a img {
		width: 171px;
		height: 107px;
	}

	.container_12 {
		width: 100%;
	}

	.block2 {
		width: 95%;
		padding-left: 2.5%;
		padding-right: 2.5%;
	}

	.slider-block {
		width: 100%;
		left: 0;
		right: 0;
		margin: 0 !important;
	}

	ul.sf-menu {
		margin-right: 1px;
	}

	ul.sf-menu > li {
		margin: 1px 1px 0 20px;
	}

	ul.sf-menu > li > ul {
		right: 0;
		left: auto;
	}

	/*
	ul.sf-menu > li {
		width: 100%;
	}

	ul.sf-menu > li > a {
		width: 100%;
	}
	*/

	.container_12 .grid_12 {
		width: 100%;
	}

	.footer-block {
		width: 100%;
		display: inline-block;
		padding: 39px 0px 0;
	}

	.container_12 .grid_3 {
		width: 44%;
		padding: 0 3%;
		float: none;
		display: inline-block;
		margin: 0 -2px 10px;
	}

	.head-content {
		width: 95%;
	}

	.logo {
		width: 175px;
	}

	.sub #content {
		padding-bottom: 20px;
	}

	.map.img-border.img-shadow {
		width: 100%;
	}

	.map iframe {
		width: 100%;
	}

	div#eventBigSlider {
		width: auto;
		padding: 5px;
	}

	.flexslider .slides img {
		width: 100%;
		height: auto;
		border: none;
	}

	ul.eventsListPrev {
		width: 100%;
		margin: 0 !important;
	}

	.eventsListPrev li,
	.youTubeAndPanoContainer .panoLink {
		width: 46%;
		padding: 10px 2% 0 !important;
		margin: 0 !important;
	}

	.eventsListPrev li img,
	.youTubeAndPanoContainer .panoLink img {
		width: 100%;
		height: auto;
	}

	.youTubeAndPanoContainer .panoLink {
		margin-bottom: 10px !important;
	}

	.news-single-backlink.more {
		margin-top: 15px;
	}

	ul.slides {
		margin: 0;
	}

	.newsListDate {
		float: none;
	}

	body.start .container_12 .grid_12 {
		width: 94%;
		padding: 0 3%;
	}

	.block1 {
		width: 94%;
		padding: 0 3%;
	}

	.box.event,
	.box.messe,
	.box.mobiliar {
		width: 31%;
		margin: 0;
		padding: 0;
	}

	.box.event,
	.box.messe {
		margin-right: 3.5%;
	}

	.boxIcon {
		padding: 52px 0 0;
	}

	.boxIcon img {
		display: block;
		margin: 0 auto;
	}

	.pic {
		background: url(http://www.bb-et.de/uploads/media/header_02.jpg) 50% 50% no-repeat !important;
		width: 100% !important;
	}

	.tx-nfcverleih-pi1 .verleih-leftCol {
		width: 100%;
		float: none;
	}

	.tx-nfcverleih-pi1 .verleih-searchbox input {
		width: auto;
		margin-bottom: 5px;
	}

	.verleih-table {
		width: 100%;
	}

	.verleih-table td.first-field .listContent {
		margin-top: 10px;
	}

	div.verleihHeadlineContainer {
		left: 3%;
	}

	.slider-block img {
		height: auto;
		width: 100%;
	}
}

@media screen and (min-width: 760px) and (max-width: 1024px) {
	.flex-viewport {
		width: 693px !important;
		margin: 0 auto !important;
	}
}


@media screen and (min-width: 641px) and (max-width: 815px) {
	ul.sf-menu > li,
	ul.sf-menu > li > a {
		width: 105px;
	}
}

/*
TABLET
*/

@media screen and (min-width: 641px) and (max-width: 1024px) {

	nav {
		float: right;
		margin-top: 0;
	}

	.head-content .shopping-card-bg {
		right: 0px;
		top: 245px;
	}

	.box {
		margin-top: -100px;
	}

	.tx-nfcverleih-pi1 .sub_navigation, .tx-nfcverleih-pi1 .infoBox {
		width: auto;
		margin: 20px 0;
		padding: 15px 3%;
	}

	.tx-nfcverleih-pi1 .verleih-searchbox {
		width: auto;
		margin: 20px 0 15px 0;
	}

	.verleih-single-content {
		width: 100%;
		margin-top: 20px;
	}

	.csc-default.main-content {
		width: 62%;
		padding-left: 3%;
	}

	.sidebar {
		width: 33%;
		display: inline-block;
		margin: 0 -2px;
	}

	.main-content {
		width: 64%;
		padding-left: 2%;
		display: inline-block;
		margin: 0 -2px;
	}

	.verleih-table {
		margin: 0 0 0 10px;
	}

	.box-8,
	.box-9 {
		width: 46%;
		float: none;
		margin: 0 -2px;
		display: inline-block;
	}

	.box-9 {
		padding-left: 3%;
	}

	.box-8 {
		padding-right: 3%;
	}

	.box-4 {
		width: 57%;
		padding-right: 3%;
	}

	.box-5.greyBox {
		width: 34%;
		padding: 10px 3% 10px;
	}

	.box-5.greyBox img {
		width: 100%;
		height: auto;
	}

	.eventList li {
		padding: 10px 0;
		width: 46%;
		margin: 0 2% 20px !important;
		height: auto;
	}

	.eventList li img {
		margin: 0 auto;
		display: block;
		width: auto;
		max-width: 269px;
	}

	.eventListTeaser {
		padding: 0 10px;
	}

	.tx-ttnews-browsebox .pagination {
		left: 15px;
	}

	.news-list-browse .tx-ttnews-browsebox .pagination {
		clear: left;
		left: 0;
	}

	.start .box-5 {
		width: 40%;
	}

	body > header {
		height: 500px !important;
	}

	.flex-viewport {
		width: 454px;
		margin: 0 auto;
	}
}