/** Standardfarben, zur Verwendung als Variablen weiter unten **/

/*
Syntax: 
Verläufe: Verlaufsrichtung in Grad, Startfarbe links, Startfarbe rechts, Deckkraft 
background-image: linear-gradient( -90deg, var(--color1) 0, var(--color2) 100%); 

    --color1: #54b299; --color2: #fbab46; 
	--color1rgb: rgba(0, 64, 132, .8); --color2rgb: rgba(165, 51, 84, .8);	

*/
:root {
    --color1: #2047BE; --color2: #0E318E; -color3: #4c32c9; 
	--color1rgb: rgba(0, 64, 132, .8); --color2rgb: rgba(165, 51, 84, .8);	
}

/** Links **/
	/* Normal */
	a { 
		color: var(--color1); text-decoration: none; 
	}
	/* Mouseover */
	a:hover { 
		color: var(--color2); text-decoration: none;
	}


/** Logo links oben (erscheint beim Scrollen im Menüs
	/* Breite des Logos */
	.navbar-brand img {
		width: 60px;
	}

/**  Schrift Navigation **/
	/* Normal */
	.navbar-default .navbar-nav>li>a {
		color: #777; /** Grau **/)
	}
	/* Mouseover */
	#navbar ul:first-child li a:hover, #navbar ul:first-child li a:focus, #navbar ul:first-child li.active a:focus, #navbar ul:first-child li.active a:hover, #navbar ul:first-child li.active a {
		color: var(--color2);
	}

/**  Innerer Navigationsheader, Hintergrundverlauf **/
#Header .bg_headline_transition {
    background-image: linear-gradient( -90deg, var(--color1rgb) 0, var(--color2rgb) 100%);
}	
	
/** Mobiles Menü **/
	/* Hintergrundfarbe großer Menübutton */
		.navbar.navbar-default .navbar-header .navbar-toggle.collapsed {
			background-image: linear-gradient( -90deg, var(--color2) 0, var(--color2) 100%);
		}
	/* Farbe Icon kleiner Menübutton */
	.navbar.navbar-default .navbar-header .navbar-toggle .icon-bar {
		background-color: var(--color1);
	}		
		
	/* Farbe des Overlays beim Aufruf des Menüs */
	.navbar.navbar-default .navbar-collapse.collapse.in, .navbar.navbar-default .navbar-collapse.collapsing {
		background-image: linear-gradient( 180deg, #ffffff 0, var(--color1) 65%);
	}

/** Call-to-Action-Button, Menü rechts oben **/
	/* Normal */
	.navbar.navbar-default .container .navbar-collapse .btn-bordered {
		color: var(--color1); border-color: var(--color1); background-color: #ffffff;
	}
	/* Mouseover */
	.navbar.navbar-default .container .navbar-collapse .btn-bordered:hover {
    color: #ffffff; border-color: var(--color1); background-color: var(--color1); background-image: linear-gradient( -90deg, var(--color1) 0, var(--color1) 100%);
	}
	/* Schriftfarbe Call-to-action-Button mobil */
	.navbar.navbar-default .navbar-collapse.collapse.in .btn-bordered, .navbar.navbar-default .navbar-collapse.collapsing .btn-bordered {
		color: var(--color1) !important;
	}
	
/** Positionierung für Header und Speakerhintergründe  **/
.header-parallax {
  min-height: 50vh; 
  background-position: right center;
  background-size: cover;
}
/* Damit legen wir eine transparente Schicht über das Headerbild, z.B. um es heller zu machen */
.header-parallax:before {
    content: "";
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    background-color: rgba(255,255,255,0.3);
}
.speaker-parallax {
  min-height: 50vh; 
  background-position: right center;
  background-size: cover;
}	

/** Hintergründe und Schriftfarben der Sections **/
.bg_color1 {
	background-image: linear-gradient( -90deg, var(--color1) 0, var(--color1) 100%); color: #ffffff;
}
.bg_color2 {
	background-image: linear-gradient( -90deg, var(--color2) 0, var(--color2) 100%); color: #000000;
}
.bg_grey {
    color:black; background: #e2e2e2; color: #000000;
}
.bg_white {
    color:black; background: #ffffff; color: #000000;
}
.bg_transition {
    background-image: linear-gradient( -90deg, var(--color1) 0, var(--color2) 100%);
}

/** Programmkästen **/
	/* Hintergrund und Schriftfarbe */
	body.programm .slots .slot.raum1 .title, body.programm .slots .slot.raum1 .title a {
		background: #aaccff; color: #000000;
	}
	body.programm .slots .slot.raum2 .title, body.programm .slots .slot.raum2 .title a {
		background: #f4dcbd; color: #000000;
	}
	body.programm .slots .slot.raum3 .title, body.programm .slots .slot.raum3 .title a {
		background: #f1D2D2; color: #000000;
	}	
	body.programm .slots .slot.raum4 .title, body.programm .slots .slot.raum4 .title a {
		background: #e3eff6; color: #000000;
	}
	body.programm .slots .slot.raum5 .title, body.programm .slots .slot.raum5 .title a {
		background: #c0e2db; color: #000000;
	}	
	/* Schriftfarbe Sessiontitel – normal*/
	body.programm .slots .slot .title p a {
		color: #000000; text-decoration: none;
	}
	/* Schriftfarbe Sessiontitel – Mouseover*/
	body.programm .slots .slot .title p a:hover {
		text-decoration: underline;
	}

/** Hintergrund, Schriftfarbe und Schriftgröße Buttons (in den Sections) **/
.btn-transition {
    background-color: #ffffff; background-image: linear-gradient( -90deg, var(--color2) 0, var(--color2) 100%); color: #ffffff; font-size: 22px;  
}

/** Speakerrondell **/ 
	/* Aktives Navigationspünktchen */
	.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
		background: #FF4B19 !important;
	}
	/* Inaktives Navigationspünktchen */
	.owl-theme .owl-dots .owl-dot span {
		background: #fff ;
	}
	/* Farbe für die Namen der Speaker und Firmen */
	.item.profile-card a, .item.profile-card p {
		color: #ffffff !important;
	}

/** Footer **/
	/* Hintergrund */
	#Footer {
		background-image: linear-gradient(-90deg, var(--color2) 0, var(--color2) 100%); color: #ffffff;
	}
	/* Schrift für Social- und Konferenbuttons */
		/* Normal */
		a.btn-white { background-color: #ffffff; border-color: #ffffff; color: var(--color1) !important;
		}
		/* Mouseover */
		a.btn-white:hover { background-color: #ffffff; border-color: #ffffff; color: var(--color1) !important; }
					
	/* Farben der unteren Logos */
	.fil0 {fill:var(--color1)} 
	.fil1 {fill:#cccccc}
	
/** Pretix-Einstellungen **/
	/* Pretix-Buttons */
	.pretix-widget button, .pretix-widget input[type="button"], .pretix-widget-alert-box button, .pretix-widget-alert-box input[type="button"] {
		background-color: var(--color1) !important; border-color: var(--color1) !important;
	}
	.pretix-widget a.pretix-widget-button, .pretix-widget-alert-box button, .pretix-widget-alert-box input[type="button"], .pretix-widget-alert-box a.pretix-widget-button {
		color: #ffffff !important; background-color: var(--color1) !important; border-color: var(--color1) !important;
	}

	.pretix-widget a, .pretix-widget-alert-box a {
		color: var(--color1) !important; text-decoration: none;
	}
	.pretix-widget-primary-color {
		fill: var(--color1) !important;
	}
	.pretix-widget-wrapper {
		background-color: white;
	}
	/* Fehlermeldungen */ 
	.pretix-widget .pretix-widget-error-message {
		background-color: white  !important; border: 2px solid var(--color2) !important; color: var(--color2) !important;
	}
	}