/* reset style */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 75%;
    font: inherit;
    vertical-align: baseline;
}

.wp-block-heading {
font-weight: bold;
font-size: 120%;
margin-bottom: 10px;
margin-top: 30px;	
}


.wp-element-caption { display: none; }

/* Define the basic styles */
body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    line-height: 1.5;
    background: #172534 url(../images/master-bg.jpg) repeat-x top left;
}


#jsn-page {
    margin: 0 auto; /* Center the element horizontally */
    clear: both;
    display: block
}

#jsn-content_inner2 {
    width: 960px;
    margin: 0 auto;
    display: flex; /* Use Flexbox to create a flexible layout */
    background: white;
}

/* Adjust column widths and layout */
#jsn-content_inner2 {
    display: flex;
    justify-content: space-between;
    max-width: 960px;
    margin: 0 auto;
    background: white;
}

.jsn-column {
    flex: 0 0 calc(18% - 10px);
    box-sizing: border-box;
}

article {
width: 100%;
clear: both;
display: block;	
margin-bottom: 20px;
}

article h6 {
font-weight: bold
}



#jsn-maincontent {
    flex: 1;
    background: white;
    padding: 20px;
    box-sizing: border-box;
    margin: 0 10px;
}

/* Set the width of jsn-leftsidecontent div to 18% of the container width */
#jsn-leftsidecontent {
    width: 18%;
    float: left;
    background: #dcdcdc;
    padding: 1%;
    margin-bottom: 0;
    background: linear-gradient(to left, rgba(45, 45, 45, 0.3) 0, #dcdcdc 10px);
}

/* Set the width of jsn-rightsidecontent div to 18% of the container width */
#jsn-rightsidecontent {
    width: 18%;
    float: left;
    background: #dcdcdc;
    padding: 1%;
    margin-bottom: 0;
    background: linear-gradient(to right, rgba(45, 45, 45, 0.3) 0, #dcdcdc 10px);
}

.clearbreak {
    clear: both;
}

/* Mainlevel */
#jsn-mainmenu ul {
  z-index: 1;
  float: left;
  border-right: 1px solid #404040;
  margin: 0;
  background: none;
  padding: 0;
  list-style: none;
overflow: hidden;
  white-space: nowrap; /* Prevent items from breaking into the next line */
}

#jsn-mainmenu li {
  float: left;
  display: inline;
  background: none;
  margin: 0;
  padding: 0;
overflow: hidden;
}

#jsn-mainmenu a:link,
#jsn-mainmenu a:visited {
  display: block;
  border-right: 1px solid #000000;
  border-left: 1px solid #404040;
  margin: 0;
  padding: 3px 1em;
  color: #ffffff;
  font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
  font-weight: bold;
  text-decoration: none;

}

#jsn-mainmenu a:hover {
  background-color: #404040;
}

#jsn-mainmenu li.current-menu-item a {
  background-color: #404040;
}


/* Sublevel */
#jsn-mainmenu ul ul {
  position: absolute;
  left: -999em;
  z-index: 2;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Other containers */
#jsn-mainmenu ul ul ul {
  margin: -26px 0 0 184px;
  z-index: 3;
}

/* Items */
#jsn-mainmenu ul ul li {
  position: relative;
  width: 185px;
  margin: 0;
  background: none;
  padding: 0;
}

#jsn-mainmenu ul ul a:link,
#jsn-mainmenu ul ul a:visited {
  display: block;
  border-top: 1px solid #366999;
  border-right: none;
  border-bottom: 1px solid #162c40;
  border-left: 1px solid #162c40;
  background: #284d73 none;
  color: #cfdbe5;
  padding: 4px 10px;
  font-size: 0.9em;
  font-weight: normal;
  text-decoration: none;
  height: 1%;
}

#jsn-mainmenu ul ul a:hover,
#jsn-mainmenu ul ul li.current-menu-item a:hover,
#jsn-mainmenu ul ul li.current-menu-ancestor a:hover {
  border-top: 1px solid #1f3d59;
  background-color: #1f3d59;
  color: #ffffff;
}

/* Active */
#jsn-mainmenu ul ul li.current-menu-item a,
#jsn-mainmenu ul ul li.current-menu-item li.current-menu-item a,
#jsn-mainmenu ul ul li.current-menu-item li.current-menu-item li.current-menu-item a {
  font-weight: bold;
  color: #ffffff;
}

/* Clear active */
#jsn-mainmenu ul ul li.current-menu-item li a,
#jsn-mainmenu ul ul li.current-menu-item li.current-menu-item li a {
  font-weight: normal;
  color: #cfdbe5;
}

/* Children expanded */
#jsn-mainmenu ul ul li.menu-item-has-children > a,
#jsn-mainmenu ul ul li.menu-item-has-children > ul > li.menu-item-has-children > a {
  background: #284d73 url("../images/suckerfish-expand.png") no-repeat 95% center;
  padding-right: 10px;
}

/* Clear children expanded */
#jsn-mainmenu ul ul li.menu-item-has-children > ul > li > a,
#jsn-mainmenu ul ul li.menu-item-has-children > ul > li.menu-item-has-children > ul > li > a {
  background-image: none;
}

/* Rollover actions */
#jsn-mainmenu li:hover > ul,
#jsn-mainmenu li.menu-item-hover > ul,
#jsn-mainmenu li:hover > ul > li:hover > ul,
#jsn-mainmenu li.menu-item-hover > ul > li.menu-item-hover > ul,
#jsn-mainmenu li:hover > ul > li:hover > ul > li:hover > ul,
#jsn-mainmenu li.menu-item-hover > ul > li.menu-item-hover > ul > li.menu-item-hover > ul {
  left: auto;
}

#jsn-mainmenu li:hover > ul > ul,
#jsn-mainmenu li.menu-item-hover > ul > ul,
#jsn-mainmenu li:hover > ul > li:hover > ul > ul,
#jsn-mainmenu li.menu-item-hover > ul > li.menu-item-hover > ul > ul,
#jsn-mainmenu li:hover > ul > li:hover > ul > li:hover > ul > ul,
#jsn-mainmenu li.menu-item-hover > ul > li.menu-item-hover > ul > li.menu-item-hover > ul > ul {
  left: -999em;
}

#jsn-mainmenu,
#jsn-mainmenu li li {
  clear: left;
}



/* Set the width of jsn-rightsidecontent div to 20% of the container width */
#jsn-rightsidecontent {
  width: 18%;
  float: left; /* Float the div to the left to create a side-by-side layout */
background: #dcdcdc;
padding: 1%;
margin-bottom: 0px;
background: linear-gradient(to right, rgba(45, 45, 45, 0.3) 0, #dcdcdc 10px);
}

.pdf-symbol {
filter: invert(20%) sepia(72%) saturate(3691%) hue-rotate(343deg) brightness(77%) contrast(94%);
}

 .widget-title {
color: white;
margin-left: 12px;
font-weight: bold;
}



h1, h2, h3, h4, h5, h6, , .componentheading, .contentheading {
    font-family:  Verdana, Geneva, sans-serif !important
color: black;

}

.componentheading, .contentheading {
    font-family:  Verdana, Geneva, sans-serif !important;
    font-size: 1.4em;
}

	.menu-icon li.order1 a:link,
			.menu-icon li.order1 a:visited {
				background-image: url("https://3www2.de/templates/jsn_epic_pro2/images/icon-module-home.png");
			}
			
			.menu-icon li.order2 a:link,
			.menu-icon li.order2 a:visited {
				background-image: url("https://3www2.de/templates/jsn_epic_pro2/images/icon-module-info.png");
			}
			
			.menu-icon li.order3 a:link,
			.menu-icon li.order3 a:visited {
				background-image: url("https://3www2.de/templates/jsn_epic_pro2/images/icon-module-image.png");
			}
			
			.menu-icon li.order4 a:link,
			.menu-icon li.order4 a:visited {
				background-image: url("https://3www2.de/templates/jsn_epic_pro2/images/icon-module-download.png");
			}
			
			.menu-icon li.order5 a:link,
			.menu-icon li.order5 a:visited {
				background-image: url("https://3www2.de/templates/jsn_epic_pro2/images/icon-module-mail.png");
			}
			
			.menu-icon li.order6 a:link,
			.menu-icon li.order6 a:visited {
				background-image: url("https://3www2.de/templates/jsn_epic_pro2/images/icon-module-comment.png");
			}

.widget {
    border-radius: 5px;
    background: linear-gradient(to bottom, #003566 93%, #00a390);
    margin: 2px;
    padding: 3px 3px 10px 3px !important;
    margin-bottom: 10px;
}

* Remove bullet points from all menus */
.widget .menu-item,
.widget .menu-item ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* Top-level menu items */
.widget .menu-item > li {
    border-top: 1px dotted #b3b3b3;
    margin-left: 0;
    list-style: none;
}

/* Submenu items */
.widget .menu-item ul li {
    margin-left: 1em;
}




#jsn-leftsidecontent ul,
#jsn-rightsidecontent ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

b, strong {
    font-weight: bold;
}

i {
font-style: italic;
}

/* Default styles for the menu item */
.widget .menu-item a:link,
.widget .menu-item a:visited {
    display: block;
 /*  background: transparent url(/images/bullettree-level0.png) no-repeat 5px 10px; */
    border-bottom: 1px dotted #b3b3b3;
    padding: 3px 5px 3px 15px;
    color: #d9d9d9;
    text-decoration: none !important;
    transition: background-color 0.3s, color 0.3s; /* Add transition for smooth effect */
}

/* Hover styles for the menu item */
.widget .menu-item a:hover {
    background-color: #404040 !important;
    color: #d9d9d9;
}

/* New CSS for the blue square list item with a gradient */
.widget .menu-item {
    position: relative;
    list-style: none;
    padding-left: 5px; /* Add some padding to accommodate the blue square */
}

.widget .menu-item::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 8px;
    width: 3px;
    height: 3px;
    background: #0074e4;
}

.widget .current-menu-item a {
	font-weight: bold !important;
	color: white !important;
}

.widget .current-menu-item::before {
    content: "";
    position: absolute;
    top: 7px;
    left: 8px;
    width: 0;
    height: 0;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 4px solid darkred;
    background: none; /* Remove the blue background from the current menu item */
	font-weight: bold;
	color: white;
}

p + h3, p + .contentheading {
  margin-top: 20px; /* Add your desired margin-top value */
}

.contentheading {
  margin-top: 20px; /* Add your desired margin-top value */
 font-weight: 400
} 

.contentheading:first-child {
 margin-top: 0px; /* Add your desired margin-top value */
 margin-bottom: 14px;
} 

#jsn-maincontent_inner {
margin-top: 1.5em;
margin-bottom: 1.5em;
}

#jsn-maincontent_inner p:not(:has(strong)) {
    margin-bottom: 12px;
}

#jsn-maincontent_inner h5 {
margin-bottom: 3px;
font-weight: bold
}

#jsn-maincontent_inner a {
color: #00789f;
text-decoration: none
}

#jsn-maincontent_inner a:hover {
color: #00789f;
text-decoration: underline
}

#jsn-maincontent_inner p {
margin-bottom: 12px
}


/* Style for ul and li elements */
#jsn-maincontent_inner ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

#jsn-maincontent_inner li {
  display: inline-block;
  margin-right: 10px; /* Adjust the spacing between list items as needed */
}

.breadcrumb {
            float: left;
            clear: both;
            display: block;
            font-size: 10px;
            border-bottom: 1px dotted #333;
            width: 100%;
            margin-top: 0;
            margin-bottom: 1.2em;
		padding: 0px 0 5px 0;
        }

        .breadcrumb a:link,.breadcrumb a:visited, .archive .taxonomy .category .current-item {
        color: black;
		font-weight: bold;
        }


/* Read more */
/* Existing CSS for the .more-link */
.more-link  {
	margin-top: 10px;
    padding: 3px 6px 3px 22px;
    text-decoration: none;
    color: #404040 !important;
    border: 1px solid #e5e5e5;
    position: relative; /* Add position relative to the .more-link */
background: #d2d2d2;
font-size: 10px;
    /* Added clearfix properties */
    float: none;
    clear: both;
display: block;
	max-width:52px;
}

/* New CSS for the before pseudo-element */
.more-link::before {
    content: "";
    position: absolute;
    top: 50%; /* Vertically center the element */
    left: 5px;
    transform: translateY(-50%); /* Adjust the translateY to center the image */
    width: 8px; /* Adjust the width of the PNG */
    height: 8px; /* Adjust the height of the PNG */
    background: url(https://3www2.de/templates/jsn_epic_pro2/images/icon-module-arrow.png) no-repeat center; /* URL of the PNG */
}

/* Responsive Images */
#jsn-maincontent_inner  img {
  max-width: 100%;
  height: auto;
margin: 0 10px 0 0px}

/* WordPress Align Classes with Spacing */
#jsn-maincontent_inner  .alignleft {
  float: left;
  margin-right: 10px; /* Adjust the spacing as needed */
}

#jsn-maincontent_inner  .alignright {
  float: right;
  margin-left: 10px; /* Adjust the spacing as needed */
}

#jsn-maincontent_inner  .aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* Custom Class for align="left" Images */
#jsn-maincontent_inner  img.custom-align-left {
max-width: 100px;
height: auto;
  float: left;
  margin-right: 10px; /* Adjust the spacing as needed */
}

/* Custom Class for align="left" Images */
#jsn-maincontent_inner img.custom-align-right {
max-width: 100px;
height: auto;
  float: right;
  margin: 0 10px 10px 0; /* Adjust the spacing as needed */
}



/* Custom search form wrapper */
.custom-search-form {
  display: flex;
  align-items: center;
overflow: hidden;
}

/* Custom search input field */
.custom-search-input {
  max-width: 90px;
  padding: 1px;
  border: 1px solid #ccc;
  border-radius: 3px;
background: #d2d2d2;
overflow: hidden;
}

/* Custom search submit button */
.custom-search-submit {
  font-size: 18px;
  margin-left: 5px;
  background: transparent;
  border: none;
  cursor: pointer;
  color: #333;
}

/* Styling the search submit button as a magnifying glass icon */
.custom-search-submit::before {
  content: "\f002"; /* Unicode for the magnifying glass icon in FontAwesome */
  font-family: FontAwesome;
}

/* On hover effect for the search submit button */
.custom-search-submit:hover {
  color: #0066cc;
}

/* Footer section */
footer {
  height: 30px;
  background-color: #fff;
  color: #888;
  text-align: center;
  line-height: 30px;
  font-size: inherit;
max-width: 960px;
margin: 0 auto 20px auto;
border-top: 1px solid #d2d2d2
}

/* Footer widget area container */
#jsn-pfooter {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Style for individual widgets within the footer widget area */
#jsn-pfooter .widget {
  margin: 0 10px; /* Adjust the spacing between widgets */
}

/* Clearbreak for clearing the float */
.clearbreak {
  clear: both;
}

.socializer.sr-pad>:last-child {
    margin: 0!important;
    display: none;
}

h2 {
    font-size: 1.3em;
    color: #000000;
font-weight: bold;
margin-bottom 5px;
}

div.wpforms-container-full, div.wpforms-container-full * {
    font-size: inherit !important;
 }

    .pagination-wrapper {
		display: block;
		float: none;
		clear: both;
        text-align: center;
        margin-top: 20px; /* Adjust the margin as needed */
    }

    .pagination-wrapper a {
        margin: 0 10px;
    }

#jsn-header {
max-width: 960px;
margin: 0 auto;
}


#jsn-logo img {
    height: auto;
    max-width: 100%; /* Ensures image doesn't exceed its original size */
    display: block; /* Ensures no extra space beneath image */
}


/* Regular styles for sidebars and content */

/* Hide left and right sidebars on mobile phones */
@media only screen and (max-width: 767px) {
	body {
    font-size: 14px;
	}

    /* Adjust main content width for smaller screens */
    #jsn-maincontent {
        max-width: 100%;
        padding: 10px; /* Add padding for better readability */
    }

    /* Hide the left sidebar */
    #jsn-leftsidecontent {
        display: none;
    }
    
    /* Hide the right sidebar */
    #jsn-rightsidecontent {
        display: none;
    }
    
    /* Adjust main content width when both sidebars are hidden */
    #jsn-content_inner2 {
        width: 100%;
        margin: 0;
    }

    /* Modify the logo size for smaller screens */
    #jsn-logo img {
        max-width: 100%; /* Adjust the logo width as needed */
        height: auto;
        margin: 10px 0; /* Add some margin for the logo */
    }

    /* Hide primary menu on mobile */
    #jsn-mainmenu {
        display: none;
    }

    /* Example: Reduce menu font size for smaller screens */
    #jsn-mainmenu ul {
        display: none;
    }

    /* Styling for the mobile menu */
    #jsn-mainmenu {
        display: none; /* Hide the main menu by default on mobile */
    }
}

/* Navigation Mobile Styles */
.menu-toggle {
  display: none; /* Initially hide the checkbox */
}

.menu-toggle-label {
  display: block;
  width: 100%;
  height: 25px;
  position: relative;
  cursor: pointer;
  z-index: 5;
}

.menu-toggle-label span {
  display: block;
  width: 20px;
  height: 2px;
  background-color: #fff;
  margin: 4px;
  position: relative;
  transition: transform 0.3s ease-out;
}

/* Animation for the toggle */
.menu-toggle:checked ~ .menu-toggle-label span:nth-child(2) {
  opacity: 0;
}

.menu-toggle:checked ~ .menu-toggle-label span:first-child {
  transform: rotate(45deg) translate(2px, -1px);
top: 1px;
}

.menu-toggle:checked ~ .menu-toggle-label span:last-child {
  transform: rotate(-45deg) translate(2px, 1px);
 margin-top: -10px;
}

/* Show/hide the mobile menu based on the checkbox state */
.menu-toggle:checked ~ .navigation .menu {
  display: block;
}

/* Hide the menu by default on mobile */
.navigation .menu {
  display: none;
}

/* Your mobile menu specific styles */
.navigation .menu li {
margin: 6px 3px;
border-bottom: 1px dotted grey;
list-style: none
}

.navigation .menu li:last-child {
margin: 6px 3px;
border-bottom: none;
}

/* Submenu styles */
.navigation .menu .menu-item-has-children > ul {
  display: none; /* Hide submenu by default */
  margin-left: 20px; /* Indent submenu entries */
}

.navigation .menu .show-submenu > ul {
  display: block; /* Show submenu when parent is clicked */
}

/* Arrow icon styles */
.navigation .menu .arrow-icon {
  display: inline-block;
  margin-left: 5px;
  font-size: 12px;
  transition: transform 0.3s ease-out;
}

.navigation .menu .show-submenu > a .arrow-icon {
  transform: rotate(-180deg); /* Rotate arrow when submenu is open */
}

/* Your mobile menu specific styles */
.navigation .menu li a{
color: white;
margin-left: 4px;
text-decoration: none;

}

/* Media query for mobile devices */
@media only screen and (max-width: 767px) {
  .menu-toggle {
    display: none;
  }

  /* Hide the regular menu for smaller screens */
  .navigation .menu {
    display: none;
  }


/* Add styles for the arrow icon */
.navigation .menu .arrow-icon {
  display: inline-block;
  margin-left: 5px; /* Adjust the margin as needed */
  font-size: 12px; /* Adjust the size of the arrow icon */
  transition: transform 0.3s ease-out;
}

/* Rotate the arrow icon when submenu is visible */
.navigation .menu .show-submenu > a .arrow-icon {
  transform: rotate(-180deg);
}

/* Hide submenu items by default */
.navigation .menu .menu-item-has-children > ul {
  display: none;
}

/* Show submenu when its parent menu item is clicked */
.navigation .menu .menu-item-has-children > ul.show-submenu {
  display: block;
margin-left: 10px;
}

}


/* Media query for desktop devices */
@media only screen and (min-width: 767px) {
  .navigation-box {
    display: none;
  }

/* Default styles for the footer widget */
.footer-widget-area {
    display: none; /* Hide the footer widget area by default */
}

}



/* Style for the footer widget area */
.footer-widget-area .widget .menu-item a:link,
.footer-widget-area .widget .menu-item a:visited {
    display: block;
    border-bottom: 1px dotted #b3b3b3;
    color: #d9d9d9;
    text-decoration: none !important;
    transition: background-color 0.3s, color 0.3s;
}

/* Background color for the footer widget area */
.footer-widget-area {
    background-color: #003566;
    padding: 20px; /* Adjust padding as needed */
}

/* Font color for text inside the footer widget area */
.footer-widget-area,
.footer-widget-area p,
.footer-widget-area a {
    color: #ffffff; /* White font color */
}

/* Optionally, style links specifically */
.footer-widget-area a {
    text-decoration: none; /* Remove underline from links */
}

.footer-widget-area .widget {
    border-radius: 5px;
    background: #003566;
    margin: 2px;
    padding: 3px 3px 10px 3px !important;
    margin-bottom: 10px;
text-align: left;
}

.footer-widget-area .widget li {
list-style: none;
}

.footer-widget-area .widget .menu-item::before {
    content: "";
    position: absolute;
    top: 15px;
    left: 8px;
    width: 3px;
    height: 3px;
    background: #0074e4;
}

.socializer .sr-print a, .socializer .sr-print a:visited,
.socializer .sr-email a, .socializer .sr-email a:visited,
.socializer .sr-pdf a, .socializer .sr-pdf a:visited {
    color: #fff !important;
background: rgb(44,44,44	);
background: linear-gradient(0deg, rgba(44,44,44,1) 0%, rgba(44,44,44,0.8007995434501926) 56%, rgba(0,0,0,0.3526202717415091) 100%);
max-height: 16px;
min-width: 36px;
padding: 2px 8px;
border-radius: 3px;
font-family: sans-serif;

}

.wpsr-share-icons .wpsr-si-inner  {
    margin-right: 0;
    float: right !important;
}

.fa, .fas {
    font-weight: 700;
    font-size: 10px;
font-family: sans-serif;
text-transform: uppercase;
}

.fa-print:before {
    content: "Print";
}

.fa-file-pdf:before {
    content: "PDF";
}

.fa-envelope:before {
    content: "E-Mail";
}
