body {font-family: 'Poppins', 'Sans-Serif';}
@font-face {
    font-family: "Lora-Regular";
    src: url('https://jjames.eu/media/templates/site/cassiopeia_jjames/fonts/Lora-VariableFont_wght.ttf');
}
@font-face {
    font-family: "Lora-Bold";
    src: url('https://jjames.eu/media/templates/site/cassiopeia_jjames/fonts/Lora-Bold.ttf');
}
@font-face {
    font-family: "Lora-Italic";
src: url('https://jjames.eu/media/templates/site/cassiopeia_jjames/fonts/Lora-Italic-VariableFont_wght.ttf');
}
@font-face {
    font-family: "Poppins";
src: url('https://jjames.eu/media/templates/site/cassiopeia_jjames/fonts/Poppins-Regular.ttf');
font-weight:400;
}
@font-face {
    font-family: "Poppins";
src: url('https://jjames.eu/media/templates/site/cassiopeia_jjames/fonts/Poppins-Light.ttf');
font-weight:200;
}
@font-face {
    font-family: "Poppins";
src: url('https://jjames.eu/media/templates/site/cassiopeia_jjames/fonts/Poppins-Medium.ttf');
font-weight:500;
}
@font-face {
    font-family: "Poppins";
src: url('https://jjames.eu/media/templates/site/cassiopeia_jjames/fonts/Poppins-SemiBold.ttf');
font-weight:600;
}
@font-face {
    font-family: "Poppins-ca";
src: url('https://jjames.eu/media/templates/site/cassiopeia_jjames/fonts/Poppins-SemiBold.ttf');
font-weight:600;
}

@font-face {
    font-family: "Poppins";
src: url('https://jjames.eu/media/templates/site/cassiopeia_jjames/fonts/Poppins-Bold.ttf');
font-weight:700;
}@font-face {
    font-family: "Poppins";
src: url('https://jjames.eu/media/templates/site/cassiopeia_jjames/fonts/Poppins-ExtraBold.ttf');
font-weight:800;
}
/*
@font-face {
    font-family: "DejaVu Sans";
    src: url("fonts/DejaVuSans-Oblique.ttf");
    font-style: italic, oblique;
}
@font-face {
    font-family: "DejaVu Sans";
    src: url("fonts/DejaVuSans-BoldOblique.ttf");
    font-weight: bold;
    font-style: italic, oblique;
}*/
:root {
  --jj_darkblue: #1D2362;
  --jj_blue: #1D58A7;
  --jj_brightblue: #3975C4;
}
.btn-primary {
    background-color: var(--jj_blue);
    border-color: var(--jj_blue);
}



.input-group-prepend span {
  display:inline-block;
  width: 10rem;
}
#cookiehintsubmit, #cookiehintsubmitno {background:#1D58A7 !important; }
header {z-index:105;}
body.wrapper-fluid .site-grid {grid-gap:0 0;}
main {
background-image:url('/images/jjames/jj_background.png');
background-size:cover;
background-position:center;
margin-top:0; 
}
.btn.btn-secondary{color:var(--jj_blue);}
.max1280 {max-width:1280px;margin:auto;}
a, a:not([class]) {text-decoration:none;}
h3 {text-align: center;
    font-family: 'Poppins';
    font-weight: 200;
color:#1D58A7; }
.com-users-login {max-width:1280px;margin:auto;}
.container-header .navbar-toggler {color:#1D58A7;}
.footer {margin-top:0;}
.container-header {background-image:none;background-color:#fff;} 
.container-header .mod-menu{color:#1D58A7;font-family: Helvetica;font-size: 16px;text-align:center;}
nav.navbar {width:100%;}
.metismenu-item {width:20%;}
.mm-collapse > .metismenu-item {width:unset;}
.metismenu.mod-menu .metismenu-item{justify-content:center;}
.container-nav{background: #FFFFFF;
box-shadow: 0 4px 4px 0 rgba(192,192,192,0.50);}
#jj_topbar {	position:relative;background: #1D58A7;box-shadow: 0 2px 4px 0 rgba(192,192,192,0.50);height:60px;}
.jj_topbar_left, .jj_topbar_right {font-family: Helvetica;font-size: 15px;color: #FFFFFF;text-align: center;position:absolute;height:33px;font-weight:bold;padding:5px;top:1px;}
.langswitch{display: inline-block;
    padding: 5px;
    position: absolute;
right: 240px;}
.jj_topbar_left {width:647px;left:15px;}
.jj_topbar_right {width:256px;right:0px;} 
/*.item-page{max-width:80vw;margin:auto;}*/
.com-content-article__body{margin-top:50px;}
.container-toplogo {margin:auto;padding: 20px;
text-align: center;max-width:200px;}
.powerbi main {background-image:none;}
h1{font-family: Poppins;font-size: 40px;color: var(--jj_blue);letter-spacing: 0;text-align: center;font-weight:600;}
#jj_home_ani {position:relative;}
#schranken_top{
	position:absolute;
	left:0;
	right:0;
	top:0;
    background-image: url(/images/jjames/Schranken_Illu_2_sep-01.png);
	    animation: schranken_top 3s cubic-bezier(0.62, 0, 1, 1) 1s 1 alternate;
    animation-fill-mode: forwards;
	background-position:center;
max-width:1344px;
height:568px;
margin:auto;
	background-size:contain;
	background-repeat:no-repeat;
	overflow:hidden;}
#schranken_top_wischer {
    position: absolute;
    width: 330vw;
    right: 0;
    background: white;
    top: 100%;
    animation: schranken_top_wischer 3s cubic-bezier(0.62, 0, 1, 1) 1s 1 alternate;
    animation-fill-mode: forwards; 
    transform-origin: top right;
    height: 200vw;
	}
#schranken { 
	position:absolute;
	top:568px;
	left:0;
	right:0;
    background-image: url(/images/jjames/Schranken_lang.png);
	background-position:center;
    margin: auto;
    transform-origin: bottom right;
	animation: schranken 3s cubic-bezier(0.62, 0, 1, 1) 1s 1 alternate;
	animation-fill-mode:forwards;
	background-repeat:no-repeat;
	width:1344px;
	z-index:2;}

#jj_after_schranken {
    animation: schranken_danach 2s linear 2.5s 1 alternate;
    animation-fill-mode: forwards;
    opacity: 0%;
    font-size: 14px;
    color: #1D58A7;
    text-align: center;
    max-width: 400px;
    margin: 100px auto 150px auto;
    height: 250px;
}

#branchenloesungen {    text-align: center;
    margin: auto;
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    column-gap: 70px;
    padding: 150px 0 100px 0;
    max-width: 1280px;
}
@keyframes schranken {
  from {transform: rotate(0deg);}
  to {transform: rotate(75deg);}
  99%{right:0;top:568px;left:0;width:1344px;}
  100%{position:absolute;right:10%;left:unset;top:450px;width:50vw;}
}
@keyframes schranken_top_wischer {
  from {transform: rotate(0deg);opacity:100%;}
  99%{opacity:100%;}
  to {transform: rotate(75deg);opacity:0%;}
  
}@keyframes schranken_top {
  from {opacity:100%;}
  85% {opacity:85%;}
  to {opacity:0%;}
  
}


#jj_branchen {
	text-align:left;
animation: schranken_danach 3s linear 0s 1 alternate;
    animation-fill-mode: forwards;
}
#jj_branchen h2{margin-top:10px;}

	@keyframes schranken_danach {
  from {opacity:0%;}
  to {opacity:100%;}
  100% {opacity:100%;}
}
h2 {font-family: Poppins;
font-size: 31px;
color: #1D58A7;
font-weight:600;
margin-bottom:30px;}
p {font-family: 'Poppins';
font-size: 18px;
font-weight:400;
color: var(--jj_blue);
letter-spacing: 0;}
/* HOME SLIDER */
#jj_home_slide_1 h2,#jj_home_slide_2 h2,#jj_home_slide_3 h2 {text-align:center;}

#jj_home_slider {max-width: 749px;
    max-height: 599px;
    overflow: hidden;
	margin:auto;
}
#jj_home_slides {
	display: flex;
  /*overflow-x: auto;*/
scroll-snap-type: x mandatory;
scroll-behavior: smooth;
-webkit-overflow-scrolling: touch;
margin-bottom:25px;
}
#jj_home_slides::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
#jj_home_slides::-webkit-scrollbar-thumb {
  background: black;
  border-radius: 10px;
}
#jj_home_slides::-webkit-scrollbar-track {
  background: transparent;
}
#jj_home_slides > div {
  scroll-snap-align: start;
  flex-shrink: 0;    width: 749px;
    height: 599px;
  margin-right: 50px;
  border-radius: 10px;
  transform-origin: center center;
  transform: scale(1);
  transition: transform 0.5s;
  position: relative;
  
  display: flex;
  align-items: center;
  flex-direction:column;
}
#jj_home_slides img {height:100%;}

#jj_home_slider_nav{max-width:500px;margin:auto;}
.jj_home_slide_img {height:500px;}

#jj_home_kontakt {text-align:center;height:238px;background-image: linear-gradient(0deg, #1D58A7 0%, #3975C4 94%);padding:40px;}
#jj_home_kontakt h3 {color:#E0F2FA;font-family:Poppins;font-size:28px;line-height:34px;font-weight:normal;}
#jj_home_kontakt a {background-color:#E0F2FA;padding:20px;text-decoration:none;font-family:Poppins;font-weight:800;color:var(--jj_blue);text-align:center;font-size: 17px;margin:10px;} 
.jj_button a {background-color:#E0F2FA;padding:20px;text-decoration:none;font-family:Poppins;font-weight:800;color:var(--jj_blue);text-align:center;font-size: 17px;margin:10px;} 
.jj_button2 a {background-color:var(--jj_blue);color:#FFF;padding:20px;text-decoration:none;font-family:Poppins;font-weight:800;text-align:center;font-size: 17px;margin:10px;} 
.jj_button2 {    width: 400px;
    margin: auto;
margin-bottom: 100px;}

#jj_home_kontakt_buttons{margin-top:45px;}

	
#jj_section2 {text-align: center;
    margin: auto;
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    column-gap: 50px;
    overflow: visible;
    max-width: 1280px;
align-items: center;}
#jj_section2_left {text-align:left;
    padding: 136px 0;}
#jj_section_3 {position: relative;
    height: 532px;
    max-width: 1280px;
    margin: 150px auto 0 auto;
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-gap: 50px;}
#jj_section_3_hardware {width: 355px;
    height: 355px;
    position: absolute;
    left: 0;
display:table;
background-image: url(/images/jjames/Smartparking-panels-hardware.jpg);}
#jj_section_3_software {
    width: 355px;
    height: 355px;
    position: absolute;
    left: 355px;
    display: table;
    background-image: url(/images/jjames/Smartparking-panels-software.jpg);
top: 177.5px;}
#jj_section_3_right {width: 465px;
    position: absolute;
right: 0;}
.jj_table_center {display: table-cell;vertical-align: middle;}
.jj_box_font {font-family: Poppins;font-size: 28px;text-align: center;}
.hw,.hw:hover {color: #1D58A7;}
.sw,.sw:hover {color:#7ECEE7;}
#jj_vorteile {text-align: center;margin-top:150px;}
#jj_vorteile_icons {max-width: 1280px;margin: 100px auto 150px auto;}
#jj_vorteile_grid { 
  display: grid; 
  grid-template-columns: 1fr 1fr 1fr 1fr; 
  grid-template-rows: 1fr 1fr; 
  gap: 80px 20px; 
  justify-items: center;
  grid-template-areas: 
    ". . . ."
    ". . . ."; 

}
.jj_vorteile {max-width:225px;}
.jj_vorteile h4 {margin-top:30px;}
.jj_vorteile img {height:5vw;width:auto;}
h4 {font-family: Poppins;
font-size: 17px;
color: #1D58A7;
text-align: center;}
#homeensionen {text-align:center;}
.jj_home_slide {height:313px;width:465px;background-image: linear-gradient(0deg, #1D58A7 0%, #3975C4 94%);}


#jj_footer_1 {background-color:#2F6AB8;height:130px;width:99vw;}
#jj_footer_2 {background-color:#1D58A7;height:80px;width:99vw;text-align:center;}
#jj_footer_2 img {max-height:50px;max-width:50px;margin: 15px 5px;}
#jj_footer_3 {background-color:#1D2362;height:100px;width:99vw;} 
.jj_footer_center {margin-left:10vw;}
.jj_footer_3_contact {width: 300px;margin:auto;
    text-align: center;
    padding-top: 20px;
    font-size: 14px;
    color: #FFFFFF;
    font-family: 'Poppins';}
	.jj_footer_3_contact a {text-decoration:none; color: #FFFFFF;font-weight:600;}
body.wrapper-fluid footer>.grid-child {padding:0;display:block;}
.jj_footer_menu1 p, .jj_footer_menu2 p {color:#fff;font-size:14px;font-family:"Poppins";}
.jj_footer_menu1, .jj_footer_menu2 {width: 120px;margin-top:20px;
display: inline-block;}
.jj_footer_menu2{margin-left:160px;}
#jj_erstgespr {background: #E5233A;
    height: 60px;
    width: 348px;
    font-family: Poppins;
    font-weight: 500;
    color: #fff;display:inline-block;margin-left:20%;}
footer {position:relative;font-family:'Poppins';}
.jj_links{text-decoration:none;}
	#jj_footer_laptop img {position: absolute;
    right: 5vw;
    bottom: 0;}

#jj_rez_slider {
    max-width: 1280px;
    margin: 50px auto;
}
#jj_rez_slides {
	display: flex;
  /*overflow-x: auto;*/
scroll-snap-type: x mandatory;
scroll-behavior: smooth;
-webkit-overflow-scrolling: touch;
margin-bottom:25px;
}
#jj_rez_slides::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
#jj_rez_slides::-webkit-scrollbar-thumb {
  background: black;
  border-radius: 10px;
}
#jj_rez_slides::-webkit-scrollbar-track {
  background: transparent;
}
#jj_rez_slides > div {
  scroll-snap-align: start;
  flex-shrink: 0;
  width: 425px;
  height: 313px;
  margin-right: 50px;
  border-radius: 10px;
  transform-origin: center center;
  transform: scale(1);
  transition: transform 0.5s;
  position: relative;
  
  display: flex;
  align-items: center;
  flex-direction:column;
}
 #jj_rez_slides > a {
  display: inline-flex;
  width: 1.5rem;
  height: 1.5rem;
  background: white;
  text-decoration: none;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  margin: 0 0 0.5rem 0;
  position: relative;
}
#jj_rez_slider > a:active {  top: 1px;}
#jj_rez_slider > a:focus {  background: #000;}
.jj_rez_slide_text {
    font-size: 18px;
    color: #FFFFFF;
    letter-spacing: 0;
    text-align: center;
    padding: 10px;
    margin: 5px 5px 20px 5px;}
.jj_rez_slide_name {font-size: 17px;
color: #E0F2FA;
text-align: center;}
.jj_rez_slide_cmp {position:absolute;bottom:20px;
    margin: auto;
	left:0;
	right:0;}
.jj_rez_slide_logo{margin:30px 0 10px 0;}
.jj_rez_slide > a {text-decoration:none;position:relative;height:100%;color:#fff;}
.dot  {height: 20px;
  width: 20px;
  background-color: #7ECEE7;
  border-radius: 50%;
display: inline-block;}
#jj_rez_slider_nav{margin-bottom:130px;}
.jj_bra_slider {background-color:#000;}
.jj_alle_branchen .jj_bra_slide {min-height:initial;height:400px;width:auto;}
.jj_alle_branchen img {height:350px;}
.jj_alle_branchen h2 {text-align:center;}
.jj_bra_slide {min-height:450px;}
.jj_bra_slide img {max-height:440px;width:auto;}

.jj_rez_slide {background-image: linear-gradient(0deg, #1D58A7 0%, #3975C4 94%);height:313px;width:30%;border-radius: 10px;margin-right:30px;display:block;}
.jj_rez_full {background-image: linear-gradient(0deg, #1D58A7 0%, #3975C4 94%);border-radius: 10px;margin-right:30px;display:block;position:relative;}
.jj_prod_slide {background-color: #2e69b8;
    height: 350px;
    width: 350px;
    margin-right: 30px;
    background-size: contain;
    background-position: 130px;
    background-repeat: no-repeat;
    border-radius: 10px;}
.jj_prod_slide h2{color: #fff;font-size:26px;
margin: 30px;}
.jj_prod_more {display: grid;
    position: absolute;
    bottom: 30%;
    height: 50px;
    width: 45%;
    text-align: center;
    font-size: 1.2rem;
    font-weight: 800;
    background-color: #fff;
    left: 30px;
align-items: center;}
.jj_rez_full_text p {
	
	font-family: Lora-Italic;
    font-size: 20px;
    color: #FFFFFF;
    letter-spacing: 0;
    text-align: center;}
.jj_rez_full_text {max-width: 600px;
    min-height: 50vh;
    margin: auto;
    padding: 100px;}

.jj_rez_full_cmp {position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    margin: auto;
	text-align:center;}
.jj_rez_full_logo{margin:30px 0 10px 0;}
.jj_rez_full_name{color:white;}
.jj_prod_info_text.jj_sw>ul>li {font-family:'Poppins';margin:15px 0;font-weight:600;}
.jj_prod_info_text.jj_sw>ul>li>ul {font-family:'Poppins';font-weight:400;} 
.jj_alle_branchen {margin:30px auto;max-width:1280px;} 



/* HARDWARE */
#jj_img_designerschranke {position: absolute;
    bottom: 22%;
    right: 28%;
height: 55%;}
#jj_hardware_top {

    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6%;
    /*background-image: url(/images/jjames/HG_Flaeche_Flip.png);*/
    background-position: right 500px;
    background-repeat: no-repeat;
    padding: 0 10%;
    margin: 130px auto 50px auto;}
	.jj_prod_info.jj_sw {height:auto;}
	.jj_prod_info_text.jj_sw {display:block;}
	.jj_hardware_text{display:flex;align-items:center;} 
.jj_hardware_text > p {max-width:465px;font-family:"Lora-Regular";}
.jj_prod_info { display: grid; height:900px;
  grid-template-columns: 1fr 1fr; 
gap: 20px;
    gap: 20px;
    padding: 5% 20%;
    position: relative;
    padding: 100px 10%;
    margin: 0 auto;
}
.jj_prod_info:nth-of-type(even){

background-image: linear-gradient(0deg, #1D58A7 0%, #3975C4 94%);
padding: 100px 10%}
.jj_prod_picture img {max-height:500px;margin:auto;}
.jj_prod_info:nth-of-type(even) *{color:#fff;}
.jj_prod_info_text{    display: flex;
    flex-direction: column;
    justify-content: center;color:#1d58a7;
	z-index:5;
} 
.yt_video {width:560px;height:315px;margin:20px auto;}
.jj_prod_info_img {    max-height: 700px;display: flex;align-items: center;justify-content:center;}
.jj_prod_info_img img {height:100%;max-height:600px;}
.jj_prod_arrow_down {width: 0px;
    height: 0px;
    border-left: 100px solid transparent;
    border-right: 100px solid transparent;
  
    position: absolute;
    bottom: -74px;

    z-index: 2;
}
.jj_hardware_img {display:flex;align-items:center;}


.top-info {position:relative;display:flex;justify-content:center;}
.jj_prod_info:nth-of-type(odd) .jj_prod_arrow_down {  border-top: 75px solid #fff;    left: 16%;}
.jj_prod_info:nth-of-type(even) .jj_prod_arrow_down {  border-top: 75px solid var(--jj_blue);    right: 16%;}
.jj_prod_info:nth-last-of-type() .jj_prod_arrow_down {display:none;}

/* Impressum */
  .impressum {  margin: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 8vw;
    /* grid-template-areas: ". ."; */
    padding-top: 50px;
  max-width: 40vw;}
  .imprint h2 {margin-top:60px;}
  .imprint h3 {margin-top:40px;}
/* BRANCHEN */
#jj_branchen_top {text-align: center;margin: 0 auto 100px auto;max-width:1280px;}
#jj_branchen_top img {max-height:450px;width:auto;}
.jj_branchen_text {max-width: 600px;
    margin: 50px auto;
text-align: center;}
.jj_branchen_grid{display: grid;
    grid-template-columns: 1fr 1fr;
    width: 1280px;
    margin: auto;
    align-items: center;}
.jj_branchen_txt {padding:30px;}
.jj_branchen_bot h2 {text-align:center}
.jj_branchen_bot >h2 {margin-top:100px;}
.jj_margin_top100{margin-top:100px;}
.jj_branchen_mehr {display: grid;grid-template-columns: 25vw 25vw 25vw;margin: 3vw auto;gap: 0 50px;align-content: center;justify-content: center;}
.jj_branchen_mehr div {width:25vw;height:25vw;} 
.swiper-container.jj_slide_branchen {margin:100px 0;} 
.jj_slide_branchen .swiper-slide {background-image: linear-gradient(0deg, #1D58A7 0%, #3975C4 94%);}
.jj_slide_branchen .swiper-caption {background:unset;width:auto;}
.jj_slide_branchen .swiper-title {font-weight:600;}
.jj_slide_branchen div.swiper-slide {width:390px;} 
.jj_slide_branchen .swiper-img-cont {background-position:-30px;width: 60%;background-size:420px;
    right: 0;
    position: absolute;}
	.jj_slide_branchen .swiper-button
	{position: absolute;
    bottom: 25%;
    width: 184px;
    font-weight: 800;}
.jj_branchen_mehr div {display: flex;justify-content: center;background-size: 100%;background-repeat: no-repeat;background-position: 0 40px;}
.jj_branchen_mehr .jj_branche_tourismus {background-image:url('/images/branchen/03_Tourismus.png');}
.jj_branchen_mehr .jj_branche_infrastruktur {background-image:url('/images/branchen/05_Infrastructure.png');}
.jj_branchen_mehr .jj_branche_immobilien {background-image:url('/images/branchen/05_Infrastructure.png');}
.jj_branchen_mehr .jj_branche_kommunen{background-image:url('/images/branchen/01_Stadt.png');}
.jj_branchen_mehr .jj_branche_industrie{background-image:url('/images/branchen/02_Bauhof.png');}
.jj_branchen_mehr .jj_branche_freizeit{background-image:url('/images/branchen/06_Freizeit.png');}
/* ÜBER UNS */
#jj_about p {max-width:900px;margin:auto;font-family:Poppins;text-align:center;margin:50px auto;}
#jj_about ul {list-style:none;}
.jj_bold {font-weight:700;}
#jj_about h2 {text-align:center;margin-top:100px;}
.jj_vcard h3 {text-align:left;}
#jj_about .jj_vcard p {text-align:left;margin:0;color: var(--jj_darkblue);}
#jj_about #jj_home_kontakt {margin: 100px 0;}
.jj_vcard {display: flex;
align-items:center;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: flex-start;
	max-width:1280px;margin:100px auto;}
.jj_vcard>div:nth-child(1) {
	max-width:250px;
    -webkit-order: 0;
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
    }
.jj_vcard>div:nth-child(2) {
	max-width:850px;
    -webkit-order: 0; 
    -ms-flex-order: 0;
    order: 0;
    -webkit-flex: 1 2 auto;
    -ms-flex: 1 2 auto;
    flex: 1 2 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
    align-self: auto;
	padding:30px;
    }
	.jj_vcard>div {margin:0 20px;}
.jj_vcard h3 {font-family: Poppins;
color: var(--jj_darkblue);
    font-size: 28px;
    font-weight: 500;}
.jj_grid_2 {text-align: center;
    margin: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 50px;
    overflow: visible;
    max-width: 1280px;
align-items: center;}
.jj_top_img {    max-width: 1024px;
margin: 0 auto 100px auto;}

#jj_about .jj_grid_2 {margin-bottom:100px;}
#jj_about .jj_grid_text p {text-align:left;margin:20px auto;}
/* BEGIN PRODUCT COMPARISION CHART */
/* HARI */
.cd-products-table * {list-style:none;}
ul.cd-features-list,ul.cd-products-columns {padding:0;min-width:300px;}
ul.cd-products-columns {display: flex;
    align-items: flex-end;
    list-style: none;
    margin: auto;
    width: fit-content;}
li.product > ul.cd-features-list > li{font-family: "Poppins";font-weight:600
font-size: 14px;
color: #1D2362;
letter-spacing: 0;
text-align: center;
line-height: 22px;}
li.product.jj_features > ul.cd-features-list > li{font-family: "Poppins";font-weight:400;
font-size: 14px;
color: #1D2362;
letter-spacing: 0;
text-align: center;
line-height: 22px;}
.product h3 {font-family: Poppins;
    font-weight: 500;
    font-size: 20px;
    color: #1D2362;
    height: 110px;
    display: flex;
    align-items: flex-end;
    /* text-align: center; */
    justify-content: space-around;}





/* -------------------------------- 

Main Components 

-------------------------------- */
.cd-products-comparison-table {
  margin-bottom: 6em;
}
.cd-products-comparison-table::after {
  /* never visible - this is used in jQuery to check the current MQ */
  display: none;
  content: 'mobile';
}
.cd-products-comparison-table header {
  padding: 0 5% 25px;
      max-width: 60%;
    margin: auto;
    text-align: center;
}
.cd-products-comparison-table header::after {
  clear: both;
  content: "";
  display: table;
}
.cd-products-comparison-table .actions {
  float: right;
}
.cd-products-comparison-table .reset, .cd-products-comparison-table .filter {
  font-size: 1.4rem;
}
.cd-products-comparison-table .reset {
  color: #404042;
  text-decoration: underline;
}
.cd-products-comparison-table .filter {
  padding: .6em 1.5em;
  color: #ffffff;
  background-color: #cccccc;
  border-radius: 3px;
  margin-left: 1em;
  cursor: not-allowed;
  -webkit-transition: background-color 0.3s;
  -moz-transition: background-color 0.3s;
  transition: background-color 0.3s;
}
.cd-products-comparison-table .filter.active {
  cursor: pointer;
  background-color: #9dc997;
}
.no-touch .cd-products-comparison-table .filter.active:hover {
  background-color: #a7cea1;
}
@media only screen and (min-width: 1170px) {
  .cd-products-comparison-table {
    margin-bottom: 8em;
  }
  .cd-products-comparison-table::after {
    /* never visible - this is used in jQuery to check the current MQ */
    content: 'desktop';
  }
  .cd-products-comparison-table header {
    padding: 0 5% 40px;
  }
  .cd-products-comparison-table h2 {
    font-size: 2.4rem;
  }
  .cd-products-comparison-table .reset, .cd-products-comparison-table .filter {
    font-size: 1.6rem;
  }
  .cd-products-comparison-table .filter {
    padding: .6em 2em;
    margin-left: 1.6em;
  }
}

.cd-products-table {
  position: relative;
  overflow: hidden;
width:fix-content;
margin:auto;
}

.cd-products-table .features {
  /* fixed left column - product properties list */
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 120px;
  
}
.cd-products-table .features::after {
  /* color gradient on the right of .features -  visible while scrolling inside the .cd-products-table */
  content: '';
  position: absolute;
  top: 0;
  left: 100%;
  width: 4px;
  height: 100%;
  background-color: transparent;
  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.06), transparent);
  background-image: linear-gradient(to right,rgba(0, 0, 0, 0.06), transparent);
  opacity: 0;
}
@media only screen and (min-width: 1170px) {
  .cd-products-table .features {
    width: 210px;
  }
}

.cd-products-table.scrolling .features::after {
  opacity: 1;
}

.cd-products-wrapper {
  overflow-x: auto;
  /* this fixes the buggy scrolling on webkit browsers - mobile devices only - when overflow property is applied */
  -webkit-overflow-scrolling: touch;
}

.cd-products-columns {
  /* products list wrapper */
  
  margin-left: 120px;
}
.cd-products-columns::after {
  clear: both;
  content: "";
  display: table;
}
@media only screen and (min-width: 1170px) {
  .cd-products-columns {
    
    margin-left: 210px;
  }
}
.cd-products-columns .product.jj_features{width:300px;}
.cd-table-navigation{list-style:none;}
.cd-products-columns .product {
  position: relative;
  float: left;
  width: 150px;
  text-align: center;
  -webkit-transition: opacity 0.3s, visibility 0.3s, -webkit-transform 0.3s;
  -moz-transition: opacity 0.3s, visibility 0.3s, -moz-transform 0.3s;
  transition: opacity 0.3s, visibility 0.3s, transform 0.3s;
}
.filtering .cd-products-columns .product:not(.selected) {
  opacity: 0;
  visibility: hidden;
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
}
.no-product-transition .cd-products-columns .product.selected {
  -webkit-transition: opacity 0.3s, visibility 0.3s;
  -moz-transition: opacity 0.3s, visibility 0.3s;
  transition: opacity 0.3s, visibility 0.3s;
}
.filtered .cd-products-columns .product:not(.selected) {
  position: absolute;
}
@media only screen and (min-width: 1170px) {
  .cd-products-columns .product {
    width: 150px;
	margin:0 20px;
  }
}

.cd-features-list li {
    font-size: 14px;
    font-weight: normal;
    padding: 10px 10px;
    border-color: #1D58A7;
    border-style: solid;
    border-bottom: 1px solid;
    border-top: 0;
    border-left: 0;
    border-right: 0;
}
.cd-features-list li.rate {
  /* rating stars */
  padding: 21px 0;
}
.cd-features-list li.rate span {
  display: inline-block;
  height: 22px;
  width: 110px;
  /*background: url(../img/cd-star.svg);*/
  color: transparent;
}
@media only screen and (min-width: 1170px) {
  .cd-features-list li {
    font-size: 14px;
  }
  .cd-features-list li.rate {
    padding: 22px 0;
  }
}

.features .cd-features-list li{
  /* fixed left column - items */
  font-family: Poppins;font-weight:400;
font-size: 14px;
color: #1D2362;
letter-spacing: 0;
text-align: center;
line-height: 22px;
  padding: 25px 10px;
   
}
.cd-products-table .features .top-info {
  /* fixed left column - items */
  font-family: "Poppins";font-weight:600;
font-size: 14px;
color: #1D2362;
letter-spacing: 0;
text-align: center;
line-height: 22px;
  padding: 25px 10px;
   
}
@media only screen and (min-width: 1170px) {
  .features .cd-features-list li,
  .cd-products-table .features .top-info {
    text-transform: uppercase;
    line-height: 22px;
    padding: 10px 20px;letter-spacing: 1px;
  }
}

.features .cd-features-list li {
  /* truncate text with dots */
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.cd-products-table .top-info {
  position: relative;
  height: auto;
  width: 150px;
  text-align: center;
  padding: 1.25em 2.5em;
  -webkit-transition: height 0.3s;
  -moz-transition: height 0.3s;
  transition: height 0.3s;
  cursor: pointer;

}
.cd-products-table .top-info::after {
  /* color gradient below .top-info -  visible when .top-info is fixed */
  content: '';
  position: absolute;
  left: 0;
  top: 100%;
  height: 4px;
  width: 100%;
  background-color: transparent;
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.06), transparent);
  background-image: linear-gradient(to bottom,rgba(0, 0, 0, 0.06), transparent);
  opacity: 0;
}
.cd-products-table .top-info h3 {
  font-family: 'Poppins';
font-size: 20px;
color: #1D2362;
text-align: center;}
.cd-products-table .top-info img {
  display: block;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.cd-products-table .top-info h3, .cd-products-table .top-info img {
  -webkit-transition: -webkit-transform 0.3s;
  -moz-transition: -moz-transform 0.3s;
  transition: transform 0.3s;
}
.cd-products-table .top-info .check {
  position: relative;
  display: inline-block;
  height: 16px;
  width: 16px;
  margin: 0 auto 1em;
}
.cd-products-table .top-info .check::after, .cd-products-table .top-info .check::before {
  /* used to create the check icon and green circle dot - visible when product is selected */
  position: absolute;
  top: 0;
  left: 0;
  content: '';
  height: 100%;
  width: 100%;
}
.cd-products-table .top-info .check::before {
  /* green circle dot */
  border-radius: 50%;
  border: 1px solid #e6e6e6;
  background: #ffffff;
  -webkit-transition: background-color 0.3s, -webkit-transform 0.3s, border-color 0.3s;
  -moz-transition: background-color 0.3s, -moz-transform 0.3s, border-color 0.3s;
  transition: background-color 0.3s, transform 0.3s, border-color 0.3s;
}
.cd-products-table .top-info .check::after {
  /* check icon */
  /*background: url(../img/cd-check.svg) no-repeat center center;*/
  background-size: 24px 24px;
  opacity: 0;
  -webkit-transition: opacity 0.3s;
  -moz-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
@media only screen and (min-width: 1170px) {
  .cd-products-table .top-info {
    height: 280px;
    width: 150px;
  }
  .cd-products-table .top-info h3 {
    padding-top: 1.4em;
    font-family: 'Poppins';
font-size: 20px;
color: #1D2362;
text-align: center;
  }
  .cd-products-table .top-info .check {
    margin-bottom: 1.5em;
  }
}

.cd-products-table .features .top-info {
  /* models */
  width: 120px;
  cursor: auto;

}
@media only screen and (min-width: 1170px) {
  .cd-products-table .features .top-info {
    width: 210px;
  }
}

.cd-products-table .selected .top-info .check::before {
  /* green circle dot */
  background: #9dc997;
  border-color: #9dc997;
  -webkit-transform: scale(1.5);
  -moz-transform: scale(1.5);
  -ms-transform: scale(1.5);
  -o-transform: scale(1.5);
  transform: scale(1.5);
  -webkit-animation: cd-bounce 0.3s;
  -moz-animation: cd-bounce 0.3s;
  animation: cd-bounce 0.3s;
}

@-webkit-keyframes cd-bounce {
  0% {
    -webkit-transform: scale(1);
  }
  60% {
    -webkit-transform: scale(1.6);
  }
  100% {
    -webkit-transform: scale(1.5);
  }
}
@-moz-keyframes cd-bounce {
  0% {
    -moz-transform: scale(1);
  }
  60% {
    -moz-transform: scale(1.6);
  }
  100% {
    -moz-transform: scale(1.5);
  }
}
@keyframes cd-bounce {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  60% {
    -webkit-transform: scale(1.6);
    -moz-transform: scale(1.6);
    -ms-transform: scale(1.6);
    -o-transform: scale(1.6);
    transform: scale(1.6);
  }
  100% {
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
  }
}
.cd-products-table .selected .top-info .check::after {
  /* check icon */
  opacity: 1;
}

@media only screen and (min-width: 1170px) {
  .cd-products-table.top-fixed .cd-products-columns > li,
  .cd-products-table.top-scrolling .cd-products-columns > li,
  .cd-products-table.top-fixed .features,
  .cd-products-table.top-scrolling .features {
    padding-top: 160px;
  }

  .cd-products-table.top-fixed .top-info,
  .cd-products-table.top-scrolling .top-info {
    height: 160px;
    position: fixed;
    top: 0;
  }
  .no-cssgradients .cd-products-table.top-fixed .top-info, .no-cssgradients
  .cd-products-table.top-scrolling .top-info {
    border-bottom: 1px solid #e6e6e6;
  }
  .cd-products-table.top-fixed .top-info::after,
  .cd-products-table.top-scrolling .top-info::after {
    opacity: 1;
  }
  .cd-products-table.top-fixed .top-info h3,
  .cd-products-table.top-scrolling .top-info h3 {
    -webkit-transform: translateY(-116px);
    -moz-transform: translateY(-116px);
    -ms-transform: translateY(-116px);
    -o-transform: translateY(-116px);
    transform: translateY(-116px);
  }
  .cd-products-table.top-fixed .top-info img,
  .cd-products-table.top-scrolling .top-info img {
    -webkit-transform: translateY(-62px) scale(0.4);
    -moz-transform: translateY(-62px) scale(0.4);
    -ms-transform: translateY(-62px) scale(0.4);
    -o-transform: translateY(-62px) scale(0.4);
    transform: translateY(-62px) scale(0.4);
  }

  .cd-products-table.top-scrolling .top-info {
    position: absolute;
  }
}
.cd-table-navigation a {
  position: absolute;
  z-index: 2;
  top: 0;
  right: 15px;
  -webkit-transform: translateY(55px);
  -moz-transform: translateY(55px);
  -ms-transform: translateY(55px);
  -o-transform: translateY(55px);
  transform: translateY(55px);
  /* replace text with image */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  color: transparent;
  height: 60px;
  width: 40px;
  /*background: rgba(64, 64, 66, 0.8) url("../img/cd-arrow.svg") no-repeat center center;*/
  border-radius: 3px;
  -webkit-transition: background-color 0.3s, opacity 0.3s, visibility 0.3s, -webkit-transform 0.3s;
  -moz-transition: background-color 0.3s, opacity 0.3s, visibility 0.3s, -moz-transform 0.3s;
  transition: background-color 0.3s, opacity 0.3s, visibility 0.3s, transform 0.3s;
}
.cd-table-navigation a.inactive {
  opacity: 0;
  visibility: hidden;
}
.cd-table-navigation a.prev {
  left: 120px;
  right: auto;
  -webkit-transform: translateY(55px) translateX(15px) rotate(180deg);
  -moz-transform: translateY(55px) translateX(15px) rotate(180deg);
  -ms-transform: translateY(55px) translateX(15px) rotate(180deg);
  -o-transform: translateY(55px) translateX(15px) rotate(180deg);
  transform: translateY(55px) translateX(15px) rotate(180deg);
}
.no-touch .cd-table-navigation a:hover {
  background-color: #404042;
}
@media only screen and (min-width: 1170px) {
  .cd-table-navigation a {
    -webkit-transform: translateY(100px);
    -moz-transform: translateY(100px);
    -ms-transform: translateY(100px);
    -o-transform: translateY(100px);
    transform: translateY(100px);
  }
  .cd-table-navigation a.prev {
    left: 210px;
    -webkit-transform: translateY(100px) translateX(15px) rotate(180deg);
    -moz-transform: translateY(100px) translateX(15px) rotate(180deg);
    -ms-transform: translateY(100px) translateX(15px) rotate(180deg);
    -o-transform: translateY(100px) translateX(15px) rotate(180deg);
    transform: translateY(100px) translateX(15px) rotate(180deg);
  }
  .top-fixed .cd-table-navigation a {
    position: fixed;
  }
  .top-fixed .cd-table-navigation a, .top-scrolling .cd-table-navigation a {
    -webkit-transform: translateY(45px);
    -moz-transform: translateY(45px);
    -ms-transform: translateY(45px);
    -o-transform: translateY(45px);
    transform: translateY(45px);
  }
  .top-fixed .cd-table-navigation a.prev, .top-scrolling .cd-table-navigation a.prev {
    -webkit-transform: translateY(45px) translateX(15px) rotate(180deg);
    -moz-transform: translateY(45px) translateX(15px) rotate(180deg);
    -ms-transform: translateY(45px) translateX(15px) rotate(180deg);
    -o-transform: translateY(45px) translateX(15px) rotate(180deg);
    transform: translateY(45px) translateX(15px) rotate(180deg);
  }
}



/* END PCC */



#jj_home_kontakt_buttons >a > joomla-hidden-mail>a {padding:0;margin:0;}

@media all and (min-width:600px) {
	
	

#jj_home_kontakt_buttons br {display:none;}

}













/* 1280 */

@media all and (max-width:1280px) {
	p, h1,h2,h3,h4,h5,h6 {padding:0 10px;}
#jj_erstgespr {margin-left:0;}
.jj_footer_menu2{margin-left:100px;}

}



/* MOBILE */
@media all and (max-width:850px) {
	.jj_bra_slide{min-height:50vh;}
	.flickity-viewport{height:380px;}
#jj_home_kontakt a {display:block;}
#jj_home_kontakt{height:unset;}
#jj_about .jj_grid_2 {margin-bottom:70px;}
.jj_grid_2 {display:block;}
.jj_grid_text {padding:20px;}
.jj_button{margin-top:100px;}
#jj_img_designerschranke {position:relative;right:unset;}
.jj_rez_slide {min-width:400px;}
#branchenloesungen {padding-top:30px;}
.jj_branchen_grid {grid-template-columns: 1fr;
width: 100%;}
.jj_branchen_img: -type(odd) {
	grid-row:2;
	
}
}

@media (max-width: 767.98px) {
	.container-header .container-nav .container-search, .container-header .container-nav nav {justify-content:center;}
}
@media all and (max-width:600px) {
	#schranken {z-index:0;}
	.langswitch {width: 80px;
    margin: auto;position:initial;display:block;text-align:center;}
@keyframes schranken {
  from {transform: rotate(0deg);}
  to {transform: rotate(85deg);}
  99%{right:0;top:568px;width:1344px;}
  100%{position:absolute;right:3px;left:unset;top:450px;width:50vw;z-index:0;}
}
	.jj_vcard>div {margin:auto;}
	.yt_video {width:100%;min-height:230px;}
	h2 {text-align:center;}
	#branchenloesungen {display:block;}
	.com-content-article__body{padding:10px;}
	#jj_section2{display:block;}
	#jj_section_3 {display:block;height:unset;}
	#jj_section_3_hardware {position:relative;left:unset;margin:20px auto;}
	#jj_section_3_software {position:relative;left:unset;top:unset;margin:20px auto;}
	#jj_section_3_right {width: unset;position: relative;right:unset;}
	#jj_vorteile_grid {grid-template-areas:unset;grid-template-columns: 1fr 1fr;gap: 30px 20px;}
	.jj_vorteile img {height:50px;}
	#jj_footer_laptop{display:none;}

	 
	.jj_footer_menu1, .jj_footer_menu2 {width:90vw;margin: 10px auto;display:block;}
	#jj_footer_1 {height:unset;}
	.jj_footer_center {margin:6vw;}
	#jj_erstgespr {width:88vw;margin:auto;display:block;}
	footer,.footer {background-color:#2F6AB8;background-image:unset;}
	#jj_rez_slides > div {width:100%;}
	#jj_topbar {height:unset;}
	.jj_topbar_left, .jj_topbar_right {position:relative;display:block;width:unset;height:unset;left:unset;}
	.jj_topbar_left a {display:block;}
	.metismenu-item {width:unset;}
	.jj_footer_menu1 p, .jj_footer_menu2 p {font-size:unset;}
	#jj_hardware_top{display:block;padding:10px;margin:20px auto;}
	h1{font-size:36px;}
	h2 {font-size:26px;}
	.cd-products-comparison-table header{max-width:unset;}
	.jj_prod_info{
    display: grid;
    padding: 40px 5px;
    height: auto;
    grid-template-columns: 1fr;}
	.jj_prod_info_text{display:block;width:100%;grid-row:2;}
	.jj_prod_info:nth-of-type(even) {padding:40px 10px;}
	.jj_prod_arrow_down:last-of-type {display:none;}
}


#form_whitelist li:nth-of-type(odd), #form_kameralist li:nth-of-type(odd) {background-color:#c0d7f5;}
#form_whitelist ul, #form_kameralist ul {list-style:none;}
#form_whitelist li:first-of-type, #form_kameralist li:first-of-type{background-color:#2F6AB8;color:white;font-weight:bold;}
#form_whitelist li,#form_kameralist li {padding:0 5px;}