/*******************************************************************************************/
/*** ALLGEMEIN *****************************************************************************/
/*******************************************************************************************/
html {
    background: /*#424242*/#000;
}

body{
  background-color: #000!important;
  }
  
::selection {
  background: #00a8e7;
  color: #ffffff;
}
::-moz-selection{
  background: #00a8e7;
  color: #ffffff;
}

ul {
    list-style: square;
}

/* ANTI SPAM */
.captcha-image {
    width: 100%!important;
    margin: 10px 0!important;
    text-align: left!important;
    border: 0!important;
    padding: 0!important;
}
.captcha-image .cf7ic_instructions span {
    color: #00a8e7!important;
}
.captcha-image label>input:checked+svg, .captcha-image label>input:focus+svg {
    border: 2px solid #00a8e7!important;
}
.captcha-image svg {
    padding: 5px!important;
    width: 40px!important;
    height: 40px!important;
}
.cf7ic_instructions {
    margin-bottom: 10px!important;
}

/*******************************************************************************************/
/*** HEADER ********************************************************************************/
/*******************************************************************************************/

/*Sticky Header Fehler Safari fix*/
/*
#kad-mobile-banner, .stickyheader #kad-banner {
transform: translate3d(0,0,0);
position: fixed;
z-index: 99999;
top: 0;
width: 100%;
}
*/
.mfp-bg.mfp-ready, .mfp-wrap.mfp-close-btn-in.mfp-auto-cursor.mfp-ready{
  z-index:999999;
}

.topbar-icon-4 i:before {
    content: "Jetzt Angebot anfordern";
    color: #000000!important;
    background: #ffcf00;
    display: block;
    padding: 0px 5px;
    text-transform: uppercase;
    transition: 0.25s;
    font-weight: bold;
    letter-spacing: 1px;
    border-radius:2px;
}

.topbar-icon-4 i:hover:before {
    background: #144378;
    transition: 0.25s;
    color:#fff!important;
}

a.topbar-icon-4:hover {
    background: none!important;
}



h1.entry-title {
/*    color: #00a8e7; */
}
#menu-hauptnavigation {
    text-transform: uppercase;
}

.widget-first .textwidget {
    font-size: 12px;
    line-height: 35px;
    position: absolute;
    z-index:999;
}
@media (max-width:767px){
  .widget-first .textwidget {
    top: -24px;
    left: 120px;
    line-height: normal;
}
.topbar-icon-4 i{
  right: 0;
  position: absolute;
}
}

@media (max-width:500px){
  .widget-first .textwidget {
    top: -60px;
    left: 120px;
    line-height: normal;
}
.topbar-icon-4 i{
    position: absolute;
    margin: 0 auto;
    width: 100%;
    text-align: center;
    margin-top: 30px;
}
.topbar_social {
    height: 70px;
}
}


#nav-main .sf-menu ul, .nav-main .sf-menu ul, #nav-second .sf-menu ul, .topbarmenu .sf-menu ul {
  width: auto;
}

.headerclass, .mobile-headerclass, .kt-mainnavsticky .sticky-wrapper.is-sticky #nav-main {
    background: rgba(0, 0, 0, 0.90)!important;
}

.topbar_social a i:before {
color: #9b9e9e;
}

/*** Stellenanzahl KARRIERE *****************************************************************/

.menu-karriere:before {
    content: "4";
    position: absolute;
    right: 8px;
    top: 3px;
    background: #236da5;
    width: 14px;
    height: 14px;
    border-radius: 50px;
    font-size: 11px;
    z-index: 0;
    text-align: center;
    line-height: 14px;
}

/*******************************************************************************************/
/*** SLIDER ********************************************************************************/
/*******************************************************************************************/
/*.kad-slide-1 {
    background: rgb(0,0,0);
    background: linear-gradient(0deg, rgba(0,0,0,1) 50%, rgb(62, 62, 62) 100%)!important;
}*/

/*** TEMP!! IOZZO – BOHNENSTENGEL ***/
.slider-links{
  display:none;
}
@media (max-width:800px){
#sliderfacts{
  display:none;
}
.kad-slide.kad-slide-1:before {
  display:none;
}
.ksp-layer-8{
transform: scale(2)!important;
}
}
@media (max-height:850px){
#sliderfacts{
  display:none;
}
.kad-slide.kad-slide-1:before {
  display:none;
}
}

.kad-slide.kad-slide-1:before {
    content: "";
    background: url(https://www.iozzo.de/wp-content/uploads/Website-iozzzo-Bohnenstengel_crop.png);
    width: 100%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: 27vw;
}

/**** END TEMP ****/


@media (min-width:801px){
#angebot-slider-button{
 display: block;
}

div a:has(#angebot-slider-button-mobile){
 display: none; 
}
}

@media (max-width:800px){
div a:has(#angebot-slider-button){
 display: none;
}

#angebot-slider-button-mobile{
 display: block; 
}
}

@media (max-height:600px){
.ksp-layer-wrap:has(#angebot-slider-button-mobile) #angebot-slider-button-mobile{
  font-size:2vw;
}
.ksp-layer-wrap:has(#angebot-slider-button-mobile){
    top: 20px!important;
    right: 20px;
    left: unset !important;
}
}

.seq-preloader {
    background: #000!important;
}

a .slider-links { 
  color:#ffffff;
  transition: 0.25s;
  padding: 0 10px 0 10px;
}
a .slider-links:hover{ 
  color:#111111;
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
  transition:0.25s;
  background: rgba(255, 255, 255, 0.4);
  padding: 3px 10px 0 10px;
}

.slider-link-elektro {
  background: url(https://www.iozzo.de/wp-content/uploads/elektro_w.png);
  background-size: contain;
  height: 50px;
  background-repeat: no-repeat;
  background-position: center;
  margin-bottom: 3px;
}
.slider-link-klima {
  background: url(https://www.iozzo.de/wp-content/uploads/klima_w.png);
  background-size: contain;
  height: 50px;
  background-repeat: no-repeat;
  background-position: center;
  margin-bottom: 3px;
}
.slider-link-solar {
  background: url(https://www.iozzo.de/wp-content/uploads/solar_w.png);
  background-size: contain;
  height: 50px;
  background-repeat: no-repeat;
  background-position: center;
  margin-bottom: 3px;
}

@media (max-width:800px){
.ksp-image-layer {
    position: relative;
    /*margin-top: 20vh;*/
    margin-top: 10vh;
}
.slider-links{
  display:none;
}
}

/*******************************************************************************************/
/*** CONTENT *******************************************************************************/
/*******************************************************************************************/

.contentclass {
    padding-top: 0;
}
h1.entry-title {
    padding-top: 50px;
}


/*** Akkordeon ***/
.panel-heading h5 {
    color: #00a8e7;
    margin: 5px 0;
}
.panel.panel-default {
    margin-bottom: 5px;
    border: none;
    background: #000;
}
.panel-body {
    border-top: none;
}

.wp-caption-text {
    font-size: 12px;
}


/*** Kontaktformular ***/

.wpcf7 textarea, .wpcf7 input {
    background: #232323;
    color: #ffffff;
    border: 1px solid #414141;
    max-width:none;
}

.wpcf7 input.wpcf7-submit {
    width: 100%;
    padding: 5px;
    text-transform:uppercase;
}
div.wpcf7-validation-errors, div.wpcf7-acceptance-missing {
    border: 2px solid #00a8e7;
}

span.wpcf7-list-item {
    margin: 0 1em 0 0;
}

/*******************************************************************************************/
/*** PORTFOLIO *****************************************************************************/
/*******************************************************************************************/

/*Kategorie Seite*/
.tax-portfolio-type #content p:first-child {
    font-size: 20px;
    margin-bottom: 30px;
    line-height:  30px;
}
.tax-portfolio-type #content p:first-child a {
    color: #000;
    background: #fecf00;
    padding: 4px 8px;
    border-radius: 2px;
}

.portfolio_item:hover {
    opacity: 1!important;
    transition: 0.25s!important;
}
.portfolio_item {
    opacity: 0.75!important;
    transition: 0.25s!important;
}

.piteminfo p {
    font-size: 12px;
    letter-spacing: 1px;
    margin:0;
}
p.cportfoliotag {
    display: none; 
}
.portfolio_item .portfoliolink {
  opacity:0.75;
}
.init-mosaic-isotope .g_mosiac_item:after{
  border-bottom: 6px solid #111111;
  border-right: 6px solid #111111;
}
.init-mosaic-isotope .portfolio_item .portfoliolink {
    border-right: solid 6px #111111;
}
.cportfoliotag {
    text-transform: uppercase;
    letter-spacing: 0.8px;
}
.imghoverclass, .p-item .imghoverclass.mosaic_item_wrap {
    transition: 0.25s;
}
/*.imghoverclass:hover, .p-item .imghoverclass.mosaic_item_wrap:hover {
    opacity: 0.5!important;
    transition: 0.25s;
}*/

.portfolio_item .portfoliolink {
    background: rgba(255, 255, 255, 0.7);
}

#portfolio-carousel-gallery {
    max-width: 1140px;
    margin: 0 auto 30px auto;
}

.slick-dots {
    display: none!important;
}

#filters li a h5 {
    color: #fff;
    transition: 0.25s;
}

#filters li a.selected h5 {
    color: #00a8e7;
}
#filters li a h5:hover {
    color: #00a8e7;
    transition: 0.25s;
}


/*******************************************************************************************/
/*** FOOTER ********************************************************************************/
/*******************************************************************************************/
#containerfooter {
    padding-top: 0;
}
.footercredits {
    padding-top: 10px;
    padding-bottom: 0;
}

/*******************************************************************************************/
/*** MOBILE ********************************************************************************/
/*******************************************************************************************/
.kad-menu-name:hover, .icon-menu:hover {
    
}
@media (max-width:767px){
h1.entry-title {
    padding-top: 0px;
}
.portfoliolink p.p_excerpt {
    display: none;
}
}

.kad-mobile-nav .kad-nav-inner li ul.sf-dropdown-menu a {
    list-style: square;
}

/*******************************************************************************************/
/*** Annimationen **************************************************************************/
/*******************************************************************************************/
@keyframes appear-on-load {
  0% {
    opacity: 0;
  }
 /* 50% {
    opacity: 0;
  } */
  100% {
    opacity: 1;
  }
}
.kad-slider-canvas {
    background: #000000;
}
.kad-slide{
    animation: 2s ease-out 0s 1 appear-on-load;
}
