.box_header {
  position: relative;
  display: inline-block;
  transform: translateX(100vw); /* startar utanför viewport till höger */
  opacity: 0;
  animation: slideIn 1s cubic-bezier(0.19, 1, 0.22, 1) forwards; /* mjuk easing */
}

@keyframes slideIn {
  0% {
    transform: translateX(100vw);
    opacity: 0;
  }
  60% {
    transform: translateX(-20px); /* liten overshoot för fart */
    opacity: 1;
  }
  80% {
    transform: translateX(10px); /* studsar tillbaka lite */
  }
  100% {
    transform: translateX(0);
     opacity: 1;
  }
}


.no-information {
	border-top: solid;
    border-bottom: solid;
    margin-top: 60px;
    margin-bottom: 80px;
    text-align: center;
    padding: 40px;
	}

.big-margin-bottom {
	margin-bottom: 80px;
}	
	
	.free-puff {
		width: 32%; 
		float: left;
		position: relative;
		margin-top: 10px;
		margin-right: 10px;
		margin-bottom: 20px;
		
	}
		
	.free-small-image {
		width: 100%;
		height: 200px;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		display: block;
	}
	
	.free-puff h3 {
		
    position: absolute;
    top: 0px;
    background: var(--isvit);
    padding: 5px;
    font-size: 14px;
		}
	
	
	
	.link-rent {
		width: 360px;
		height: 30px;
	}
	
	.rent-link {width: 180px;
		text-align: center;
		padding: 10px;
		background: var(--himmelspastell);
		color: var(--djup-gran);
	}
	
	.object-link {width: 180px;
		text-align: center;
		padding-left:20px;
		padding-right: 20px;
		background:var(--salviagron);
		color: var(--djup-gran);
		transition: background 0.3s ease, color 0.3s ease;
		border-radius: 20px;
		padding-top: 10px;
		padding-bottom: 10px;
	}
	
	.object-link a {
		text-decoration: none;
		color: inherit;
	}
	
	.icon_se_lokal {
		position: relative;
		top: 6px;
		margin-right: 10px;
	}
	
		
	.object-link:hover  {
  background: var(--djup-gran);
  color: var(--salviagron);
}

.object-link:hover .icon_se_lokal {
  color: var(--isvit);
  fill: var(--isvit);
}
	
	
	
	

	.number_of_room_puff {
    background:rgba(54, 54, 54, 0.67);
    position: relative;
    width: 99px;
    position: absolute;
    right: 0;
    top: 0;
	}

	
	.number_of_room_puff p {
		color: #fff;
		padding: 0;
		text-align: center;
		font-weight: 600;
		
	}
	
.desktop-brand-image-start  {
	position: relative;
	top: 0px;
	width: 100%;
	margin-bottom: 40px;
	background-repeat: no-repeat;
	background-position: top;
	height: 60vh;
	background-size: cover;
}

.mobil-brand-image-start {
	position: relative;
	top: 0px;
	width: 100%;
	margin-bottom: 40px;
	background-repeat: no-repeat;
	background-position: top;
	height: 50vh;
	background-size: cover;
}

.push-down {
    height: 70px;
}

.big_number {
    font-size: 30px;
    position: relative;
    padding: 5px;
    background: #fff;
    margin-right: 5px;
    top: 6px;
}	


	.plan {
		float: left;
		margin-bottom: 40px;
		border-top-color: rgba(0, 0, 0, 0.47);
		border-top-style: solid;
		border-top-width: 1px;
		padding-right: 40px;
		margin-top: 20px;
	} 
	
	.plan h4 {
		font-size: 22px;
		margin-bottom: 0px;
		margin-top: 10px;
		
	}
	
	.plan p {margin-bottom: 20px;}
	
a.plan-button {
    border-radius: 25px;
    background-color: #8bec77;
    width: 160px;
    height: 40px;
    z-index: 60;
    border: none;
    text-decoration: none;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    text-transform: uppercase;
    color: black;
    transition: all 0.5s ease-out;
}

a.plan-button:hover {
	color: #fff;
	background: #194100;
}


.listing {
   
    padding-top: 60px;
    padding-bottom: 40px;
}

.toppbild-desktop img {width: 100%;}	

.mobil-brand-image-start {display: none;}
	
	
@media only screen and (max-width: 1129px) {

.free-puff {width: 50%;}
.free-small-image {
    width: 500px;
    height: 300px;
}

}	


@media only screen and (max-width: 1048px) {

.free-puff {width: 50%;}
.free-small-image {
    width: 443px;
    height: 280px;
}
}	


@media only screen and (max-width: 940px) {

.free-puff {width: 100%;}
.free-small-image {
    width: 100%;
    }
.mobil-brand-image-start {display: block;}
.desktop-brand-image-start  {display: none;}

.push-down {
    height: 50px;
}




}