@import url('https://fonts.googleapis.com/css?family=Hind:300,500,700&display=swap');

html, body {
    font-family: 'Hind', sans-serif;
}

a {
    color: #53388d;
}

a:hover {
    color:#000;
}

a.telegram {
    width:58px;
    height: 58px;
    line-height: 58px;
    text-align: center;
    position: absolute;
    text-indent: -9999em;
    display: block;
    left:10px;
    top:10px;
    background: url("../img/telegram_kicad.png") center center no-repeat;
    background-size:100% 100%;
}
@media screen and (min-width:768px) {
    a.telegram {
        top:88px;
        left:20px;
    }
}
.navbar-default {
    background: #332763;
    border:0px;
    height: 80px;
}
.navbar-brand img {
    max-height:55px;
}

.navbar-default .navbar-nav > li > a {
    color:#fff;
    line-height: 80px;
    padding:0 20px;
    font-size:22px;
    text-transform: uppercase;
}

.navbar-default .navbar-nav > li > a:hover {
    color:#c8ff00;
}

.navbar-nav {
    float: right;
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
    background: #53388d;
    color:#fff;
}

.btn {
    border-radius: 0px;
    border:0px transparent;
    text-transform: uppercase;
    font-size:22px;
}

.btn.btn-primary {
    background: #332763
   }

.btn.btn-primary:hover,
.btn.btn-primary:active,
.btn.btn-primary:focus {
    background: #332763;
    color:#c8ff00;
}

section.first {
    padding-top:51px;
}
.kiconHeader .row {
    padding:0;
    margin:0;
}
.kiconHeader .row .autoHeight {
    padding:0;
    margin:0;
}
.headerImage img {
    width:100%;
    height: auto;
}

.headerText {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding:80px 40px;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#53388d+0,332763+100 */
background: #53388d; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #53388d 0%, #332763 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg,  #53388d 0%,#332763 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg,  #53388d 0%,#332763 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#53388d', endColorstr='#332763',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

    color:#fff;
}

.headerText h1 {
    font-weight: 600;
    padding:0;
    margin:0;
    font-size:58px;
}

.headerText h2 {
    font-weight: 500;
    padding:0;
    margin:0;
    letter-spacing: 4px;
}

.headerText .preH1 {
    font-weight: 300;
    text-transform: uppercase;
    font-size:22px;
    letter-spacing: 4px;
}

.headerText p {
    font-size:16px;
    line-height: 22px;
    padding-top:40px;
    padding-bottom: 20px;
}

@media screen and (min-width:1200px) {
    .headerText p {
        max-width: 480px;
    }
}

@media screen and (max-width:1199px) {

    .headerText {
        padding:40px 20px;
    }

    .headerText h1 {
        font-weight: 600;
        font-size:35px;
    }
    
    
    .headerText .preH1 {

        font-size:14px;
    }
    
    .headerText p {
        font-size:14px;
        line-height: 18px;
        padding-top:15px;
    }
}

@media screen and (max-width:767px) {

    .headerText {
        height:auto!important;
    }
}

section.content {
    padding:80px 0;
}

section.content h2 {
    font-size:50px;
}

section.content p {
    font-size:26px;
    line-height: 30px;
    font-weight: 200;
    padding:40px 0 0 0;
}

section.content:nth-child(even) {
    background: #332763;
    color:#fff;
}

section.content:nth-child(odd) {
    color: #332763;
    background:#fff;
}

ul.speaker {
    padding: 0;
    margin: 40px 0;
    list-style: none;
    display:block;
    text-align: center;
}

ul.speaker li {
    display:inline-block;
    float:none;
    margin-bottom:40px;
}

.speakerImage {
    width:100%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding:0 20px;
    margin-bottom:20px;
    display: block;
}

.speakerImage img {
    width:100%;   
    height: auto;
    border-radius: 666px;
}

.speakerName {
    display:block;
    width:100%;
    font-size:24px;
    line-height: 38px;
    padding:0 15px;
    color:#fff;
    background: #332763;
}

section.content .speakerFunction a{
    text-decoration: none;
    color:#53388d;
}

section.content:nth-child(2n) .speakerFunction a{
    text-decoration: none;
    color:#fff;
}

footer {
    padding:40px 0;
    font-size:22px;
}

@media screen and (max-width:767px) {
    .navbar-default{
        height: auto;
        max-height: none;
        width:100%;
        position: relative;
        
        margin:auto;
    }

    .navbar-default .container {
        max-width: 320px;
        margin:auto;
    }

    .navbar-brand {
        height: auto;
        max-width: 320px;
    }

    .navbar-brand img {
        width:100%;
        max-height: none;
        height: auto;
    }

    ul.nav.navbar-nav {
        width:100%;
        margin:0;
    }

    ul.nav.navbar-nav li a {
        text-align: center;
    }

    section.first {
        padding-top:0;
    }
}

ul.programm {
	padding:20px 0;
	margin:0 auto;
	width:100%;
	max-width:640px;
	text-align:left;
	list-style:none;
}

ul.programm li {
	margin:0;
	padding:20px  0;
	border-bottom:2px solid #fff;
	position:relative;
	font-size:20px;
}

ul.programm li:last-child {
	border-bottom:0px;
}

ul.programm li:nth-child(odd) {
	background:rgba(255,255,255,0.1);
}

ul.programm li span.erst {
	display:inline-block;
	margin-right:-4px;
	width:120px;
	position:absolute;
	left:10px;
	top:20px;
}

.twitterWrap {
	width:100%;
	height:480px;
	overflow-x:hidden;
	overflow-y:scroll;
}

ul.programm li span.zweit {
	position:relative;
	left:0;
	top:0;
	padding-left:140px;
	display:block;
	width:100%;
}
