@font-face {
  font-family: 'NDRSans';
  font-style: normal;
  font-weight: 400;
  src: url('../../assets/NDRSansDRegular.eot'); 
  src: url('../../assets/NDRSansDRegular.eot#iefix') format('embedded-opentype'), url('../../assets/NDRSansDRegular.woff') format('woff'), url('../../assets/NDRSansDRegular.ttf') format('truetype'), url('../../assets/NDRSansDRegular.svg#NDRSans') format('svg'); 
}
@font-face {
  font-family: 'NDRSansCondBold';
  font-style: bold;
  font-weight: 400;
  src: url('../../assets/NDRSansDCondBold.eot'); 
  src: url('../../assets/NDRSansDCondBold.eot#iefix') format('embedded-opentype'), url('../../assets/NDRSansDCondBold.woff') format('woff'), url('../../assets/NDRSansDCondBold.ttf') format('truetype'), url('../../assets/NDRSansDCondBold.svg#NDRSansCondBold') format('svg'); 
}
@font-face {
  font-family: 'NDRSansCondReg';
  font-style: bold;
  font-weight: 400;
	src: url('../../assets/NDRSansDCondRegular.eot'); 
	src: url('../../assets/NDRSansDCondRegular.eot#iefix') format('embedded-opentype'), url('../../assets/NDRSansDCondRegular.woff') format('woff'), url('../../assets/NDRSansDCondRegular.ttf') format('truetype'), url('../../assets/NDRSansDCondRegular.svg#NDRSansCondReg') format('svg'); 
}


.ownerbody,
.ownerbody input[type="text"] {
    font-family:NDRSans;
}
.column60 .tile .headline,
.column40 .tile .headline {
    font-family:NDRSansCondReg;
    font-size:22px;
    color:#0c327d;
}
.tile .text {
    font-family:Arial,Helvetica;
    color:#333;
    font-size:16px;
    line-height:24px;
}
.tile[layout="text_small"] .text {
    font-size: 14px;
    line-height: 18px;
}
.tile[layout="message_big"] .text, 
.tile[layout="text_big"] .text {
    font-size: 20px;
    line-height: 26px;
}
.tile[layout="time"] .text {
	line-height: initial;
}

/*#### Farbe Menubar ####*/
#menubar {
    background-color:#000045;
}
#poweredByFlypSite {
    background-color:rgba(0,0,69,0.9);
}

/*#### Menubar Pinterest Icon ausblenden ####*/
.serviceicon_pinterest {
    display:none;
}



/*#### Positionierung Video Button und Beschriftung ####*/
#videoBtn {
    left:20px;
    background-image:url(mehrPfeilBlack.png);
    background-position:right;
    background-repeat:no-repeat;
    width: 77px;
    font-family:NDRSansCondBold;
    font-size:16px;
}
#videoBtn,
#videoBtn[state="closed"]:hover, 
#videoBtn[state="open"]:hover {
    color: #0c1754;
}
#videoBtn[state="open"]:before,
#videoBtn[state="closed"]:before {
    content: "Mehr Infos";
}


/*#### Beschriftung der beiden Listen ####*/
.reiterkarte {
    text-align:center;
    letter-spacing:2px;
}
.reiterkarte#fc1,
.out1_pin,
.out1_content {
    background:#0c1754;
}

.reiterkarte#fc2,
.out2_chat,
.out2_content{
    background:#2671c6;
}
.reiterkarte span {
    padding-left:0;
    letter-spacing: 0.06em;
    font-size: 22px;
    padding-top: 5px;
    font-family:NDRSansCondReg;
}


.out1_content,
.out2_content {
    padding-bottom:40px;
}


/*#### Abstand der Nachrichten zu den Listencontainern und oberes Padding für die Userinfo ####*/
.column40 .tile, 
.column60 .tile {
    margin: 13px 13px 0px 13px;
    padding-top:60px;
}
.column40 .tile:first-child, 
.column60 .tile:first-child {
    margin-top: 0;
}
.column40 .tile:last-child, 
.column60 .tile:last-child {
    margin-bottom: 20px;
}





/*#### Positionierung des User-Images und Info Containers über der Nachricht ####*/
.tile.list .info,
.tile .transparent_postcard .info {
    position: absolute;
    top: 5px;
    left:50px;
    margin-top:0;
    width:80%;
    height:45px;
}

.tile.list .info a span:first-child , 
.tile .transparent_postcard .info a span:first-child  {
	position:absolute;
	right:2px;
}
.tile.list .info a span:last-child , 
.tile .transparent_postcard .info a span:last-child  {
	display:none;
}

.tilecontent .userImageContainer {
    height: 40px;
    width: 40px;
    border-radius: 0;
    position: absolute;
    top: 0;
}
.serviceicon {
    display:none;
}

/*#### Border, Padding und Breite für alle Nachrichten innerhalb der Listencontainer ####*/
.column60 .tile,
.column40 .tile,
.column60 div[size_name="base"].e1,
.column40 div[size_name="base"].e1 {
	border:10px solid #fff;
	box-sizing:border-box;
	background-color:#fff;
	color:#0c1754;
}
.column60 .tile .tilecontent,
.column40 .tile .tilecontent,
.column60 div[type="list"] div[size_name="base"].e1 .tilecontent,
.column40 div[type="list"] div[size_name="base"].e1 .tilecontent {
    padding: 8px 10px 3px 0px;
    width: 90%;
    width: calc(100% - 10px);
}
.column60 .tile.kachel .info,
.column40 .tile.kachel .info {
	width:100%;
	bottom:0;
	left:0;
}

/*#### Farben für alle Nachrichten ####*/
.tile {
    background-color:#fff;
	color:#0c1754;
}
.tile a {
    color:#0c1754;
}
div[type="list"] .tile .connect .flypiconConnect,
div[type="list"] div[size_name="base"].e1 .connect .flypiconConnect {
	color: #fff;
	display:none;
}
/*#### Kommentare auf den Kacheln ####*/
.listCommentsContainer {
    margin:0px 13px 20px 13px;
}



/*#### Anpassungen Banner: Background-Image und Logos ####*/
#ebanner_frame {
    background-image:url(bg-banner3.jpg);
    background-size:cover;
    font-family:NDRSansCondBold;
} 
#ebanner_frame:after {
    content:"";
    background-image:url(profilbild_Zapp200.png);
    background-size:cover;
    width:100px;
    height:100px;
    position:absolute;
    top:13px;
    right:13px;
}
#ebanner_frame.changed:after {
    width:50px;
    height:50px;
}
#evideo_frame .listCommentCount {
    display:none;
}
#ebanner_frame .headline {
	font-size: 58px;
  margin-bottom: -3px;
}
#ebanner_frame .text {
	font-size: 24px;
	font-family:NDRSansCondBold;
	color:#0c327d;
}



/*#### Besondere Farbe für Video Frame mit Mehr Info Text ####*/
.video .tile {
    background-color:#eee;
    font-family:NDRSans, arial, helvetica, sans-serif;
}
.video .tile .tilecontent{
    width: calc(100% - 100px);
    padding: 50px;
}
.video .tile .text,
.video .tile .headline {
    font-size:16px;
}
.video .tile .tilecontent {
    font-size: 16px;
}
.playVideoKachelContainer {
	margin-top: 30px;
}


/*#### Anpassungen wegen Abstand und Border auf den Nachrichten ####*/
.slideshow .tile,
.column40 .slideshow .tile, .column60 .slideshow .tile {
    box-shadow: none;
    margin: 0;
    padding: 0;
    border:0;
}





#zapper-buttons {
    background:#f5f5f5;
    color: #0c1754;
    text-align:center;
    font-family:NDRSansCondBold;
    height:49px;
}
#zapper-buttons span {
    background-color:#fff;
    /*margin:17px 5px;*/
    margin:10px 6px;
    padding:7px 15px 4px;
    display:inline-block;
    cursor:pointer;
    font-size:16px;
}
#zapper-buttons span.active {
    background-color:#1d5496;
    color:#fff;
}
#zapper-buttons span a {
    text-decoration:none;
    color: #0c1754;
}
.infoblock.facebook {
    margin-left: 12px;
}


.usrhandle a, #frame_video a  { text-decoration: underline; }

@media (max-width: 600px) { 
	#ebanner_frame .headline {
		font-size: 22px;
	}
}
@media (max-width: 460px) { 
	#ebanner_frame .headline {
		font-size: 20px;
	}
	.reiterkarte span {
		font-size: 14px;
	}
}
@media (max-width: 620px) {
	#zapper-buttons {height:75px}
	#zapper-buttons span {margin: 5px 10px 0px 10px}
}
@media (max-width: 374px) {
	#zapper-buttons span {margin: 5px 2px 0px 2px;padding: 5px;}
}
@media (max-width:564px) {
	#frame_out1_content, #frame_out2_content {padding-top:12px}
}

