/*******************************************************************
	1. FONTS
*******************************************************************/



/*******************************************************************
	2. ALLGEMEIN
*******************************************************************/

*
{
	box-sizing: border-box;
	-webkit-tap-highlight-color: transparent;
}

html
{
	font-size: 100%;
	-webkit-text-size-adjust: 100%;
}

body
{
	background: #e7e7e7;
	font-size: 1em;
	line-height: 1em;
	color: #3c3c3b;
}

b
{
	font-weight: normal;
	font-family: 'ProximaNovaCond-Bold';
}

a:link, a:visited
{
	text-decoration: underline;
	color: #323232;
	font-family: 'ProximaNovaCond-Bold';
}

a:hover, a:active, a:focus
{
	text-decoration: none;
	color: #323232;
	outline: none;
	font-family: 'ProximaNovaCond-Bold';
}

.center
{
	clear: both;
	text-align: center;
}

.left
{
	text-align: left;
}

.right
{
	text-align: right;
}

.clear
{
	clear: both;
}

.uppercase
{
	text-transform: uppercase;
}

[class^='column'] 
{
  float: left;
}

.column_25
{
	width: 25%;
}

.column_50
{
	width: 50%;
}

.column_75
{
	width: 75%;
}

.column_100
{
	width: 100%;
}

/*******************************************************************
	3.1 RESPONSIVE STARTET MIT DER KLEINSTEN BILDSCHIRMBREITE
*******************************************************************/
/* Smartphones (Portrait) ----------- */
@media only screen and (min-width : 320px) {
	
	
	h2
	{
		font-size: 2.8rem;
		line-height: 0.8em;
		font-family: 'ProximaNovaCond-Bold';
		text-transform: uppercase;
		margin: 0px 0px 30px 0px;
		text-align: left;
	}
	
	h3
	{
		font-size: 1.8rem;
		line-height: 0.8em;
		font-family: 'ProximaNovaCond-Bold';
		text-transform: uppercase;
		margin: 40px 0px 10px 0px;
		text-align: left;
	}
	
	#container_hero
	{
		position: relative;
		background: url('../images/heroimage2.png') 0px 0px no-repeat;
		background-size: cover;
		width: 100%;
		height: 60vh;
	}
	
		#container_hero:before
		{
			content: '';
			position: absolute;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
			background-image: linear-gradient(to bottom right, #be1e3c, #808080);
			opacity: 0.75;
		}
	
		#logo
		{
			position: relative;
			background: url('../images/logo.svg') 0px 0px no-repeat;
			background-size: 500px 220px;
			width: 500px;
			height: 220px;
			top: calc(30vh - 110px);
			left: 50%;
			margin: 0px 0px 0px -340px;
		}
		
	#container_menue
	{
		background: #f6f6f6;
		width: 100%;
		height: 100px;
		border-top: 1px solid #4d595d;
		border-bottom: 1px solid #4d595d;
	}
	
		#wrap_menue
		{
			position: relative;
			width: 80vw;
			height: 98px;
			left: 50%;
			margin: 0px 0px 0px -40vw;
			padding: 0px 0px 50px 0px; 
		}
		
			#menue_list
			{
				width: 100%;
				height: 98px;
				overflow: hidden;
			}
			
				.menue_item
				{
					background: transparent;
					width: 25%;
					height: 98px;
					float: left;
					text-align: center;
					font-size: 1.5em;
				}
				
				.menue_item_active
				{
					background: #be1e3c;
					color: white;
					padding: 40px 0px 0px 0px;
					font-family: 'ProximaNovaCond-Bold';
				}
				
					.menue_link:link,
					.menue_link:visited
					{
						width: 100%;
						height: 98px;
						padding: 40px 0px 0px 0px;
						text-decoration: none;
						color: #3c3c3b;
						display: block;
						-webkit-transition: background 0.3s,  color 0.3s; /* Safari */
						transition: background 0.3s,  color 0.3s;
					}
					
					.menue_link:hover,
					.menue_link:active,
					.menue_link:focus
					{
						background: #be1e3c;
						text-decoration: none;
						color: white;
					}
		
	.container_inhalt
	{
		background: white;
		width: 100%;
		overflow: hidden;
	}
	
		.wrap_inhalt
		{
			position: relative;
			width: 80vw;
			left: 50%;
			margin: 0px 0px 0px -40vw;
			padding: 50px 0px 50px 0px;
		}
		
			h1.headline
			{
				font-size: 3.8rem;
				line-height: 1em;
				font-family: 'ProximaNovaCond-Bold';
				text-transform: uppercase;
				margin: 0px 0px 10px 0px;
			}
			
				.headline_hyphen
				{
					display: none;
				}
				
				.responsive_break
				{
					display: block;
				}
				
			h2.ueberschrift_programm
			{
				margin: 60px 0px 40px 0px;
			}
			
			.programm_table
			{
				width: 100%;
			}
			
				.tr_active
				{
					background: red;
				}
			
					.programm_cell1,
					.programm_cell2,
					.programm_cell3,
					.programm_cell4,
					.programm_cell5,
					.programm_cell3_4
					{
						position: relative;
						padding: 15px 0px 0px 0px;
						font-size: 1.5rem;
						line-height: 1.4em;
						text-align: left;
						font-family: 'ProximaNovaCond-Light';
						vertical-align: text-top;
						border-bottom: 1px solid #3c3c3b;
					}
		
					.programm_cell1,
					.programm_cell2
					{
						width: 20%;
					}
					
						.programm_trackicon
						{
							position: absolute;
							width: 66px;
							height: 66px;
							margin: 0px 0px 0px 20px;
						}
						
						.abstract_pointer
						{
							cursor: pointer;
						}
						
						#abstract1,
						#abstract2,
						#abstract3,
						#abstract4,
						#abstract5,
						#abstract6,
						#abstract7,
						#abstract8,
						#abstract9,
						#abstract10,
						#abstract11,
						#abstract12,
						#abstract13,
						#abstract14,
						#abstract15,
						#abstract15,
						#abstract16,
						#abstract17,
						#abstract18,
						#abstract19,
						#abstract20,
						#abstract21,
						#abstract22,
						#abstract23,
						#abstract24,
						#abstract25,
						#abstract26,
						#abstract27,
						#abstract28
						{
							width: 100%;
							margin: 0px 0px 50px 0px;
							display: none;
						}
						
							.list_abstract
							{
								width: 100%;
							}
							
								.item_abstract
								{
									list-style: disc;
									margin: 0px 0px 10px 50px;
								}
				
			.people_list,
			.hotel_list
			{
				width: 100%;
				overflow: hidden;
			}
			
				.people_item,
				.hotel_item
				{
					position: relative;
					background: #f6f6f6;
					width: calc(33.3333333333% - 20px);
					float: left;
					margin: 0px 20px 20px 0px;
					padding: 30px;
					border: 1px solid #4d595d;
					text-align: left;
				}
				
				.hotel_item
				{
				}
				
					.people_link:link
					{
						position: absolute;
						width: 100%;
						height: 100%;
						top: 0px;
						left: 0px;
						display: block;
						z-index: 3;
					}
				
					h3.people_title
					{
						font-size: 1.5rem;
						line-height: 0.8em;
						font-family: 'ProximaNovaCond-Light';
						text-transform: uppercase;
						margin: 40px 0px 5px 0px;
						text-align: left;
					}
					
					h2.people_name
					{
						font-size: 1.8rem;
						line-height: 0.8em;
						font-family: 'ProximaNovaCond-Bold';
						text-transform: uppercase;
						margin: 0px 0px 0px 0px;
						text-align: left;
					}
					
					.people_image
					{
						position: relative;
						width: 60%;
						border-radius: 200px;
						border: 4px solid #4d595d;
						padding: 5px;
						left: 20%;
						margin: auto auto;
					}
			
			p 
			{
				margin: 0px 0px 15px 0px;
				font-size: 1.5rem;
				line-height: 1.4em;
				text-align: left;
				font-family: 'ProximaNovaCond-Light';
			}
			
			#trackliste
			{
				width: 100%;
				overflow: hidden;
				margin: 50px 0px 50px 0px;
			}
				
				.trackitem
				{
					position: relative;
					background: #f6f6f6;
					width: 30%;
					height: 35vh;
					float: left;
					margin: 0px 5% 0px 0px;
					padding: 30px;
					border: 1px solid #4d595d;
				}
				
				.trackitem:last-child
				{
					margin: 0px 0px 0px 0px;
				}
				
					a.track_link:link,
					a.track_link:visited,
					a.track_link:hover,
					a.track_link:focus,
					a.track_link:active
					{
						position: absolute;
						width: 100%;
						height: 35vh;
						top: 0px;
						left: 0px;
						outline: none;
						cursor: pointer;
						display: block;
					}
					
					h2.trackueberschrift
					{
						font-size: 3.5rem;
						line-height: 0.8em;
						font-family: 'ProximaNovaCond-Bold';
						text-transform: uppercase;
						margin: 0px 0px 30px 0px;
						text-align: center;
					}
					
					.trackitem > p
					{
						text-align: center;
					}
					
					.container_trackicon_red,
					.container_trackicon_green,
					.container_trackicon_yellow
					{
						position: relative;
						background: transparent;
						width: 130px;
						height: 130px;
						left: 50%;
						border-radius: 130px;
						margin: 0px 0px 30px -65px;
						-webkit-transition: background 0.3s; /* Safari */
					    transition: background 0.3s;
					}
					
					.trackitem:hover > .container_trackicon_red
					{
						background: #e55959;
					}
					
					.trackitem:hover > .container_trackicon_green
					{
						background: #8bd563;
					}
					
					.trackitem:hover > .container_trackicon_yellow
					{
						background: #efd62c;
					}
					
						.trackicon
						{
						}
					
			#container_anmeldung
			{
				position: relative;
			}
			
			.container_input
			{
				width: 100%;
				overflow: hidden;
			}
			
				.cfp_links
				{
					width: 50%;
					float: left;
					padding: 0px 3% 0px 0px;
				}
			
				.cfp_rechts
				{
					width: 50%;
					margin: 0px 0px 0px 50%;
					padding: 0px 0px 0px 3%;
				}
				
					.input_cfp
					{
						width: 100%;
						padding: 15px;
						margin: 0px 0px 15px 0px;
						font-family: 'ProximaNovaCond-Light';
						font-size: 1.5em;
					}
					
					.input_select
					{
						width: 50%;
						padding: 10px 0px 10px 0px;
						margin: 0px 0px 15px 0px;
					}
					
					.tracks_table
					{
						width: 100%;
						margin: 0px 0px 20px 0px;
					}	
					
						.tracks_head1,
						.tracks_head2,
						.tracks_head3,
						.tracks_head4,
						.tracks_head5
						{
							width: 20%;
							text-align: center;
							font-family: 'ProximaNovaCond-Light';
							font-size: 1.5em;
							line-height: 1em;
							padding: 15px;
							font-weight: normal;
						}
						
						.tracks_head1
						{
							text-align: left;
							width: 10%;
						}
					
						.tracks_cell1,
						.tracks_cell2,
						.tracks_cell3,
						.tracks_cell4,
						.tracks_cell5
						{
							width: 22,5%;
							text-align: center;
							font-family: 'ProximaNovaCond-Light';
							font-size: 1.5em;
							line-height: 1em;
							padding: 15px;
							border-bottom: 1px solid #4d595d;
						}
						
						.tracks_cell1
						{
							text-align: left;
							width: 10%;
							border-right: 1px solid #4d595d;
						}
						
						.tracks_cell3,
						.tracks_cell5
						{
							background: #f6f6f6;
						}
						
							.table_trackicon
							{
								width: 50px;
								float: left;
								margin: 0px 20px 0px 0px;
							}
							
						.last_row
						{
							border-bottom: none;
						}
					
					.submit_cfp
					{
						position: absolute;
						background: #be1e3c;
						border: none;
						color: white;
						bottom: -30px;
						right: -2px; 
						padding: 15px;
						font-family: 'ProximaNovaCond-Light';
						font-size: 1.5em;
						cursor: pointer;
					}
				
			.impressum_tabelle
			{
				margin: 0px 0px 15px 0px;
			}
				
				.impressum_cell1,
				.impressum_cell2
				{
					margin: 0px 0px 15px 0px;
					font-size: 1.5em;
					line-height: 1.4em;
					text-align: left;
					font-family: 'ProximaNovaCond-Light';
				}
				
				.impressum_cell2
				{
					padding: 0px 0px 0px 10px;
				}
			
			.trennlinie_impressum {
				width: 50%;
				margin: 50px auto;
				border: none;
				border-bottom: 1px solid #4d595d;
			}
		
	#container_footer
	{
		position: relative;
		width: 100%;
	}
	
		#wrap_footer
		{
			position: relative;
			width: 80vw;
			left: 50%;
			margin: 0px 0px 0px -40vw;
			padding: 50px 0px 0px 0px;
		}
		
			#footer_impressum
			{
				position: absolute;
				bottom: 0px;
				right: 0px;
			}
}
		
/* Smartphones (Landscape) ----------- */
@media only screen and (min-width : 460px) {
		
}

/* Tablets (Portrait) ----------- */
@media only screen and (min-width : 768px) {
	
}

/* Tablets (Landscape) ----------- */
@media only screen and (min-width : 768px) and (orientation : landscape) {
					
}

@media (min-width: 1280px) {
	.headline_hyphen
	{
		display: inline;
		margin: 0px 20px 0px 20px;
	}
	
	.responsive_break
	{
		display: none;
	}
	
	#logo
		{
			position: relative;
			background: url('../images/logo.svg') 0px 0px no-repeat;
			background-size: 700px 320px;
			width: 700px;
			height: 320px;
			top: calc(30vh - 155px);
			left: 50%;
			margin: 0px 0px 0px -475px;
		}
}

/*******************************************************************
	8. SUPERFISH
*******************************************************************/

@media (max-width: 1024px) and (orientation: portrait) {
	ul.sf-menu.sf-js-enabled.sf-arrows,
	#sf-menu,.sf-menu > li, .sf-menu * {
		display: none!important;
	}
}

@media only screen and (max-device-width : 460px) and (orientation : landscape) {
	ul.sf-menu.sf-js-enabled.sf-arrows,
	#sf-menu,.sf-menu > li, .sf-menu * {
		display: none!important;
	}
}

@media (max-width: 768px) {
	ul.sf-menu.sf-js-enabled.sf-arrows,
	#sf-menu,.sf-menu > li, .sf-menu * {
		display: none!important;
	}
}

@media (min-width: 768px) {
	/*** ESSENTIAL STYLES ***/
	.sf-menu, .sf-menu * {
		margin: 0;
		padding: 0;
		list-style: none;
		font-family: "GothamCondensed-Bold";
	}
	
	.sf-menu {
		background: white;
		width: 100%;
	}
	.sf-menu li {
		position: relative;
	}
	
	.sf-menu li a:hover,
	.sf-menu li a:active,
	.sf-menu li a:focus {
		border-bottom: 5px solid #e7e7e7;
		height: 78px;
	}

	.sf-menu ul {
		position: absolute;
		display: none;
		top: 100%;
		left: 0;
		z-index: 99;
	}
	.sf-menu > li {
		float: left;
	}
	.sf-menu li:hover > ul,
	.sf-menu li.sfHover > ul {
		display: block;
	}
	
	.sf-menu a {
		display: block;
		position: relative;
	}
	.sf-menu ul ul {
		top: 0;
		left: 100%;
	}
	
	
	/* simphonia default skin */
	.sf-menu {
		border-top: 1px solid #e7e7e7;
		border-right: 1px solid #e7e7e7;
		width: calc(100% - 360px);
		float: left;
	}
	.sf-menu ul {
		/*box-shadow: 2px 2px 6px rgba(0,0,0,.2);*/
		min-width: 12em; /* allow long menu items to determine submenu width */
		*width: 12em; /* no auto sub width for IE7, see white-space comment below */
	}
	.sf-menu a {
		padding: 33px 0px 0px 0px; 
		text-decoration: none;
		zoom: 1; /* IE7 */
	}
	.sf-menu > li {
		height: 78px;
		padding: 0 15px;
		background: white;
		white-space: nowrap; /* no need for Supersubs plugin */
		*white-space: normal; /* unless you support IE7 (let it wrap) */
		-webkit-transition: background 0.3s ease-out 0s;
		-moz-transition: background 0.3s ease-out 0s;
		-o-transition: background 0.3s ease-out 0s;
		transition: background 0.3s ease-out 0s;
		font-size: 1.25em;
		text-transform: uppercase;
	}
	
	.sf-menu > li > ul > li,
	.sf-menu > li > ul > li > ul > li,
	.sf-menu > li > ul > li > ul > li > ul > li
	{
		background: white;
		height: 45px;
		font-size: 0.875em;
	}
	
		.sf-menu > li > ul > li > ul > li,
		.sf-menu > li > ul > li > ul > li > ul > li
		{
			font-size: 1em;
		}
	
		.sf-menu > li > ul > li > a,
		.sf-menu > li > ul > li > ul > li > a,
		.sf-menu > li > ul > li > ul > li > ul > li > a {
			padding: 15px 15px 20px 15px;
			margin: 0;
			border: 0;
		}
		
	.sf-menu li:hover,
	.sf-menu li.sfHover {
		/*-webkit-transition: none;*/
		/*transition: none;*/
	}
		.sf-menu ul li:hover {
			background: #323232;
		}
		
		.sf-menu ul li:hover > a,
		.sf-menu ul li a:hover
		{
			color: white;
			border: 0;
		}
	
}