/*   
CI-Farben: 

00000 - schwarz
82bac4 - hellblau
8ab724 - gruen
fed300 - gelb
e6007e - pink
e30613 - rot

Schrift: Fira Sans (Google Open Font) 
https://fonts.google.com/specimen/Fira+Sans 
Wir verwenden von dem Font Fira Sans Bold, - Black, - Medium und - Regular. 


}

@font-face {
    font-family: 'Fira Sans';
    src: url('firasans-regular-webfont.woff2') format('woff2'),
         url('firasans-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}*/
@import url('https://fonts.googleapis.com/css?family=Fira+Sans:300,400&subset=latin-ext');


body.classic1080 #tetris { overflow:hidden; padding-top:0px; margin-top:0; }


/*@import url('https://fonts.googleapis.com/css?family=Fira+Sans:300,400');*/

.ownerbody,
.ownerbody input[type="text"],
.ownerbody textarea,
input[type="submit"] {
    font-family: 'Fira Sans', sans-serif;
}
.ownerbody,
#lightBorder {
    background-color: #f0f1f2;
}

#scaler,
body.classicSignage #scaler #banner {
    
    background-image: url(Bannerlight.svg);
    background-image: url(Bannerdark.svg);
    background-position: 0px 2px;
    background-repeat: no-repeat;
    background-color:#fff;
}



body.classicSignage #scaler {
    background-position: 0 -16px;
}
body.mobile #scaler{ 
    background-size: 136%;
    background-position: 0 17px;
}
body.mobile .frame,
body.mobile #tetris .tile {
    margin-bottom:10px;
}
body.mobile #overlayCloseButton {
    top:0;
}

#module, #matrix, #social, #tetris,
body.classic1080 #module, body.classic1080 #matrix, body.classic1080 #social, body.classic1080 #tetris {
    background-color:#f2f2f2;
    margin-top:0;
    padding-top:12px;
}
body.classic1080  #social {
    padding-top:0;
}


/*---  HintergrundBilder wegnehmen. Kein Papier mehr  ----*/
#social .social .s1,
.ownerbody, body.mobile.ownerbody,
#esocial_frame.tile.plain,
#chatboxdummy, .overlayCommentsFormContainer, 
.tile {
	background-image:none;
}





#overlayCommentsContainer {
    min-height:auto;
}
#menubar {
    color: #626262;
    background:#fff;
}
#menubar .serviceicon_googleplus,
#menubar .serviceicon_pinterest { display:none;}

#menubar a,
.twoStepSocial:hover, 
#menubarLinks a:hover,
#videoBtn,
#videoBtn[state="closed"]:hover, 
#videoBtn[state="open"]:hover {
    color: #dd3333;
}
#videoBtn {
    bottom: 0px;
    width: 100%;
    text-align: right;
    background-color: #fff;
    left: 0;
    padding: 2px 10px 1px 2px;
    box-sizing: border-box;
    font-size: 14px;
}
#videoBtn:hover,
#videoBtn[state="closed"]:hover, 
#videoBtn[state="open"]:hover {
    background: #dd3333;
    color:#fff;
}
body.mobile #videoBtn {
    font-size:15px;
}


/* transparenter Hinterleger */
.kachel.tile .transparent_postcard  {
    padding: 5px 20px;
    color:#fff;
}

.kachel.tile .transparent_postcard .text {
	white-space: normal;
	font-weight: 400;
	font-size: 14px;
	display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tile {
	background-size: cover;
	background-color: #fcfcfc;
	background-color: transparent;
	font-weight:400;
}

div[type="list"] .tile .connect .flypiconConnect {
    color:#fff;
}
#banner .tile {
	background-color:transparent;
}

/* ################ Bilder in greyscale: ################ 
.tile.kachel .image,
.tile.list .connect img {
    filter: grayscale(1);
}
.tile.kachel.color .image,
.tile.list.color .connect {
    filter: initial;
}*/

/* ################ STYLE plain: ################ */
.plain, .plain a { 
	color: #02a0fc; 
	background-color: #ffbb00;
	text-decoration: none;
}
div[type="list"] .plain .connect .flypiconConnect {
    color: #ffbb00; 
}
.kachel.tile.plain .transparent_postcard  {
    background: rgb(255 187 0 / 80%);
    color: #fff; 
}

/* ################ STYLE 1: ################ */
.s1, .s1 a { 
    background-color: #ffbb00;
	color: #fff; 
	text-decoration: none;
}
div[type="list"] .s1 .connect .flypiconConnect {
    color: #ffbb00; 
}
.kachel.tile.s1 .transparent_postcard  {
    background: rgb(255 187 0 / 80%);
    color: #fff; 
}


/* ################ STYLE 2: ################ */
.s2, .s2 a  { 
    background-color: #53a128;
	color: #fff; 
	text-decoration: none;
}
div[type="list"] .s2 .connect .flypiconConnect {
    color: #53a128; 
}
.kachel.tile.s2 .transparent_postcard  {
    background: rgb(83 161 40 / 80%);
    color: #fff; 
}


/* ################ STYLE 3: ################ */
.s3, .s3 a { 
	background-color: #53a128;
	color: #ffb100; 
	text-decoration: none;
}
div[type="list"] .s3 .connect .flypiconConnect {
    color: #53a128; 
}
.kachel.tile.s3 .transparent_postcard  {
    background: rgb(83 161 40 / 80%);
    color: #fff; 
}

/* ################ STYLE 4: ################ */
.s4, .s4 a { 
	background-color: #feb2a7;
	color: #5a25fb;
	text-decoration: none;
}
div[type="list"] .s4 .connect .flypiconConnect {
    color: #feb2a7; 
}
.kachel.tile.s4 .transparent_postcard  {
    background: rgb(254 178 167 / 80%);
    color: #fff; 
}

/* ################ STYLE 5: ################ */
.s5, .s5 a { 
	background-color: #feb2a7;
	color:#fff; 
	text-decoration: none;
}
div[type="list"] .s5 .connect .flypiconConnect {
    color: #feb2a7; 
}
.kachel.tile.s5 .transparent_postcard  {
    background: rgb(254 178 167 / 80%);
    color: #fff; 
}

/* ################ STYLE 6: ################ */
.s6, .s6 a { 
	background-color: #fd55ba;
	color: #ffeb27; 
	text-decoration: none;
}
div[type="list"] .s6 .connect .flypiconConnect {
    color: #fd55ba; 
}
.kachel.tile.s6 .transparent_postcard  {
    background: rgb(253 85 186 / 80%);
    color: #fff; 
}

/* ################ STYLE 7: ################ */
.s7, .s7 a { 
	background-color: #af0cf6;
	color: #ffffff; 
	text-decoration: none;
}
div[type="list"] .s7 .connect .flypiconConnect {
    color: #af0cf6; 
}
.kachel.tile.s7 .transparent_postcard  {
    background: rgb(175 12 246 / 60%) ;
    color: #fff; 
}

/* ################ STYLE 8: ################ */
.s8, .s8 a { 
	background-color: #af0cf6;
	color: #ffeb27; 	
	text-decoration: none;
}
div[type="list"] .s8 .connect .flypiconConnect {
    color: #af0cf6; 
}
.kachel.tile.s8 .transparent_postcard  {
    background: rgb(175 12 246 / 70%) ;
    color: #fff; 
}


.tile .linkLayout .flypicon {
    font-size: 14px;
    vertical-align: initial;
}



.kachel .tilecontent .userImageContainer {
    height:40px;
    width:40px;
    border-radius:20px;
}



body[type="kachel"] .kachel.e1 .tilecontent .userImageContainer, 
body[type="kachel"] .list.e1 .tilecontent .userImageContainer,
body[type="kachel"] .kachel.e2 .tilecontent .userImageContainer, 
body[type="kachel"] .list.e2 .tilecontent .userImageContainer,
body[type="kachel"] .kachel.e3 .tilecontent .userImageContainer, 
body[type="kachel"] .list.e3 .tilecontent .userImageContainer {
	 display:block;
}



.tile .userImage {
    height:100%;
}

/*###### twittermoderator #######*/
.e1 {
 background: #fff;
 color: #fff;
}
.e1 a { color:#fff; }

.kachel.e1 .transparent_postcard,
.kachel.e1 .transparent_postcard a { color:#82bac4;}

.dragdrop #secondColumn .e1 { background-size:auto 77%; }
div[type="list"] .e1 .connect .flypiconConnect {color: #82bac4;}




.e2 {
 background: #e6007e;
 color: #fff;
}
.e2 a { color:#fff; }

.kachel.e2 .transparent_postcard,
.kachel.e2 .transparent_postcard a { color:#e6007e;}

.dragdrop #secondColumn .e2 { background-size:auto 77%; }
div[type="list"] .e2 .connect .flypiconConnect { color: #e6007e; }



/*Spezialstyle fuer die Ankündigungen */ 
.e3 {
    background: #f18615;
    color: #fff;
}
.e3 a { color:#fff; }

.kachel.e3 .transparent_postcard,
.kachel.e3 .transparent_postcard a { color:#f18615;}

.dragdrop #secondColumn .e2 { background-size:auto 77%; }
div[type="list"] .e3 .connect .flypiconConnect { color: #f18615; }




/*Spezialstyle fuer die Gewinner */ 
.e4 {
	background: #fff; 
	color:transparent;
}
.e4 a { color:transparent; }
.e4::before  {
    content:'';
    width:100%;
    height:100%;
    background-image:url(1platz.png);
    position:absolute;
    z-index:1;
    background-size:contain;
    background-repeat: no-repeat;
    background-position: bottom;
}
.styleswitch.e4::before {
    background-size: cover;
    height: 60px;
    width: 64px;
    background-position: -12px;
}

.kachel.e4 .transparent_postcard,
.kachel.e4 .transparent_postcard a { color:#e30613;}

div[type="list"] .e4 .connect .flypiconConnect { color: transparent; }



/* //////////////////////////////////////////////////////
Alle Elemente mit der Haupt-Schmuckfarbe
//////////////////////////////////////////////////////// */


/* KachelKommentare -  BGcolor / color  - Icons als Flypicon Font --------------*/
.tile .theComment { color: #fff; background-image: linear-gradient(45deg, rgba(221,51,51,0) 0%,rgba(221,51,51,0) 49.9%,rgba(221,51,51,1) 50%,rgba(221,51,51,1) 100%); }


/* KachelKommentare -  im Listenclient BGcolor / color --------------*/
.eLCommentCount { background-color: #dd3333; color: #fff; }


/* overlayCloseButton BGcolor / color -----------------------------*/
#overlayCloseButton { background-color: #dd3333; color: #fff; }  


/* Play Video in Kachel------------------------------------*/ 
.playVideoKachel,
.double-bounce1, 
.double-bounce2 { color: #dd3333; }


/* scroll to top - Button ---------------------------------*/
#scrollToTopBtn { background: #fb0; color:#dd3333; }
#scrollToTopBtn:before { border-color: transparent transparent #fff transparent; }
#scrollToTopBtn:hover {	background: #dd3333; color:#fff; }


/* Pollfarben ---------------------------------------------*/ 
.pollEnabled { background-color:rgba(255,255,255,0.2); }
.pollDisabled { background-color:rgba(255,255,255,0.1); }
.pollHilite { background-color: #dd3333; color:#fff;}



/* Kommentareingabe Chatbox und ChatNamenseingabe -------------------------------*/
#chatboxdummy {background-color: #fcfcfc;color: #dd3333;font-weight: bold;}
#loginPopup div:nth-child(2) { background-color: #fcfcfc; }

/* Hintergrund social  -----------------------------------------------*/
#esocial_frame.tile.plain,
#social .social .s1 {background-color: #fcfcfc;color: #dd3333;font-weight: bold;}
#esocial_frame.tile.plain a,
#social .social .s1 a {color: #dd3333; background:transparent}
#frame_social .tilecontent { padding:15px 10px 0 20px;}

.infoblock.instagram .username,
.infoblock.instagram .pipe { display:none;}


.ownerbody textarea,
.ownerbody input[type="text"] { color: #626262; }
.ownerbody input[type="submit"] {color: #fff;background: #dd3333;height:31px;}

/*BG-Farben fuer die TDs der Form Felder---------------------*/
.eLCommentsFormContainer #messageCommentForm td:first-child, 
#chatboxdummy td:first-child  {
	border-top: 1px solid #b2b2b5;
	box-sizing: border-box;
	padding-left: 7px;
	border-left: 1px solid #b2b2b5;
	border-bottom: 1px solid #b2b2b5;
	border-right: 0;
	}
.eLCommentsFormContainer #messageCommentForm td:last-child, 
#chatboxdummy td:last-child {
	background-color: #dd3333;
	border: 1px solid #dd3333;
	}

#loginPopup input[type="text"] {
    border-top: 1px solid #b2b2b5;
    border-left: 1px solid #b2b2b5;
    border-bottom: 1px solid #b2b2b5;
    border-right: 0;
    box-sizing:border-box;
}

/* VideoButton fuer NEUE Events mit Video--------------*/ 
#videoBtn[state="closed"]:before { content: "Video einblenden"; }
#videoBtn[state="open"]:before { content: "Video ausblenden"; }


#poweredByFlypSite { 
    background-color:#f0f1f2;
    background-image: url(powered_adslam1.svg);
}
.classicSignage #poweredByFlypSite { 
    background-color:transparent;
    background-image: url(powered_adslam1.svg);
}

#poweredByFlypSite span a {
    color:#626262;
}
.classicSignage #poweredByFlypSite span a {
    color:transparent;
}

#eframe-3_frame.tile:hover .theComment {
	display:none;
}