@charset "utf-8";

body{
	font-weight: 400 !important;
	font-size: 14px !important;
}

#leftcol {
	position: -webkit-sticky; 
	position: sticky;
	top:150px; 
}

#rightcol {
	padding-left:50px; 
}

#whg-container {
	margin-top:12px; 
}

#table-wohnungen_filter {
	display:none;
	height:0px; 
}

#table-wohnungen {
	font-size:14px !important; 
}

#table-wohnungen a {
	text-decoration:none!important;
	background-color:transparent !important;
}

#table-wohnungen a:hover .fa {
	color:#6AA347 !important; 
}

table.dataTable {
	/*background-color:#D8E6D0 !important; 
	background-color:#F0F0F0 !important; */
	border-top:1px solid #111; 
}

label {
	font-weight:400 !important;
	margin-right:30px;
}

.tdfrei { color:#6AA347 !important;  }


.fa {
	font-size:1.5em;
	color:#868686;
} 
.fa-envelope, .fa-file-pdf {
	color:#7C454E !important;
}

.fititle {
	font-weight:700; 
	margin-bottom:6px; 
}

.btn-group {
	background-color:#ECECEC;
	padding:8px 4px 8px 10px;  
}

.more {
	color:#7C454E !important;
	font-weight:500 !important; 
}

#info {
	width:100%;
	height:auto;
	overflow:hidden; 
	margin-bottom:0px; 
}

#table-wohnungen_info {
	float:left;
	width:60%; 
	clear:none !important; 
	font-size:14px !important;
}

#table-wohnungen_length {
	float:right;
	width:185px; 
	clear:none !important; 
	font-size:14px !important;
}

#table-wohnungen_length label {
	margin-right:0px !important;
}


/* CHECKBOXES  */

/* Hide the browser's default checkbox */
.wrap-checkb {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 14px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
float:left;
	margin-right:30px; 
}


.wrap-checkb input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: transparent;
	border: solid #212121 1px;
}

/* On mouse-over, add a grey background color */
.wrap-checkb:hover input ~ .checkmark {
  background-color: #D6B5BB;
}

/* When the checkbox is checked, add a blue background */
.wrap-checkb input:checked ~ .checkmark {
  background-color: #7C454E;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.wrap-checkb input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.wrap-checkb .checkmark:after {
  left: 9px;
  top: 5px;
  width: 7px;
  height: 12px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

a.pheading-opener, a.pheading-opener:hover, a.pheading-opener:visited {
	color:#111 !important; 
	text-decoration:none !important; 
}


.option-set {
	width:100%;
	height:auto;
	overflow:hidden;
	margin-bottom:20px !important; 
}

.option-set:last-child {
	margin-bottom:0px !important; 
}


#group-house label, #group-zimmer label {
	width:50% !important;
	margin-right:0px !important; 
}



/* TABELLE WOHNUNGEN */
tr.vermietet td:nth-child(5), tr.vermietet td:nth-child(6), tr.vermietet td:nth-child(7), tr.vermietet td:nth-child(8), tr.vermietet td:nth-child(10), tr.vermietet td:nth-child(11) {
	/*color: transparent !important;*/
}

tr.vermietet td:nth-child(10) .fa, tr.vermietet td:nth-child(11) .fa {
	/*color: transparent !important;*/
}

tr.vermietet td:nth-child(6)  {
	font-size:0px !important;
	color: transparent !important;
}

.table-hover > tbody > tr:hover > td, .table-hover > tbody > tr:hover > th {
	background-color: #E7D4D7 !important;
}


.ce { text-align:center !important; }
.re { text-align:right !important; padding-right:5% !important;  }


#legende { margin-top:50px; }


table.dataTable thead th, table.dataTable tfoot th {
	color:#111 !important;
	font-weight:700 !important; 
	
}

.table-striped > tbody > tr:nth-child(2n+1) > td, .table-striped > tbody > tr:nth-child(2n+1) > th {
	background-color: #ECECEC;
}

.n0 {
	display:none !important; 
}




/* MODAL WINDOW : DETAILANSICHT WOHNUNG */
.modal-dialog {
	width: 700px;
}

.modal-body, .modal-body table {
	font-size:16px !important;
	line-height:160% !important; 
}

.img-container img {
	margin-top:5px; 
	width:82% !important;
	height:auto; 
}

.modal-body .table thead > tr > th, 
.modal-body .table tbody > tr > th, 
.modal-body .table tfoot > tr > th, 
.modal-body .table thead > tr > td, 
.modal-body .table tbody > tr > td, 
.modal-body.table tfoot > tr > td {
	padding: 4px 2px !important;
	line-height: 1.3 !important;
	border-top: 1px solid #E8E8E8 !important;
}

.modal-body table {
	border-bottom: 1px solid #E8E8E8 !important;
}

.modal-body h3 {
	margin-bottom:14px !important; 
}

#mprint {
	position:absolute;
	left:20px; 
	bottom:22px; 
}

.close {
	position:absolute;
	right:20px;
	top:15px;
	font-size: 36px;
	font-weight: bold;
	z-index:1060; 
}

.tdright {
	/*width:60px;
	text-align:right; */
}

.modal-footer {
	padding: 0px 20px 15px 20px !important; 
	margin-top: 0px !important;
	text-align: right;
	border-top: none !important;
}




@media screen and (max-width: 1040px) { 
	#rightcol {
		padding-left:15px; 
	}
	
	.checkblabel {
		display:none; 
	}
	
}




@media screen and (max-width: 860px) { 
	#leftcol {
	position: relative !important;
	top:0px; 
	width:100%;
	float:none !important;
	}

	#rightcol {
		padding-left:15px; 
		width:100%;
		float:none !important;
	}
	
	table.dataTable {
		width: 100% !important;
	}	
	

	#filter-head {
		display:block;
		cursor:pointer;
	}
		
	.openfilter {
		display:inline-block;
		position:absolute;
		right:10px;
		top:6px;
		transform: rotate(0deg);
		transition: .3s;
	}

	.rotate {
		transform: rotate(-180deg);
		transition: .3s;
	}
	
	#filter-inner {
		display:none; 
		margin-top:6px; 
	}
	
	 #group-zimmer label {
		width: 16% !important;
		margin-right: 0px !important;
	}
	
	#group-house label {
		width: 20% !important;
		margin-right: 0px !important;
	}
	
	.btn-group {
		width:100%;
	}
	
	.option-set {
	margin-bottom: 8px !important;
	}
	
}

@media screen and (max-width: 720px) {  
	.modal-dialog {
		width: 100% !important; 
	}
}


@media screen and (max-width: 680px) { 
	
	.table thead > tr > th, .table tbody > tr > th, .table tfoot > tr > th, .table thead > tr > td, .table tbody > tr > td, .table tfoot > tr > td {
	  border-top: 0px solid transparent;
	  padding: 2px;
	}
	
	.table th { font-weight:600 !important; }
	.tablesaw-cell-label {  font-weight:400 !important;}
	
	.table td:first-child .tablesaw-cell-content { /*font-weight:700;*/ }
	#table-wohnungen tr:last-child td {  border-bottom: 0px solid transparent; }
	
	.fititle {
		display:block;
		clear:both;
	}

}


@media screen and (max-width: 641px) { 
	
	#wrap-illu { display:none; }

	.tablesaw-stack tbody tr td:nth-child(2) {  padding-top:8px !important;	}
	.tablesaw-stack tbody tr td:last-child {  padding-bottom:10px !important; border-bottom:1px solid rgba(179,179,179,1.00) !important; 	}
	
	
	.table-striped > tbody > tr:nth-child(2n+1) > td, .table-striped > tbody > tr:nth-child(2n+1) > th { background-color: transparent; }
	.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {  background-color: transparent; }
	
	#table-wohnungen td.re { text-align:left; }
	#table-wohnungen td.mi, #table-wohnungen th.mi  { text-align:left;  }
	
	tr.vermietet .tablesaw-cell-label { color:#111 !important; }
	
	
	.tablesaw-stack td .tablesaw-cell-label, .tablesaw-stack th .tablesaw-cell-label {
		display: block;
		padding: 0 .4em 0 0 !important;
		width: 45% !important;
	}
	
	.ce, .re {	text-align: left !important; } 
	
	.tdfrei .tablesaw-cell-label { color:#111 !important; }
	.tdfrei .tablesaw-cell-content { font-weight:700 !important;  }
}




@media screen and (max-width: 620px) { 
	#table-wohnungen tr:nth-child(even) {/*background: #F9ECD8 !important;*/ }
	#table-wohnungen tr:nth-child(odd) {background:#EBEBEB !important; }
	.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {  background: inherit  !important; }
	
	table.dataTable tbody th, table.dataTable tbody td {
		padding: 2px 3px !important;
	}	
	
	table.dataTable td.contact {
		border-bottom:1px solid #ccc; 
	}
	
	#group-zimmer label {
		width: 25% !important;
	}
	
}