@charset "ISO-8859-1";

/* FONTS */
@font-face{
	font-family:SansPro400;
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/Source_Sans_Pro_400.eot'), /* IE9 Compat Modes */
	url('../fonts/Source_Sans_Pro_400?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url('../fonts/Source_Sans_Pro_400.woff') format('woff'), /* Modern Browsers */
	url('../fonts/Source_Sans_Pro_400.ttf') format('truetype') /* Safari, Android, iOS */
}
/* DOCUMENT */
html {position: relative;min-height: 100%;}
body {/* Seite immer 100% gross mit 60px Platz (.footer::height) unten fuer Footer */
margin:0;padding:0;font-family:SansPro400,Arial,sans-serif;letter-spacing:0.00em;margin-bottom:40px;
background-image:url(../img/backgrounds/transparent.png);
background-repeat:no-repeat;background-size:cover;background-position:center;
}

/*  ************************* Breite aller Elemente *********************************** */
.content{position:relative;margin:0 auto;width:94%;}

/* FOOTER */
.footer {/* der eigentliche Footer */
  position: absolute;
  bottom: 0;
  width: 100%;
  Min-height: 39px;
  line-height:40px;
  color:#ffffff;
  background-color: #928285;
  overflow:hidden;
  border-top:1px solid #e9e6e6;
}
.bottomlink{text-decoration:none;color:#ffffff;font-size:14px;font-family:SansPro400,Arial,sans-serif;Padding-top: 10px;Padding-left: 27px;}
.bottomlink:hover{text-decoration:none;color:#e1e8e2;Padding-top: 10px;Padding-left: 27px;}
.bottomlink2{text-decoration:none;color:#000000;font-size:14px;font-family:SansPro400,Arial,sans-serif;Padding-top: 10px;Padding-left: 27px;}
.bottomlink2:hover{text-decoration:none;color:#e1e8e2;Padding-top: 10px;Padding-left: 27px;}
.copyright{float:right;font-size:14px;Padding-top: 10px;Padding-left: 27px;}

/* HEADER mit Logo */
#header{position:relative;width:100%;height:100px;border-bottom:1px solid #ffffff;background:#ffffff;overflow:hidden;}
#headline1{font-family:SansPro400,Arial,sans-serif;height:34px;line-height:30px;margin-top:0.5rem;margin-bottom:0.5rem;margin-left:20px;font-size:20px;overflow:hidden;color:#928285;}
#headline2{font-family:SansPro400,Arial,sans-serif;height:26px;line-height:20px;top:20px;margin-left:20px;font-size:16px;overflow:hidden;color:#928285;}
#header_logo{position:relative;float:left;display:block;margin-top:1.2rem;margin-bottom:0.5rem;margin-left:0px;width:100px;height:45px;background:url(../img/logos/IFX_LOGO_RGB.svg);background-size:100%;background-repeat:no-repeat;background-position:center;}
#title{position:relative;float:left;left:0px;color:#928285;height:93px;}

#topnav{color:#928285;}

#nav-logo{width:64px;height:29px;width:100px;height:45px;}
#nav-title-1{font-size:18px;}
#nav-title-2{font-size:14px;}

@media screen and (max-width: 800px) {
	#header{height:60px;}
	#headline1{font-size:16px;margin-left:10px;height:20px;line-height:20px;margin-bottom:5px;}
	#headline2{font-size:12px;margin-left:10px;height:12px;line-height:12px;}
	#header_logo{width:64px;height:29px;}
	.copyright{font-size:14px;}
	.bottomlink{font-size:14px;}
	.bottomlink2{font-size:14px;}
	#nav-logo{width:64px;height:29px;}
	#top-nav-text{line-height:16px;margin-top:10px;}
	#nav-title-1{font-size:12px;}
	#nav-title-2{font-size:10px;}
	.bottomlink{font-size:10px!important;}
}

@media screen and (max-width: 360px) {
	#header{height:60px;}
	#headline1{font-size:14px;margin-left:10px;height:20px;line-height:20px;margin-bottom:5px;}
	#headline2{font-size:10px;margin-left:10px;height:12px;line-height:12px;}
	#header_logo{width:64px;height:29px;}
	.copyright{font-size:14px;}
	.bottomlink{font-size:14px;}
	.bottomlink2{font-size:14px;}
	#nav-logo{width:64px;height:29px;}
	#top-nav-text{line-height:12px;margin-top:10px;}
	#nav-title-1{line-height:11px;height:11px;font-size:9px;}
	#nav-title-2{line-height:9px;height:9px;font-size:7px;}
	.bottomlink{font-size:7px!important;}
}


/* Navigations-Leiste */
#menu{position:relative;width:100%;background:#e9e6e6;border-bottom:0px solid #e9e6e6;min-height:52px;}
/* bootstrap3 ueberschreiben*/
.navbar-default{border:0;margin:0;background-color:#e9e6e6;}
.navbar-default .navbar-nav>li>a{color:#005DA9;font-size:bold;font-family:SansPro400,Arial,sans-serif;font-size:14px;border-bottom:2px solid transparent;}
.navbar-default .navbar-nav>li>a:hover{color:#E30034;border-bottom:2px solid #E30034;}
.navbar-right{margin-right:0;}


/* Text unter Navigationsleiste */
#submenu{position:relative;margin:0 auto;width:100%;padding:0;color:#000000;font-size:16px;}
/* Text unter Navigationsleiste */
#submenu2{position:relative;margin:0 auto;width:100%;padding:0;color:#000000;font-size:12px;}


/*  ************************* Medien-Elemente Player und Slide *********************************** */
.media{} /* Klasse fuer JQuery-Funktionen */
.media-left{position:relative;float:left;-webkit-transition:width 1s;transition:width 1s;width:48.5%;} /* linkes Medien-Element: Player-Container */
.media-right{position:relative;float:right;cursor:pointer;-webkit-transition:width 1s;transition:width 1s;width:48.5%;} /* linkes Medien-Element: Slide-Container */
.media-small{width:28.5%;} /* Media-Container klein */
.media-large{width:62.5%;} /* Media-Container gross */
#slide{position:absolute;top:0;left:0;width:100%;height:100%;background-repeat:no-repeat;background-size:contain;background-position:right;} /* Slide */
#preview{background-position:center;background-size:contain;background-repeat:no-repeat;}

/* Buttons fuer Groessenaenderungen von Player und Slide*/
.media-size-button{position:relative;float:left;margin-left:8px;width:50px;height:30px;cursor:pointer;}
.media-size-button >div{position:absolute;top:0;left:0;width:100%;height:100%;background-size:contain;background-repeat:no-repeat;background-position:center;}
.media-size-button-left > div{background:url(../img/buttons/right-inactive.png);}
.media-size-button-center > div{background:url(../img/buttons/center-inactive.png);}
.media-size-button-right > div{background:url(../img/buttons/left-inactive.png);}
.media-size-button-left > .active{background:url(../img/buttons/right-active.png);}
.media-size-button-center > .active{background:url(../img/buttons/center-active.png);}
.media-size-button-right >.active{background:url(../img/buttons/left-active.png);}

/* Modal Overlays Slideliste, Sprecherliste, Slide, Hilfe */
.modal-backdrop {background-color: rgba(0,0,0,.0001) !important;} /* bootstrap3 Style ueberschreiben */
.modal-header{font-family:SansPro400,Arial,sans-serif;background:#928285;} /* bootstrap3 Style ueberschreiben */
.modal-title{font-family:SansPro400,Arial,sans-serif;color:#ffffff;} /* bootstrap3 Style ueberschreiben */
.close {color:#ffffff;opacity: 1;} /* bootstrap3 Style ueberschreiben */
.close:hover{color:#ffffff;opacity: 1;} /* bootstrap3 Style ueberschreiben */

/* Slide-Vergroesserungs-Modal */
#slideModal > .modal-dialog{float:right;right:5px;min-width:65%;max-width:65%;}
#slideModal > .modal-dialog > .modal-content > .modal-body > .embed-responsive{background-size:contain;background-position:center;background-repeat:no-repeat;}

/* Hilfe-Modal */
#helpModal > .modal-dialog{float:right;right:5px;}
#helpModal > .modal-dialog > .modal-content{height:100%;min-height:100%;border-radius:0;background:url(../img/backgrounds/list-background.png);}
#helpModal > .modal-dialog > .modal-content > .modal-body{font-size:1.1vw;}

/* Download-Modal */
#downloadModal > .modal-dialog{float:right;right:5px;}
#downloadModal > .modal-dialog > .modal-content{height:100%;min-height:100%;border-radius:0;background:url(../img/backgrounds/list-background.png);}
#downloadModal > .modal-dialog > .modal-content > .modal-body{font-size:15px;}

/* Imprint-Modal */
#imprintModal > .modal-dialog{float:right;right:5px;}
#imprintModal > .modal-dialog > .modal-content{height:100%;min-height:100%;border-radius:0;background:url(../img/backgrounds/list-background.png);}
#imprintModal > .modal-dialog > .modal-content > .modal-body{font-size:1.1vw;}

/* ********** Slide-Liste-Modal ********** */
/* Breite und Abstand von rechts */
#slideListModal > .modal-dialog{float:right;margin:0;padding:0;right:5px;width:40%;min-width:40%;max-width:40%;height:100%;overflow:hidden;}
#slideListModal > .modal-dialog > .modal-content > .modal-body{postition:absolute;left:0;bottom:0;width:100%;height:90%;overflow:auto;} /* nicht aendern */
/* Hintergrund als halbtransparentes png */
#slideListModal > .modal-dialog > .modal-content{height:100%;min-height:100%;border-radius:0;background:url(../img/backgrounds/list-background.png);}
/* Groesse der Slides in der Liste:
Abstand zwischen den Slides: margin-bottom
Breite: BREITE IN %
Hoehe bei 4x3: padding-bottom = aufrunden ( (BREITE IN %) * 3 / 4 )
Hoehe bei 16x9: padding-bottom = aufrunden ( (BREITE IN %) * 9 / 16 )
*/
.slideListItem{position:relative;margin:0 auto;width:96%;padding-bottom:54%;margin-bottom:1.5vw;background-size:contain;background-position:center;background-position:center;background-repeat:no-repeat;cursor:pointer;}


/* ********** Sprecher-Liste-Modal ********** */
/* Breite und Abstand von rechts */
#speakerListModal > .modal-dialog{float:right;margin:0;padding:0;right:5px;width:40%;min-width:40%;max-width:40%;height:100%;overflow:hidden;}

/* Hintergrund als halbtransparentes png */
#speakerListModal > .modal-dialog > .modal-content{height:100%;min-height:100%;border-radius:0;background:url(../img/backgrounds/list-background.png);}
#speakerListModal > .modal-dialog > .modal-content > .modal-body{postition:absolute;left:0;bottom:0;width:100%;height:90%;overflow:auto;}
/* Groesse der Slides in der Liste:
Abstand zwischen den Slides: margin-bottom
Breite: BREITE IN %
Hoehe bei 4x3: padding-bottom = aufrunden ( (BREITE IN %) * 3 / 4 )
Hoehe bei 16x9: padding-bottom = aufrunden ( (BREITE IN %) * 9 / 16 )
*/
.speakerListItem{position:relative;margin:0 auto;width:96%;padding-bottom:54%;margin-bottom:1.5vw;background-size:contain;background-position:center;background-position:center;background-repeat:no-repeat;cursor:pointer;}

/* weisse Mittel-Box fuer Download- und Hilfe-Modal */
.modal-container{margin:10px;background:#ffffff;border-radius:4px;padding:5px;}

/*  *************************     LOGIN SEITE *********************************** */
#loginField{position:relative;margin:0 auto;width:60%;color:#000000;}


/* INPUT STYLING */
textarea{border:1px solid #aaaaaa!important;}

/* bootstrap override */
textarea:focus,
button:focus,
select:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {   
  border-color: rgba(171, 55, 122, 0.8)!important;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(171, 55, 122, 0.6)!important;
  outline: 0 none!important;
	background:#ffffff!important;
color:#000000!important;
}

#resultmessage{position:relative;float:right;margin:0.8%;font-size:0.9vw;color:#000000;}

#chatdescription{font-weight:normal!important;color:#000000;font-size:14px;}

.btn-default:hover {
	background:#AB377A;
	color:#ffffff;
	border-color: #AB377A;
}

