/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 27 2024 | 11:48:21 */
/* CSS Imagetexte (Strings)

<div class="image-text">Inhalte schaffen<strong class="corp-dark-grey-accent">.</strong></div>
oder 
<div class="image-text-vertical">Inhalte schaffen<strong class="corp-dark-grey-accent">.</strong></div>
oder
<div class="image-text-vertical-right">Inhalte schaffen<strong class="corp-dark-grey-accent">.</strong></div>
*/

.accent-color
{
	color:var(--hex-corp-accent-color);
}


.accent-color2
{
	color:var(--hex-corp-accent-color2);
}

.accent-color
{
	color:var(--hex-corp-accent-color);
}


.corp-dark-grey-accent
{
	color:var(--hex-corp-dark-grey);
}


.image-text,
.image-text-vertical,
.image-text-vertical-right
{
	font-size:3rem;
	line-height:3.5rem;
	font-weight:300 !important;

	
	/* color: var(--hex-corp-black); */
	color:transparent;
	background: linear-gradient(45deg, rgba(var(--rgb-corp-transition6), 1) 0%, rgba(var(--rgb-corp-transition5), 1) 50%, rgba(var(--rgb-corp-transition4), 1) 100%);
	background-clip: text;
	-webkit-background-clip: text; 


  -webkit-transition: color 2s ease, border-top-color 2s !important;
  -moz-transition: color  2s ease, border-top-color 2s !important;
  -o-transition: color  2s ease, border-top-color 2s !important;
  transition: color  2s ease, border-top-color 2s !important;
	
	

}

.image-text strong,
.image-text-vertical strong
{
	font-weight:400 !important;
}


.image-text-vertical strong
{
	display:none;
}




.image-text-vertical
{

	/* writing-mode: vertical-lr; */
	writing-mode: vertical-rl;
	/* text-orientation: upright; */
    -ms-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
	text-align: right !important;
	font-size:3.5rem;
	line-height:6.3rem;
	margin-top:auto;
	margin-bottom:auto;
}


.image-text-vertical-right
{

	/* writing-mode: vertical-lr; */
	writing-mode: vertical-rl;
	/* text-orientation: upright; */
    -ms-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
	text-align: left !important;
	font-size:4.5rem;
	line-height:7.3rem;
	margin-top:auto;
	margin-bottom:auto;
}


@media only screen and (max-width: 980px) {

	.image-text-vertical,
	.image-text-vertical-right
	{
		font-size:3rem !important;
	}
	.image-text
	{
		font-size:2.5rem !important;
	}

}
/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 27 2024 | 11:49:30 */
/* Divi Layout      CSS Code hier einfügen.

Zum Beispiel:
.example {
    color: red;
}

Um dein CSS-Wissen zu prüfen, teste es hier http://www.w3schools.com/css/css_syntax.asp

Kommentarende*/ 

/* Divi Layout */

@media (max-width: 980px)
{

	/* Reihenfolge von Spalten responsive ändern */ 
	/* äußeren wrpper drehen, innen wrapper zurückdrehen */
	.flip-content-responsive:nth-of-type(1),
	.flip-content-responsive-first-of-type
	{ transform: scaleY(-1); }
	
	.flip-content-responsive-first-of-type .et_pb_column:nth-of-type(1), 
	.flip-content-responsive .et_pb_column
	{ transform: scaleY(-1); }
	
	#main-content .et_pb_image_wrap img
	{
		display:block;
		margin-left:auto;
		margin-right:auto;
	}
	
	#main-content .et_pb_image
	{
		width:100% !important;
	}
	
	#main-content .et_pb_image .et_pb_image_wrap 
	{
    	width: 100%;
		margin-top: 20px;
	}
}






/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 27 2024 | 11:49:45 */
/* Basic pagetypes CPT

Zum Beispiel:
.example {
    color: red;
}

Um dein CSS-Wissen zu prüfen, teste es hier http://www.w3schools.com/css/css_syntax.asp

Kommentarende*/ 


@media only screen and (min-width: 1601px)
{
	.single-blog #et-boc .et-l .et_pb_section,
	.single-b2b-marketing #et-boc .et-l .et_pb_section,
	.single-marketing-agentur #et-boc .et-l .et_pb_section
	{
		/* 	, 
	.single-leistungen #et-boc .et-l .et_pb_section */
	 /* padding: 0px 0 !important; */
		padding-right: 0px !important;
		padding-left: 0px !important;
	    padding-top:0px !important;
	}
} 

@media only screen and (max-width: 1600px)
{
	.single-blog #et-boc .et-l .et_pb_section,
	.single-b2b-marketing #et-boc .et-l .et_pb_section,
	.single-marketing-agentur #et-boc .et-l .et_pb_section /*,
	.single-leistungen #et-boc .et-l .et_pb_section */
	{
	  /* padding: 0px 0 !important; */
		padding-right: 0px !important;
		padding-left: 0px !important;
		padding-top:0px !important;
	}
}

/*
.single-blog .container {
width: 100%;
max-width: 100%;
}
.single-blog #left-area .post-meta {
display: none;
}
.single-blog .entry-title {
}
.single-blog #main-content .container {
padding-top: 0;
}
.single-blog .container.et_menu_container, 
}
*/

.single-blog #main-content .container,
.single-b2b-marketing #main-content .container,
.single-marketing-agentur #main-content .container,
.single-leistungen #main-content .container 
{
	width: 100%;
	max-width:100%;
	padding-left:0px !important;
	padding-right:0px !important;
}

.single-blog .entry-title,
.single-blog .et_pb_column, 
.single-blog .et_pb_row,

.single-b2b-marketing .entry-title,
.single-b2b-marketing .et_pb_column, 
.single-b2b-marketing .et_pb_row,

.single-marketing-agentur .entry-title,
.single-marketing-agentur .et_pb_column, 
.single-marketing-agentur .et_pb_row, 

.single-leistungen .entry-title,
.single-leistungen .et_pb_column, 
.single-leistungen .et_pb_row
{
	max-width:1240px;
	margin-left:auto !important;
	margin-right:auto !important;

}

@media only screen and (max-width: 1280px)
{
	
	.single-blog .entry-title,
	.single-b2b-marketing .entry-title,
	.single-marketing-agentur .entry-title, 
	.single-leistungen .entry-title
	{
	margin-left:20px !important;
	margin-right:20px !important;
	}
}

.single-blog .et_pb_row,
.single-b2b-marketing .et_pb_row,
.single-marketing-agentur .et_pb_row, 
.single-leistungen .et_pb_row
{
	padding-left:20px !important;
	padding-right:20px !important;
}


/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 27 2024 | 11:50:36 */
#fixed {
  position: fixed;
  bottom: 180px;
  visibility: visible !important;  /* Neu */
  display: block;  /* Neu */
  z-index: 9999;
}

/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 27 2024 | 11:51:25 */
#main-header
{
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  background-color: rgba(255,255,255,0.85) !important;
}

/*
img#logo{
	transition: 2s;
	 filter: grayscale(100%)  brightness(0%);
    -webkit-filter: grayscale(100%) brightness(0%);
    -moz-filter: grayscale(100%) brightness(0%);
    -ms-filter: grayscale(100%) brightness(0%);
    -o-filter: grayscale(100%) brightness(0%);
    -webkit-filter: grayscale(1) brightness(0);
}

img#logo:hover
{
filter: initial;
} 
*/

#et-info-email::before, #et-info-phone::before
{
	font-family:initial !important;
}

#et-info-phone::before {
  content: url(//gr-test.de/wp-content/uploads/2023/04/noun-phone-call-545105-FFFFFF_2.svg);
  position: relative;
  top: 8px;
  margin-right: 2px;
  height: 25px;
  width: 25px;
  display: inline-block;
}

#et-info-email::before {
  content: url(//gr-test.de/wp-content/uploads/2023/04/mail_noun-email-1569815-FFFFFF.svg);
  position: relative;
  top: 8px;
  margin-right: 2px;
  height: 25px;
  width: 25px;
  display: inline-block;
}

#top-header .container {
  padding-top: 0rem !important;
}

/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 27 2024 | 11:51:32 */
/* Alternative: Use a link in the footer! */

/* [cmplz-revoke-link text="Don't want non-functional cookies? Revoke your settings!"] */

/* You can also add some CSS to force the settings button for all devices. */

@media (max-width: 768px) {
#cmplz-manage-consent .cmplz-manage-consent {
    /* display: unset; */
    bottom: -5px!important;
	display: block;
}
}

.cmplz-btn
{
	-webkit-transition: all 1.5s ease !important;
    -moz-transition: all 1.5s ease !important;
  	-o-transition: all 1.5s ease !important;
  	transition: all 1.5s ease !important;
}

.cmplz-btn:hover
{
	background-color:var(--hex-corp-accent-color) !important;
	border: 1px solid var(--hex-corp-accent-color) !important;
}

#cmplz-manage-consent button:hover
{
	color:var(--hex-corp-white) !important;
}/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 27 2024 | 11:52:59 */
.sub-menu
{
	right: 0px;
	top:20px;
}





@media screen and (max-width: 1280px) {

ul#mobile_menu
{
	min-width: 300px;
}


/*  START Divi Mobile Menu START */

html.menu-blur #et-main-area 
{
	top:-30px;
	transition-duration: 1.8s;
	/* filter sind immer für den parent mit childelementen gültig und können nicht zurückgenommen werden */
  	filter: grayscale(79%) blur(4px); 
}

html.menu-blur-out #et-main-area 
{
	 top:-30px;
	 transition-duration: 1.8s;
	 /* filter sind immer für den parent mit childelementen gültig und können nicht zurückgenommen werden */
  	 /* filter: grayscale(0%) blur(0px); */
	filter: unset;
}



.et_mobile_menu
{
	//border-color: var(--hex-corp-dark-grey) !important;
	border-top: 1px solid rgba(0,0,0,0.1) !important;
	/* transition-delay: 0.15s; */
	opacity: 0.95;
}

.mobile_menu_bar::before, 
	.mobile_menu_bar:after {
		transition:all 1s ease !important;
	}
	
.mobile_menu_bar:hover::before, 
.mobile_menu_bar:hover::after {
  color: #fff !important;
  background-color: #85ac39 !important;
}
	
.mobile_menu_bar::before {

  font-weight: bold !important;
  font-size: 4.1em !important;
  font-feature-settings: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  top: -20px;
  padding: 8px;
}




#mobile_menu::-webkit-scrollbar {
  max-width: 8px;               /* width of the entire scrollbar */
}

#mobile_menu::-webkit-scrollbar-track {
  background: var(--hex-corp-orange);        /* color of the tracking area */
}

#mobile_menu::-webkit-scrollbar-thumb {
  background: var(--hex-hover-orange);     /* color of the scroll thumb */
  border-radius: 20px;       /* roundness of the scroll thumb */
  /*border: 2px solid var(--hex-hover-orange);  *//* creates padding around scroll thumb */
}


	.et_pb_text
	{
		font-size: 1.2em !important;	
	}
	.mobile_menu_bar_toggle
	{
		padding-top:10px;
		padding-left:8px;
	}
	.mobile_menu_bar_toggle:hover
	{
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px;
		transition: background-color 800ms;

	}

	.mobile_menu_bar_toggle:hover::before
	{
		transition: color 500ms;

	}

	.mobile_menu_bar
	{
		height:70px !important;
		width:70px !important;
		 /* top:-5px; *//* mit second top menu 20px */

	}

	.mobile_menu_bar::before
	{

		color: var(--hex-corp-dark-grey) !important;
	}

	.mobile_menu_bar:hover
	{

		background-color: var(--hex-corp-orange);

	}

	.mobile_menu_bar:hover::before
	{
		color: var(--hex-corp-white) !important;
	}



	#main-header{
		/* background-color: var(--hex-corp-white) !important; */
	}	

	ul#mobile_menu li a
	{
		color: var(--hex-corp-white) !important;
	  padding-left: 25px !important;
	  padding-right: 25px !important;
	}

	ul.et_mobile_menu {

	  padding: 0px !important;
	  padding-top: 10px !important;
	  padding-bottom: 10px !important;
	}

	ul.et_mobile_menu li{

	}

	.et_mobile_menu li li {
	  padding-left: 0px !important;
	}

	#main-header .et_mobile_menu li ul {

	  padding-left: 0px !important;
	}

	/* hier ist war das Problem, nicht auf Block stellen */

	#mobile_menu
	{
		/* display: block !important; */
		overflow-y: auto !important; 
		max-height: 65vh !important;
	}


	ul.et_mobile_menu
	{

	}
	#main-header .et_mobile_menu {
	  background-color: var(--hex-corp-light-grey) !important;
		
	}

	#main-header .et_mobile_menu li a {
		color: var(--hex-corp-dark-grey) !important;
	}

	#main-header .et_mobile_menu li:hover a,
	#main-header .et_mobile_menu li ul.sub-menu:hover li a
	{
		color: var(--hex-corp-white) !important;
	}


	ul#mobile_menu li a:hover,
	ul#mobile_menu li.current-menu-item a,
ul#mobile_menu li a:active,
ul#mobile_menu li.current-menu-ancestor a
	{
		color: var(--hex-corp-white) !important;
	}

.et_mobile_menu li a:hover, .nav ul li a:hover {
    background-color: rgba(0,0,0,.03);
    opacity: 1 !important;
}


	.current-menu-ancestor
	{
		background-color: var(--hex-corp-dark-grey) !important;
	}

	ul#mobile_menu li.menu-item:hover,
	ul#mobile_menu li.current-menu-item
	{
		background-color: var(--hex-corp-dark-grey);
	}

	.current-menu-ancestor li:hover,
	ul#mobile_menu li ul.sub-menu li:hover{
		background-color: var(--hex-corp-orange) !important;
	}


	.current-menu-ancestor li:hover a,
	ul#mobile_menu li ul.sub-menu li:hover a{
		color: var(--hex-corp-dark-grey) !important;
	}

/*  END Divi Mobile Menu END */


/* START Enable Mobile Menu For Custom Resolution START */ 
/*
@media (min-width: 0px)
{	  
	#et_mobile_nav_menu
	{
	  display: block !important;
	}

	#top-menu{
	  display: none !important;
	}

}*/

/* END Enable Mobile Menu For Custom Resolution END */ 


/* START Menu customization START */
.et_mobile_menu {
  left:auto !important;
  right: 0 !important;
  width: auto !important;	

}

/* STOP Menu customization STOP */
}







/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Feb 27 2024 | 11:53:15 */
/* CSS Smartslider frontpage */
div#n2-ss-2 .n2-ss-control-bullet {
	top:20px;
}

header-slider-startseite
@media screen and (max-width: 1920px) {
.home .header-slider-startseite .n2-ss-slide-background-image picture:first-child
	{
		filter: blur(0px) !important;
	}
	.home .header-slider-startseite .n2-ss-slider #n2-ss-5 .n2-ss-slider-2
	{
		min-height:170px !important;
	}
	.home .header-slider-startseite .n2-ss-slider #n2-ss-5 .n2-ss-slider-2 video
	{
		min-height:170px !important;
	}
	.home .header-slider-startseite .n2-ss-slider .n2-ss-slider .n2-ss-slide-background-video[data-mode="fit"] {
  object-fit: cover !important;
}
	
	
	.home .header-slider-startseite .n2-ss-slider .n2-ss-slide-background, .home .header-slider-startseite .n2-ss-slider .n2-ss-slider .n2-ss-slide-background * {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: left;
}
.home .header-slider-startseite .n2-ss-slider .n2-ss-slider [data-mode="blurfit"] .n2-ss-slide-background-image + .n2-ss-slide-background-image img:nth-child(2) {
  object-fit: contain;
  display: none;
}
}



.home .header-slider-startseite .n2-ss-slider .n2-ss-slide-background-image
{
	  opacity: 1 !important;
	  z-index:1 !important;
}

.home .header-slider-startseite .jpg .n2-ss-preserve-size--slider
{
	/* height:1000px !important; */
}






/* SMART SLIDER LEISTUNGEN */
.leistungen-b2b-agentur .n2-ss-slide
{
	-webkit-transition: all 1.5s ease;
  	-moz-transition: all 1.5s ease;
  	-o-transition: all 1.5s ease;
  	transition: all 1.5s ease;
	
}

.leistungen-b2b-agentur .n2-ss-slide:hover
{
	
	margin-top:-15px !important;
}