@media screen and (max-width: 768px) {
		#menu {
			width:1.4em;
			display: block;
			background:#ddd;
			font-size:1.35em;
			text-align: center;
		}
		#mobile-nav.js {
			display: none;
		}
		ul {
			width:100%;
		}
		li {
			width:100%;
			border-right:none;
		}
}

		
@media screen and (min-width: 768px) {
		#menu {
			display: none;
		}
}

@media only screen and (max-width: 768px) {
		#nav  {
			padding-bottom:30px;
			position:absolute;
			height:0px;
		}
}

@media only screen and (max-width: 768px) {
		#nav li:nth-child(3) {
			margin-bottom:45%;
		}
}

@media only screen and (max-width: 768px) {
		#nav ul li {
			float:none;
			height:40px;
			width:100%;
			text-align:left;
			margin-left:20px;
			border-bottom:1px solid #fff;
			
		}
}

@media only screen and (max-width: 768px) {
		#nav ul li li {
			display:block !important;			
		}
}

@media only screen and (max-width: 768px) {
		#mobile-nav {
			background:grey;
		}
}

@media only screen and (max-width: 768px) {
		#hero {
		width:100%;
		height:200px;
		position:relative;
		
		}
}

@media only screen and (max-width: 768px) {
		#slider {
		position:relative;
	}
}

@media only screen and (max-width: 768px) {
		#slider img{
		width: 100%;
		height:200px;
		position: absolute;
		overflow:hidden;
		top:0;
		left:0;
	}
}

@media only screen and (max-width: 768px) {
		#sjena  {
		height:200px; 
		width:100%; 
		background-color:#000; 
		left:0; 
		top:0; 
		position:absolute; 
		z-index:100; 
		opacity:.5;
	}
}

@media only screen and (max-width: 768px) {
		#navi img { 
		visibility:hidden;
		}
}

@media only screen and (max-width: 768px) {
		#natpis { 
		font-size:30px;
		margin-top:-20px;
		width:120%;
		}
}

@media only screen and (max-width: 768px) {
		#natpis span{ 
		visibility:hidden;
		}
}

@media only screen and (max-width: 768px) {
		#next, #prev  {
		visibility:hidden
	}
}

@media only screen and (max-width: 768px) {
		#house-first {
		float:none;
		width:80%;
		padding-top:40px;
		margin:0 auto;
	}
}

@media only screen and (max-width: 768px) {
		#first {
		float:none;
		width:80%;
		padding-top:40px;
		margin:0 auto;
	}
}

@media only screen and (max-width: 768px) {
		#second {
		float:none;
		width:80%;
		padding-top:40px;
		margin:0 auto;
	}
}

@media only screen and (max-width: 768px) {
		#third {
		float:none;
		width:80%;
		padding-top:40px;
		margin:0 auto;
	}
}

@media only screen and (max-width: 768px) {
		#tlocrt{
		margin-top:40px;
		width:80%;
	}
}

@media only screen and (max-width: 768px) {
		#slike img {
		width:32.58%;
		}
}

@media only screen and (max-width: 768px) {
		#opis-apartment {
		float:none;
		width:80%;
		margin:0 auto;
		
		}
}

@media only screen and (max-width: 768px) {
		#slika-apartment {
		float:none;
		width:80%;
		margin:0 auto;
		margin-top:20px;
		}
}

@media only screen and (max-width: 768px) {
		#slika-apartment img{
		width:100%;
		}
}

@media only screen and (max-width: 768px) {
		#sveslike-apartment img{
		width:32.3%;
		}
}

@media only screen and (max-width: 768px) {
		#mapa-apartment{
		float:none;
		width:80%;
		margin:0 auto;
		
		}
}

@media only screen and (max-width: 768px) {
		#calendar-apartment{
		float:none;
		}
}

@media only screen and (max-width: 768px) {
		#calendar-apartment iframe{
		width:300px !important;
		height:900px !important;
		margin:0 auto !important;
		margin-left:40% !important;
		}
}

@media only screen and (max-width: 768px) {
		#price img {
		width:100%;
		}
}

@media only screen and (max-width: 768px) {
		#dist1 > #dist1-div:nth-child(2){
		padding-top:29px;
		}
}

@media only screen and (max-width: 768px) {
		#dist1-div {
		width:49%;
		text-align:center;
		line-height:30px;
		}
}

@media only screen and (max-width: 768px) {
		#dist2 > #dist2-div:nth-child(3), #dist2-div:nth-child(4){
		padding-top:20px;
		}
}

@media only screen and (max-width: 768px) {
		#dist2-div {
		width:50%;
		text-align:center;
		line-height:30px;
		}
}

@media only screen and (max-width: 768px) {
		#dist3 > #dist3-div:nth-child(3), #dist3-div:nth-child(4){
		padding-top:20px;
		}
}

@media only screen and (max-width: 768px) {
		#dist3-div {
		width:50%;
		text-align:center;
		line-height:30px;
		}
}

@media only screen and (max-width: 768px) {
		#dest1 > #dest1-div:nth-child(3), #dest1-div:nth-child(4){
		margin-top:30px;
		}
}

@media only screen and (max-width: 768px) {
		#dest1-div {
		width:50%;
		}
}

@media only screen and (max-width: 768px) {
		#dest2 {
		margin-top:20px;
		}
}

@media only screen and (max-width: 768px) {
		#dest2 > #dest2-div:nth-child(3), #dest2-div:nth-child(4){
		margin-top:30px;
		}
}

@media only screen and (max-width: 768px) {
		#dest2-div {
		width:50%;
		}
}

@media only screen and (max-width: 768px) {
		#dest3 {
		margin-top:20px;
		}
}

@media only screen and (max-width: 768px) {
		#dest3 > #dest3-div:nth-child(3), #dest3-div:nth-child(4){
		margin-top:30px;
		}
}

@media only screen and (max-width: 768px) {
		#dest3-div {
		width:50%;
		}
}

@media only screen and (max-width: 768px) {
		#cont-opis {
		width:80%;
		float:none;
		margin:0 auto;
		}
}

@media only screen and (max-width: 768px) {
		#cont-mapa {
		float:none;
		padding-top:30px;
		width:80%;
		margin:0 auto;
		}
}

@media only screen and (max-width: 768px) {
		#cont-mapa iframe{
		width:100% !important;
		margin:0 auto !important;
		}
}

@media only screen and (max-width: 768px) {
		#copy {
		width:60%;
	}
}