@import url(https://fonts.nwwn.de/css?family=Montserrat:200,500);
@import url(https://fonts.nwwn.de/css?family=Signika+Negative:200,300);


* { 					box-sizing:border-box; }
body {					font:200 16px/150% 'Montserrat', sans-serif; margin:0; background:#fff }
.flex { 				display:flex; flex-wrap:wrap; flex-direction:row; }

img { 					max-width:100%; height:auto; border:0;  }
th { 					text-align:right; }
a { 					color: #00367B; text-decoration:none; } 

h1,h2,h3,h4,h5,h6 {			color:#646565; font:200 20px 'Signika Negative'; margin:20px 0 0 0; text-transform:uppercase;  }
#container,.inline  {		position:relative; width:100%; max-width: 1200px; margin: 0 auto; }


/* ------------------------------- TOP --------------------------------- */
#topline {				position:relative; background:#747474; width:100%; height:40px; display:block; color:#BABABA; }
#topline-inner {			display:flex; justify-content:space-between; }
#topline a {				color:#BABABA; padding:0 10px; line-height:40px; }

#top { 				position:relative; width:100%; display:flex; height:150px; flex-direction:row; background:#fff;  }
#top_logo {				position:relative; display:inline-block; height:150px; width:300px; padding:30px 0 27px 0; overflow:hidden;	}
#top_logo a { 			position:relative; display:block; width:100%; height:90px; top:0; left:0; background:url(../images/logo.png) left center; background-size: auto 100%; background-repeat:no-repeat; }
#top_right {				display:flex; align-items:center; justify-content:space-between; float:right; width:calc(100% - 320px); height:150px; top:0; left:0; }
#top_contact,#top_search {		display:inline-block; }
#top_contact a {			color: #035BA9; display:flex; }
.xl {					font-size:210%; padding-top:3px; transform: scaleX(-1); }
#top_contact a > div,#top_contact i {display:inline-block;}
#top_contact a > div {		padding:0 0 0 10px; line-height:18px; }

#top_right form { 			display:flex; }
.sbp_top {				position: relative; }
.sbp_top input,.sbp_top select {	padding:6px; margin:0; color:#626262; height:36px; font-size:100%; border:none; border-top:1px solid #C3C3C3; border-bottom:1px solid #C3C3C3; border-left:1px solid #C3C3C3; }
.sbp_top input[type="text"] {	border-radius:6px 0 0 6px; width:420px; color:#035BA9;}
.sbp_top button {			cursor:pointer; font-size:150%; height:36px; border:none; background:#C3C3C3; color:#fff; border-radius:0 6px 6px 0; transition:0.3s ease-in-out;  }
.sbp_top button:hover {		background:#035BA9; transition:0.3s ease-in-out; }


#nav-outline {			position:relative; display:block; background:#F5F5F3; z-index:10; border-bottom: 2px solid #035BA9;  }
#nav { 				position:relative; outline:0; padding-left:4px; height:48px; font-size:90%;  }
#nav a {				text-decoration:none;}
#nav{ 					position: relative; z-index: 999 !important;    }
#nav > a { 				display:none; }
#nav li { 				position:relative; }
#nav li a { 				color:#1f2c5b; display:block;   }
#nav li a.current,
#nav li a:active {  			background:#035BA9; color:#fff; } 
#nav span:after{			width:0; height:0; border:0; content:''; vertical-align:middle; display:inline-block; position:relative; }

#nav > ul { 				padding:0; margin:0; }
#nav > ul > li{ 			display:inline-block; margin:0 0 0 -4px;  }
#nav > ul > li > a{ 			padding:0 16px; text-align:center; line-height:48px; transition:all 0.3s ease-in-out; text-transform:uppercase; }
#nav > ul > li:hover > a,
#nav > ul:not(:hover) > li.active > a { color:#035BA9; font-weight:500; transition:all 0.3s ease-in-out;  }
#nav > ul > li a .current:hover { 	color:#fff; }

#nav li ul {  			border-top:0; background:#ccc; display:none; position:absolute; margin:0 0 0 -1px; padding:0; top:100%; width: 240px; list-style-type:none;  }

#nav li:hover ul{			display:block;left:0;right:0;}
#nav li:not(:first-child):hover ul{ }
#nav li ul a{ 			display:block; padding: 5px 10px; border-bottom:1px solid #1e9ec0; }
#nav li ul a:last-child { 		border-bottom:1px solid #035BA9; }

#nav li ul li a:hover,
#nav li ul:not(:hover) li.active a{color:#fff; background-color:#21345d; }




/* ------------------------------- MAIN --------------------------------- */
#main {				padding:50px 0 50px 0;  }
#main table, #main td { border:none; vertical-align:top; }

#main_content > h1 { 		color:#646565; margin:0 12px; font:200 32px 'Signika Negative',verdana,arial; letter-spacing:0.2px; line-height:50px; text-transform:uppercase; }
#main_content > h3 { 		color:#646565; font:200 28px 'Signika Negative'; margin:50px 0 0 12px; text-transform:uppercase; }
#txt {					margin:12px; padding:12px; background:#fff; border:1px solid #E7E4D9; border-radius:3px; }




 



.prod_box { display:flex; align-items: stretch; }
.prod_item { position:relative; display:inline-block; width:33.33%; padding:12px; }
.prod_item_inner { border:1px solid #E7E4D9; padding:10px; border-radius:3px;  }
.prod_txt {}
.prod_img { padding-bottom:100%; width:100%; background-position:center center; background-size:contain; background-repeat:no-repeat; }
.prod_button {}


#main_content { width:75%; display:inline-block; padding:12px; }
#main_sidebar { width:25%; display:inline-block; padding:62px 12px 12px 12px; }



/* links rechts */
#aside_nav { padding:10px; border:1px solid #E7E4D9; border-radius:3px;width:100%; display:block; }

.click-menu { 
width:100%; 
}
.click-menu div:hover { cursor:pointer;}
.click-menu .box1, 
#linkliste a {  
display:block; padding:0 15px; line-height:48px; border-bottom:1px solid #E7E4D9; transition:all 0.5s ease-in-out;
}


.click-menu .box1-hover,
#linkliste a.active:hover,
#linkliste a.current:hover,
#linkliste a:hover {  
display:block; 
display:block; padding:0 15px; line-height:48px; border-bottom:1px solid #E7E4D9; color:#2067AC; transition:all 0.5s ease-in-out;


}

.click-menu .box1-open-hover,
.click-menu .box1-open,
#linkliste a.active,
#linkliste a.current {  
display:block; padding:0 15px; line-height:48px; border-bottom:1px solid #E7E4D9; color:#2067AC; transition:all 0.5s ease-in-out;

}

.click-menu .box1-open-hover { 	}

.click-menu .box1 img, .click-menu .box1-hover img, .click-menu .box1-open img, .click-menu .box1-open-hover img {
    position: absolute; top: 6px; right: 6px; }
.click-menu .section {  		display: none; }
.click-menu .section a {		white-space: nowrap; display:block; font-size:90%; }
.click-menu .section a:before { 	content:'\f105';
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit; padding:0 6px; }

.click-menu .section a:hover {	white-space: nowrap; display:block; }
.click-menu .section .active,
.click-menu .section .current {	overflow:hidden; }

.click-menu .box2,
.click-menu .box2-hover {		display:block; padding:0 15px; line-height:40px; border-bottom:1px solid #E7E4D9; }
.click-menu .box2-hover a {		}

 

div.fweb_bottom {
 display:none;
}

#main2-inner { 			padding:12px; }

#bottom {				position:relative; display:block; min-height:200px; background:#3C3C3C; padding:50px 0; color:#F8F8E4; }
#bottom2 {				text-align:center;  background:#3C3C3C; border-top: 1px solid #1f2c5b; color:#F8F8E4; font-size:90%;  }
#bottom2-inner {			padding:20px 0; }
#bottom2-inner p {			margin:0; padding:0;	}
#bottom a, #bottom2 a { 		color:#fff; }
 
.shop_categories { 			list-style-image:none; display:block; margin:0; padding:0; }
.shop_categories .item { 		display:inline-block; width:20%; padding:10px; }
.shop_categories .item a img { 	max-width:100%; height:auto; opacity:0.8;}
.shop_categories .item a { 		display:block; text-align:center; padding:10px; background:#fff; border:1px solid #E7E4D9; transition:all 0.5s ease-in-out; }
.shop_categories .item a:hover img { opacity:1; transition:all 0.5s ease-in-out;  }

#bottom table, #bottom td { 	border:none; vertical-align:top; color:#fff; }

















/**************** SMARTPHONE *****************/

@media only screen and (min-width:800.01px) {
 body {   } 
}

@media only screen and (max-width:400px) {
body { 					padding-top:60px; font-size:80%; } 
h4,h5,h6 {					font-size:13px; }
#top { 					position:fixed; display:block; top:0; height:60px; width:100%; z-index:10; background:#eee; }
#top-inner,.flex,#top_logo,#main,#main_content,.inline,#main_sidebar,#main2-inner,#txt img { position:relative; display:block; margin:0 auto; width:100%; padding:0; }

#top_logo { 					display:block; width:200px; height:60px; padding: 0; overflow:hidden; margin:0 auto; }
#top_logo a {					display:block; width:100%; height:60px; top:0; left:0; background: url(../images/logo.png) center center; 
						background-size: auto 90%; background-repeat:no-repeat; }

#top_search { 				position:fixed; top:-36px; left:0; padding-left:6px; z-index:20; width:44px; height:80px; transition:all 0.5s ease-in-out; }

#top_search:after { 				display:block; z-index:22; width:44px; height:44px; content:'\f002'; margin:7px 0 0 0;
						font-size:34px; font: normal 34px FontAwesome,"Font Awesome 5 Free";font-style:normal;font-weight:900; color:#035BA9; text-decoration: inherit; overflow:hidden; }

#top_search:hover { 				position:fixed; top:10px; left:0; width:calc(100% - 56px); z-index:20; transition:all 0.5s ease-in-out; }
#top_search:hover:after { 			display:none; transition:all 0.5s ease-in-out; }
#top_search input[type="text"] { 		width:calc(100% - 150px); }


#main {					padding:0;}
#txt { 					border:none; margin:0; padding:0 12px; text-align:justify; hyphens:auto; }
#add_txt { 					padding:6px; }
.prod_box {					margin:0 auto; width:100%; padding:0; display: flex; flex-wrap: wrap }
.prod_item,.shop_categories .item { 	display: inline-block; padding: 6px; width:50%; }
.prod_item_inner { 				height:100%; }
.prod_item { 					margin: 0;}

#top_contact,#topline { 			display:none; }

#main_content > h1,h1,h3,#bottom1, #bottom1 td { text-align:center; padding:10px 0; width:100%; margin:0; display:block; letter-spacing:0;  }
#bottom1, #bottom1 td { 			padding:0; }
#main_content > h1,h1,h2 {			font-size:24px; text-align:center; }

#main, #header { 				display:block; }  
#content,#header > div { 			width:100%; }
#sidebar { 					display:block; margin:0 auto; } 
#nav { 					position:fixed; margin:0; float:none; top:0; right:0; height:60px; width:60px; max-width:100%; }
#nav:before { 				position:relative; margin:0; color:#035BA9; float:left; top:0; left:0; padding:0 20px; content:''; line-height:44px; }
#nav-outline {				border-bottom:none; }

#nav:hover {					width:100%; }
#nav > a{					margin-right:7px; margin-top:7px; width:44px;height:44px; text-align:right; float:right; text-indent:-9999px; background-color:#035BA9; position:relative; }
#nav > a:before, #nav > a:after{		position:absolute; border:2px solid #fff;top:35%;left:25%;right:25%;content:'';}
#nav > a:after{				top:60%; }
#nav > ul > li{				width:100%; float:none; padding:0; margin:0; display:block; background:#fff;  }
#nav > ul > li:hover > a,
#nav > ul:not(:hover) > li.active > a,
#nav > ul > li > a{ 				padding:0; margin:0; background:#fff; height:36px; line-height:36px; color:#035BA9; }
#nav > ul > li:not(:last-child) > a{   	border-right:none; border-bottom:1px solid #dadada;}
#nav > ul > li:hover > a,
#nav > ul:not(:hover) > li.active > a { 	background:#035BA9; color:#fff; }
#nav > ul {					list-style-type:none; padding:0; margin:60px 0 0 0; height:auto; display:none; position:absolute; left:0; right:0;}
#nav:target > ul {				display:block;}
#nav li ul {					position:static; list-style-type:none; width:100%; border:0; }
#nav li ul a:last-child,
#nav > li > ul > li > a {          	border:0; border-bottom:2px solid #035BA9; text-align:center; }
#nav:not(:target) > a:first-of-type,#nav:target > a:last-of-type { display:block; }
#nav > ul > li:hover > a,
#nav > ul:not(:hover) > li.active > a { 	border-bottom:1px solid #36a1ac; }

}







.ipWidget-Gallery ._container { display:flex; flex-wrap:wrap; flex-direction:row; border:3px solid #999; background:#999;}
.ipWidget-Gallery .ipsItem { width:25%; }
.ipWidget-Gallery .ipsItem a { display:block; padding:0; border:3px solid #999;  }
.ipWidget-Gallery .ipsItem img { width:100%; height:auto; display:block; }