/*
Theme Name: Beaver Builder Child Theme
Theme URI: http://www.wpbeaverbuilder.com
Version: 1.0
Description: An example child theme that can be used as a starting point for custom development.
Author: The Beaver Builder Team
Author URI: http://www.fastlinemedia.com
template: bb-theme
*/

/* Add your custom styles here... */ 


/*MEDIASCREEN STÖRRE SKÄRMAR*/
@media only screen and (min-width: 1513px) {
	
}

/*MEDIASCREEN BÄRBAR DATOR*/
@media only screen and (min-width: 1100px) and (max-width: 1512px) {
	
}

/*MEDIASCREEN SURFPLATTOR*/
@media only screen and (min-width: 769px) and (max-width: 1099px) {
	
}

/*MEDIASCREEN MOBILER*/
@media only screen and (max-width: 768px) {

}



/*------------------------------------- Anpassning av fontfamiljer --------------------------------------------*/








/*------------------------------------- Generellt --------------------------------------------*/

.fl-row {
	background:white;
}








/*------------------------------------- xxxXXXXXXXXXXxxx --------------------------------------------*/

/* Mörk bakgrundsfilter för kolumnen */
.hover-row .mork-kolumn {
    position: relative; /* Gör så att vi kan lägga filtret ovanpå */
}

/* Pseudoelement för att skapa filtret */
.hover-row .mork-kolumn::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.2); /* Mörkt filter */
    z-index: 1; /* Sätt filtret ovanpå bakgrunden */
    transition: background-color 0.3s ease; /* Gör att effekten går smidigt */
}

/* När du hovrar över raden tas filtret bort */
.hover-row:hover .mork-kolumn::before {
    background-color: rgba(0, 0, 0, 0); /* Ta bort filtret vid hover */
}





/*------------------------------------- produktboxar --------------------------------------------*/

.pp-content-post .produkter-huvud-div   {
 
	height: 100%;
}

.produkter-box {
    width: 100%;
	display: flex;
flex-direction: column;
}

.produkter-box-bild {
	width:100%;
}

.produkter-box-bild img {
    height: 200px;
    width: 100%;
    object-fit: cover;
}

/* Standard bakgrund för textrutor - grön */
.produkter-box-textbox {
    background: #89A456; /* Grön bakgrund */
    color: white;
    justify-content: center;
    padding: 15px;
    transition: background 0.3s ease;
	display: flex;
	flex-grow: 1;
}

/* För alla textrutor vid hover - vit bakgrund */
.pp-content-post:hover .produkter-box-textbox {
    background: white;
    color: #89A456;
}

.produkter-box-textbox .h6 {
    margin: 0px;
	text-transform: uppercase;
}

/* Lägg till positionering på .pp-content-post och overflow för att skuggan ska synas */
.pp-content-post .produkter-box{
    position: relative; /* Viktigt för att box-shadow ska fungera korrekt */
    overflow: visible; /* Gör så att skuggan inte klipps av */
    margin: 20px; /* För att ge extra utrymme om skuggan klipps av */
}

/* Lägg till skugga vid hover på .pp-content-post */
.pp-content-post:hover .produkter-box {
    box-shadow: 6px 1px 15px 3px rgba(0, 0, 0, 0.25);
}


/* röd-textbox */
.rod-textbox .produkter-box-textbox  {
   background: #ae2e28;    
}

.rod-textbox .pp-content-post:hover .produkter-box-textbox {
	color: #ae2e28;
}

/*MEDIASCREEN MOBILER*/
@media only screen and (max-width: 768px) {
.pp-content-post .produkter-huvud-div{
    justify-content: center;
}
	
}


/*-----Karusell------*/
.referenser-karusell .produkter-box {
	width:100%;
}

/*MEDIASCREEN MOBILER*/
@media only screen and (max-width: 768px) {
.referenser-karusell .produkter-box {
		width:300px;
	}
}


.hallar .produkter-box-bild img {
	height: 250px;
}

/*------------------------------------- sneda kolumner --------------------------------------------*/




/*------------------------------------- Hallar-singel --------------------------------------------*/

/*---Gröna infoboxar---*/
.produkt-infoboxar-huvuddiv {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 25px;
	justify-content: center;
}

.produkt-infobox {
    background: #89A456;
    padding-block: 35px 40px;
    padding-inline: 25px;
    width: 290px;
	display:flex;
	flex-direction: column;
    color: white;
}

/*MEDIASCREEN MOBILER*/
@media only screen and (max-width: 768px) {
.produkt-infoboxar-huvuddiv {
    justify-content: center;
}
}

/*---teknisk information---*/
.teknisk-information-lista {
    margin: 0px;
    padding: 0px;
}


.teknisk-information {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

/*---Formulär-----*/
form p {
    font-family: 'roboto';
}


/*------------------------------------- Galleri --------------------------------------------*/

.pp-gallery-img {
    height: 400px;
    object-fit: cover;
    width: 100%;
}

.generell-information h6 {
    margin-bottom: 0px;
}

/*------------------------------------- SEO-layout --------------------------------------------*/


.seo-helrad .seo-bild-div {
	display:none !important;
}



/*MEDIASCREEN NER TILL LAPTOP*/
@media only screen and (min-width: 1100px){
	
	




.seo-halvrad {
	display:flex;
	flex-direction:row;
	gap:15px;
	row-gap: 20px;
	
}

.seo-halvrad:nth-of-type(even) {
    flex-direction: row-reverse; /* För varannan rad: text till höger, bild till vänster */
}


.seo-halvrad .seo-text-div,
.seo-halvrad .seo-bild-div {
	width:50%;
}

	
.seo-huvud-div {
	margin-bottom:15px;
}
	
.seo-helrad {
	margin-bottom:10px;
}
	
}

/*MEDIASCREEN UPP TILL SURFPLATTA*/
@media only screen and (max-width: 1099px) {
	
.seo-halvrad .seo-text-div,
.seo-halvrad .seo-bild-div {
	display:block !important;
}
	
.seo-huvud-div {
		margin-bottom:15px;
}
	
.seo-bild-div {
		height:250px !important;
}

}

.seo-bild-div  {
	background-size: cover;
	background-position: center;
}

.seo-huvud-div h1,
.seo-huvud-div h2,
.seo-huvud-div h3,
.seo-huvud-div h4,
.seo-huvud-div h5,
.seo-huvud-div h6,
.seo-huvud-div p,
.seo-huvud-div a
{
	color:inherit !important;
}