/*
 Theme Name:     ITAGIL theme
 Theme URI:      https://www.itagil.dk
 Description:    ITAGIL CHILD THEME
 Author:         ITAGIL ApS
 Author URI:     https://www.itagil.dk
 Template:       Divi
 Version:        1.0.0
*/
 
 
/* =Theme customization starts here
------------------------------------------------------- */

:root{
    --background-color: #F2F2EC;
	--footer-background-color: #B2C9B5;
    --multiplier: 6px;
    --font-multiplier: 6px;
	--font-family-Header: "Penumbra HalfSerif Std"; /*Header font er kun uppercase*/
    --font-family-Brodtext: "Miller Text";
	--font-color: #192C11;
	
    --body-max-width: 1200px;

	--background-color-dark: #192C11;
	--link-hover-color: #192C11;
	
	--image-size: 300px;
}
/* Body setup */
body .et_pb_section{
	background-color: unset;
	height: 100%;
	margin: 0;
	padding: calc(var(--multiplier)*3);
	color: var(--font-color) !important;
	font-size: 20px;
}

html, body {
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}
 
div div#page-container {
    min-width: 800px;
    margin-left: auto;
    margin-right: auto;
    height: 100vh;
}
 
 
@media only screen and (min-width: 1350px) {
    div .et_pb_row {
        padding: 27px 0px 0px 0px;
    }
}
 
div .et_pb_module.et_pb_text.et_pb_text_6_tb_footer.et_pb_text_align_left.et_pb_bg_layout_light {
    margin-bottom: 0px !important;
}

.et_pb_module {
	padding: 0 !important;
	margin: 0 !important;
	padding-top: calc(var(--multiplier)*3)!important;
	text-align: center !important;
}


/*Header layout*/

header{
    background-color: var(--background-color) !important;
	font-family: var(--font-family-Brodtext);
	display:flex;
	justify-content: center !important;
	padding-bottom: 50px !important;
}

.et_pb_image_0_tb_header{
	display:flex;
	justify-content: center !important; 
}

header img{
	width: var(--image-size);
}

.et_pb_menu_0_tb_header.et_pb_menu ul li a{
	font-size: 25px !important;
	color: var(--font-color) !important;
}

@media only screen and (max-width: 768px){
		header img{
		width: var(--image-size)!important;
	}
}

@media only screen and (max-width: 980px){
		header img{
		width: var(--image-size) !important;
	}
}

/* narbar removing padding for hover works better*/
.nav li li{
	padding: 0;
}

.et_pb_menu .et-menu-nav>ul ul{
	padding:0;
}



#menu-navbar-dk li a {
    position: relative; /* Needed for absolute positioning of the red dot */
    text-decoration: none; /* Removes default underline */
}

#menu-navbar-dk li:hover a::after {
    content: ''; /* Creates an empty pseudo-element */
    position: absolute;
    left: 50%;
    bottom: -5px; /* Adjust distance from text */
    width: 2px; /* Size of the red dot */
    height: 6px;
    background-color: var(--link-hover-color); /* The red dot */
    border-radius: 50%; /* Makes it a circle */
    transform: translateX(-50%); /* Centers the dot */
}

/* Only apply styles to top-level menu items without submenus */
#menu-navbar-dk > li:not(.menu-item-has-children) > a {
    position: relative;
    text-decoration: none;
}

/* Add the red dot only to top-level items without submenus */
#menu-navbar-dk > li:not(.menu-item-has-children):hover > a::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -5px;
    width: 6px;
    height: 6px;
    background-color: red;
    border-radius: 50%;
    transform: translateX(-50%);
}

/* Ensure submenu items inside ul.sub-menu do NOT get the red dot */
#menu-navbar-dk ul.sub-menu li a::after {
    content: none !important;
}

/* Remove the red dot from menu items with submenus when hovered */
#menu-navbar-dk > li.menu-item-has-children:hover > a::after {
    content: none !important;
}

#menu-navbar-dk li a {
    position: relative; /* Needed for absolute positioning of the red dot */
    text-decoration: none; /* Removes default underline */
}

#menu-navbar-dk li:hover a::after {
    content: ''; /* Creates an empty pseudo-element */
    position: absolute;
    left: 50%;
    bottom: -5px; /* Adjust distance from text */
    width: 2px; /* Size of the red dot */
    height: 6px;
    background-color: var(--link-hover-color); /* The red dot */
    border-radius: 50%; /* Makes it a circle */
    transform: translateX(-50%); /* Centers the dot */
}

/* Only apply styles to top-level menu items without submenus */
#menu-navbar-dk > li:not(.menu-item-has-children) > a {
    position: relative;
    text-decoration: none;
}

#menu-navbar-dk li a {
    position: relative; /* Needed for absolute positioning of the red dot */
    text-decoration: none; /* Removes default underline */
}

#menu-navbar-dk li:hover a::after {
    content: ''; /* Creates an empty pseudo-element */
    position: absolute;
    left: 50%;
    bottom: -5px; /* Adjust distance from text */
    width: 2px; /* Size of the red dot */
    height: 6px;
    background-color: var(--link-hover-color); /* The red dot */
    border-radius: 50%; /* Makes it a circle */
    transform: translateX(-50%); /* Centers the dot */
}

/* Only apply styles to top-level menu items without submenus */
#menu-navbar-dk > li:not(.menu-item-has-children) > a {
    position: relative;
    text-decoration: none;
}

/* Add the red dot only to top-level items without submenus */
#menu-navbar-eng > li:not(.menu-item-has-children):hover > a::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -5px;
    width: 6px;
    height: 6px;
    background-color: red;
    border-radius: 50%;
    transform: translateX(-50%);
}

/* Ensure submenu items inside ul.sub-menu do NOT get the red dot */
#menu-navbar-eng ul.sub-menu li a::after {
    content: none !important;
}

/* Remove the red dot from menu items with submenus when hovered */
#menu-navbar-eng > li.menu-item-has-children:hover > a::after {
    content: none !important;
}

#menu-navbar-eng li a {
    position: relative; /* Needed for absolute positioning of the red dot */
    text-decoration: none; /* Removes default underline */
}

#menu-navbar-eng li:hover a::after {
    content: ''; /* Creates an empty pseudo-element */
    position: absolute;
    left: 50%;
    bottom: -5px; /* Adjust distance from text */
    width: 2px; /* Size of the red dot */
    height: 6px;
    background-color: var(--link-hover-color); /* The red dot */
    border-radius: 50%; /* Makes it a circle */
    transform: translateX(-50%); /* Centers the dot */
}

/* Only apply styles to top-level menu items without submenus */
#menu-navbar-eng > li:not(.menu-item-has-children) > a {
    position: relative;
    text-decoration: none;
}

/*Main content*/
#main-content{
	background-color: var(--background-color) !important;
	font-family: var(--font-family-Brodtext) !important;
	padding-bottom: calc(var(--multiplier)*16);
}

#main-content h1{
	font-family: var(--font-family-Header) !important;
	font-size: 64px;
}

#main-content h3{
	font-family: var(--font-family-Header) !important;
	font-size: 32px;
}

.et_pb_with_border .et_pb_image_wrap{
	
}

main-content .et_pb_image_wrap img{
	width:100% !important;
}

.et_pb_row{
	padding: unset !important;
	padding-bottom: calc(var(--multiplier)*4) !important;
}

.et_pb_image{
	display:flex; 
	Justify-content: center;
}

/*Footer setup*/
.et_pb_section_0_tb_footer.et_pb_section{
	background-color: var(--footer-background-color);
	font-family: var(--font-family-Brodtext);
	width: 100%;
	padding-bottom: calc(40px - var(--multiplier)* 4) !important;
	text-transform: uppercase;
}

.et_pb_section_0_tb_footer.et_pb_section h3{
	font-size: 40px;
}

.et_pb_section_0_tb_footer.et_pb_section .et_pb_image_wrap {
	padding-top: 60px !important;
	width: 75px !important;
	padding-bottom: 20px !important;
}

.et_pb_section_0_tb_footer.et_pb_section a{
	color: var(--link-hover-color);
}


footer .et_pb_module {
	padding: 0 !important;
}



/*Footer Custom*/


.et_pb_text_2_tb_footer, .et_pb_text_4_tb_footer, .et_pb_text_5_tb_footer, .et_pb_text_7_tb_footer  {
	margin-bottom: 20px !important
}






/*Buttons*/

#main-content .et_pb_button{
	background-color: var(--footer-background-color) !important;
	border-radius: 0px !important;
	border: 1px solid var(--footer-background-color) !important;
}

body #page-container .et_pb_section .et_pb_button_0:hover{
	background-color: var(--background-color) !important;
	border: 1px solid !important;
	border-width: 1px !important;
	border-radius: 0px !important;
	border-color: var(--footer-background-color) !important;
	color: var(--footer-background-color) !important;
}


/*Både buttons and links*/


a{
	color: #192C11;
}

a:hover{
	/*
	background-color: var(--link-hover-color) !important;
	color: white !important;
	border-radius: 2px !important;
	*/
}

.custom-download-button{
	background-color: var(--footer-background-color) !important;
	border-radius: 0px !important;
	border: 1px solid var(--footer-background-color) !important;
	padding: 12px 20px !important;
}

.custom-download-button:hover {
  all: unset !important;
  cursor: pointer; /* Optional: keeps it looking clickable */
}

.custom-download-button:hover{
	transition: all 300ms ease 0ms !important;
	background-color: var(--background-color) !important;
	border: 1px solid !important;
	border-width: 1px !important;
	border-radius: 0px !important;
	border-color: var(--footer-background-color) !important;
	color: var(--footer-background-color) !important;
	cursor:pointer !important;
	padding: 12px 20px !important;
}

.custom-download-button:after{
	transition: all 300ms ease 0ms !important;
}

#popup-trigger-btn{
	display: none !important;
}


#popup .et_pb_text_inner H1 span{
	font-family: "Penumbra HalfSerif Std";
}

/* POP UP Små computere version*/
@media only screen and (max-width: 1025px){
	#popup{
		max-width: 50% !important;
	}
}

/* POP UP tablet version*/
@media only screen and (max-width: 768px){
	#popup{
		max-width: 70% !important;
	}
}
/* POP UP Mobile version*/
@media only screen and (max-width: 425px){
	#popup{
		max-width: 100% !important;
	}
}