body.share-v2 a.powered-by.initialized {
1.      display: none !important;
}

body.share-v2 div.m-toolbar div.toolbar .tools {
    display: none !important;
}

/* container */
.ui-page{background:white;} /* angepasst: 25.01.2017, te, sieht sch�ner aus */
.content *{font-size:18px;}
*{font-family:sans-serif !important;color:#333333;}

@media only screen and (min-width: 1024px) {
  .ui-page {
    max-width: 1024px !important; /* Info: nur "width" wuerde auch funktionieren */
    margin: 0 auto !important;
    position: relative !important;
    /*nbi box-shadow: 0 0px 64px 1px #696868 */
	
  }
  .ui-footer {
    max-width: 1024px;
    margin: 0 auto;
  }
}

/* ========================================================== Windows Table (Surface): meta-viewport Tag Scale:1 funktioniert nicht, daher dieses Workaround | START */
@-ms-viewport { width: device-width; }
/* ========================================================== Windows Table (Surface): meta-viewport Tag Scale:1 funktioniert nicht, daher dieses Workaround | ENDE */

h1, h2, h3, h4, h5, h6{
	text-transform:uppercase;
}

textarea.ui-input-text{height:140px; !important}

/*   header */
#header{
	height:22px;
	padding:0;
	margin:0;
	border-radius: 25px;
}
#header td{
	border-radius: 25px;
}

/*   progressbar */
#progressPercent{padding-left:15px;}
table {border-spacing:0}
table {border-collapse: collapse;}

#progressbarText{
	margin: -20px 0 0 0;
	text-align: center;
}

#progressbarText span{
	color: #000000;
	font-size: 9pt;
	font-family: sans-serif;
	text-align: center;
	margin-top: 5px;
	text-shadow:none;
	line-height:18px;
}

/*   footer back/next buttons */
.ui-submit{margin:16px !important;}
.ui-btn input, .ui-btn button{ z-index:100 !important;}
/*.ui-btn-corner-all{ border-radius:0 !important;}*/

.ui-footer{
	background: #FFFFFF !important;
}

/*   Logo LINK */
#linkimg{margin-bottom:80px;}
#linkimg img{float:left;}

/* START SPECIAL LOGO STYLING: Falls das Logo dynamisch mittels DataCollection (mrBanner) eingebunden wird, wird das <img> zus�tzlich mit dem <span class="mrBannerText"> gewrappt
Dies f�hrt dazu, dass das Styling des Logos dem Gridstyling angepasst wird. Heisst, es werden CSS-Definitionen von DataCollection (konret vom Routing "noInlineStyles") �bernommen
welche die Darstellung des Logos ver�ndern (Border, float:left, etc.)
Mit folgenden beiden Zeilen CSS wird diese Darstellung "zur�ckgesetzt"
*/
#linkimg span.mrBannerText{width:auto !important;display:block !important;border:none !important;}
#linkimg br{display:none !important;} /* Der <br> wird von DataCollection f�r jedes Banner-Element standardm�ssig eingef�gt, was hier zu einem nicht erw�nschten Abstand f�hren w�rde */


iframe{border:none;}

/*   Hinweistext */
.display{
/*************  margin: 30px 0 33px 0; WIRD NEU IM init.js ander gel�st (siehe "Display-Banner-Text:") */
	font-size: 11pt;
	font-style:italic;
}
div.display span.mrBannerText{
	color:#FF6756 !important;
}

/*   Block-Fragen */
.block_question_marginTop{
	margin-top:15px;
}

/*   Error-Section */
#error{margin-top:20px;margin-bottom:15px;}

/* z.B. error-Meldung bei halboffenen Nennungen */
span.mrErrorText{
	background-color:#F2DEDE;
	line-height:28px;
	padding:0 5px 0 5px;
	color:#E8281E;
	display:block;
	font-weight:normal;
	text-shadow:none !important;
}

.mrErrorText-container{
	background-color:#F2DEDE;
	line-height:28px;
	padding:0 5px 0 5px;
}

/* SPAN mrErrorText wird durch mrStudio selbst generiert --> <mrData QuestionElement="Error" /> */
/*.mrErrorText-container span, span.mrErrorText{*/
.mrErrorText-container span, .mrErrorText-container b{
	color:#E8281E;
	display:inline;
	font-weight:normal;
	text-shadow:none !important;
}
span.mrErrorText span.dk{
        color:white;
}

.dk, .ka, dk_multiImg{
        color:#969696;
        font-style:italic;
}

/* ========================================================== GRIDS */

/* GRID-VIEW: Radio Button zentrieren */
table.mrQuestionTable .ui-checkbox .ui-btn-icon-left .ui-icon, table.mrQuestionTable .ui-radio .ui-btn-icon-left .ui-icon {
        /*left:43%;*/
        left:50%;
        margin-left:-9px; /* abz�glich 9px (=50% der Radio-Button Width) */
}
/* STACKED-VIEW: Radio Button Abstand zur�cksetzen */
table.mrQuestionTable.gsViewStacked .ui-checkbox .ui-btn-icon-left .ui-icon, table.mrQuestionTable.gsViewStacked .ui-radio .ui-btn-icon-left .ui-icon {
        /*left:43%;*/
        left:0;
        margin-left:10px; /* abz�glich 9px (=50% der Radio-Button Width) */
}

/* damit in den Grids die Radio/Check-Buttons gleich gestylt werden wie als normale Single/Multi-Punch Fragen, wird mittels js ein label um die Radio/Check-Buttons gestellt (init.js)
   Dieses label wird noch etwas gestylt
*/
table.mrQuestionTable label{
        display:inline;
        border:none;
}

/* Default Radio-Buttons in Grids ausblenden
table.mrQuestionTable input[type=checkbox]:not(old),
table.mrQuestionTable input[type=radio   ]:not(old){
        visibility:hidden;
}
--> funktioniert nicht in IE8, daher L�sung unten (left: -9999px ...)
*/
table.mrQuestionTable input[type=checkbox],
table.mrQuestionTable input[type=radio   ]{
/*      position:absolute;
    left:-9999px;
    top:-9999px;
        --> VORSICHT: Wird neu direkt im grid.js umgesetzt, da sonst ohne aktiviertem JS �berhaupt keine radio/checkboxen angezeigt werden
*/
}

/* Radio/Check-Button border ausblenden */
table.mrQuestionTable .ui-btn-inner{
        border:none;
}

/* Grids mit Input-Felder (z.B. Grids mit numerischen Feldern): Styling anpassen (zus�tzlich wird mittels grid.js eine jqm-Klasse entfernt */
table.mrQuestionTable .ui-input-search, table.mrQuestionTable div.ui-input-text{
        background:#dbdbdb;
        margin:0;
        border:none;
}
/* compounds mit halboffener Nennung (Spalte) */

/* Grids mit Input-Felder */
table.mrQuestionTable input{
        text-align:center !important;
        width:100% !important;
}

/* Grids: Hover/Click Klassen */
.tdbg{
        background:#e6e8ed !important;
}
.tdbg_hover{
        background:#dde1e7 !important;
}

@media only screen and (max-width: 1022px) {
	table.mrQuestionTable.gsViewStacked .tdbg{
		background: #dfdfdf !important;
	}
}

/* Padding-left f�r erste Spalte links */
/*table.mrQuestionTable tr td:first-child {padding-left:10px;} */ /* neu dynamisch im init.js: suche nach "Grids: Abstand (padding-left 10px)"

/* ========================================================== ENDE GRIDS */

/* ================================================ Interviewer-Anweisung CATI/CAPI Interviews */
.intanw ul li{
        color:#357abe !important;
        font-size:12pt;
}
.intanw{
        color:#357abe !important;
        font-style:italic;
        font-size:12pt;
        font-weight:600;
        border: 1px black solid;
        padding: 15px;
}

.fontBlueBold
{
        color:#357ABE;font-weight:bold;
}

/* ========================================================== SEARCH/AUTOCOMPLETE */
.ui-autocomplete
{
/*
Trick:  wenn eine "Pseudo-Width" von 100px gesetzt wird, wird die ul.ui-autocomplete (Liste mit den autocomplete Items) immer in der korrekten Gr�sse angezeigt, also auch dann wenn der Bildschirm skaliert wird. Grunds�tzlich wird durch jQuery UI zwar die Gr�sse/Position berechnet, doch in Zusammenhang mit jQuery Mobile wird dann die Width    nicht ganz so sch�n berechnet. (Vermutung). Aber mit dieser width 100px geht es...

Anpassung: damit die Liste ul.ui-auotomplete nicht direkt am Input-Feld "klebt" hab ich im jquery-ui-1.9.2.cusotm.js die Zeile 5476 mit "+15" erg�nzt. Dadurch wird der Abstand "top" um 15px erweiteret

Weitere Infos: https://stackoverflow.com/questions/5019663/jquery-autocomplete-styling
*/
	width:100px;
	/* ---------------- */
	/*      SILBENTRENNUNG

			Variante 1)
			Hyphenator.js
			--> nicht angewendet, da dadurch noch mehr js geladen wird und auch diese Methode nicht 100% ideal ist (Trennung ok, aber nicht perfekt)

			Variante 2)
			css hypens
			--> W�re grunds�tzlich ideal, funktioniert aber aber bei der HTML lang="de-CH" nicht wirklich. Zudem unterst�tzt Chrome diese Deklaration nicht
			--> https://kenneth.io/blog/2012/03/04/word-wrapping-hypernation-using-css/
			--> https://www.w3.org/TR/css3-text/#hyphenation

			-webkit-hyphens: auto;
			   -moz-hyphens: auto;
					-ms-hyphens: auto;
							hyphens: auto;

			Variante 3)
			css word break
			Funktioniert, nicht perfekt aber es sollte reichen
			--> https://kenneth.io/blog/2012/03/04/word-wrapping-hypernation-using-css/
			--> https://www.w3.org/TR/css3-text/#word-break

	*/
	-ms-word-break: normal;
	word-break:normal;
	/* ---------------- */
	font-family: Helvetica, Arial, sans-serif /*{global-font-family}*/;
	font-size:12px !important;
}

/* ========================================================== ENDE SEARCH/AUTOCOMPLETE */

/* ========================================================== DIVERSE FORMATIERUNGEN START */
.fontBlue		{color:#357ABE;font-weight:900;}
.fontRed		{color:#CC0000;font-weight:900;}
.fontRedNormal  {color:#CC0000;font-style:italic;font-size:12pt;}
.intNote 		{color:#357abe;font-style:italic;font-size:11pt;} 		 /* display hinweistexte CATI, ohne banner auf der frage hinzuf�gen zu m�ssen */
.LDCSInfoInt	{font-style:italic !important;color:#5693d0 !important;} /* display hinweistexte CAWI, ohne banner auf der frage hinzuf�gen zu m�ssen */
.placeholder_1, .placeholder_2, .placeholder_3, 
.placeholder_4, .placeholder_5, .placeholder_6, 
.placeholder_7, .placeholder_8, .placeholder_9, 
.placeholder_10 {display:none;}
/* ========================================================== DIVERSE FORMATIERUNGEN ENDE */

/* ========================================================== Sticky-Footer: make footer "sticky to bottom" instead of "fixed with toggle" | START */
/*															  https://stackoverflow.com/questions/20438134/sticky-footer-for-jquerymobile */
[data-role=page] {
  min-height: 100%;
  position: relative;
}
[data-role=content] {
  margin-bottom: 0px; /* based on how tall your footer is and how much gap you want */
}
[data-role=footer] {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 60px; /* this can be configurable, or omitted, as long as the above padding-bottom is at least as much as the height of the footer is */
  padding-bottom:6px;
}
[data-icon="radio-off"] * {
    /*color: #adadad !important;      */
}
/*  Ausgewählte Kategorie: Background Color + Schrift fett*/
/*
[data-icon="radio-on"] * {
    font-weight:bold;
	background-color: #e6e8ed;
}
*/
[data-icon="checkbox-on"] * {
    font-weight:bold;
	background-color: #e6e8ed;
}

.ui-radio input, .ui-checkbox input{
	appearance: none;
}

/* zus�tzlich noch (hat nichts mit sticky zu tun) den footer auf z-index:0 setzen. Grund: beim Suchbaum w�rde sonst der footer �BER dem Suchtext stehen */
#footer{z-index:0;}

/* ========================================================== Footer: make footer "sticky to bottom" instead of "fixed with toggle" | ENDE */

#ie7Error{display:none;}

.ui-btn.link-tooltip-btn,
.ui-btn.link-tooltip-btn:hover,
.ui-btn.link-tooltip-btn:active {    
    background:url(https://u.link.ch/Bilder/_Assets/infobutton/infoYg1.svg) no-repeat;
	background-size:100% 100%; /* Android-Bug: ohne dieser Angabe wird das Bild ganz seltsam verzogen */
	vertical-align:top;
	width:16px;
	height:16px;
    border:0;
	/*transition-duration: all 0.4s ease-out;
	-webkit-transition: all 0.4s ease-out;
	-moz-transition: all 0.4s ease-out;
	-o-transition: all 0.4s ease-out;
	-ms-transition: all 0.4s ease-out;*/
    margin:0 2px 0 2px;
}
.ui-btn.link-tooltip-btn:hover{
        background:url(https://u.link.ch/Bilder/_Assets/infobutton/infoYg2.svg);
}

/* ========================================================== noScripts style | START */
noscript {
    font-family: sans-serif;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 101;
    text-align: center;
    font-weight: bold;
    font-size: 120%;
    color: #FFF;
    background-color: #AE0000;
    padding: 5px 0 5px 0;
}

/* ========================================================== Halboffene Nennungen | START */
.ui-input-text{min-width:80px;}

/* ========================================================== l7001-EndOfInt.htm, authenticate.htm etc.: DataCollection Informationen ausblenden, welche es aber zwingend f�r DataCollection braucht */
.sysBanner {display:none;}

/* ========================================================== weiss nicht/keine Angabe stylen */
.ex{color:#969696;font-style:italic;}

/* ========================================================== Conjoint optional, tr-hide */
#hideTr{display:none !important;}

/* ========================================================== Background-Farbe bei Markieren von Text / Browser-Default �ndern */
::selection {
  background: #FFCC00; /* WebKit/Blink Browsers */
}
::-moz-selection {
  background: #FFCC00; /* Gecko Browsers */
}

/* ========================================================== Summe im Block */
.sum{background:#ffcc00;}

/* ========================================================== Summe im Block */
.scaleViewport{
	-webkit-transform: scale(0.4);
	-moz-transform: scale(0.4);
	-ms-transform: scale(0.4);
	-o-transform: scale(0.4);
	transform: scale(0.4);
}

/* ========================================================== Popup-Bilder prozentualer Abstand zum n�chsten Bild --> 13.11.2017 von 3% auf 1% herabgesetzt */
.popphoto{margin-right:1%;}

/* ========================================================== Useragent aus Browsersniffer */
#agentNameBanner{display:none;}

/* ========================================================== Dropdown-Select Farbe mit important setzen (ansonsten wechselt die Farbe auf weiss, wenn der Fokus verloren geht) */
.ui-select{max-width: 50%; color:#333333 !important;}

@media only screen and (max-width: 1022px) {
	.ui-select{max-width: 100%; color:#333333 !important;}
}
/*.ui-select * {color:#333333 !important;}*/ /*Wieso mit * ist mir nicht klar*/
.ui-select .ui-btn-inner{border:1px solid #ced2d7;background-color:#f1f2f5;} /*Rahmen um das Dropdown-Select-Feld*/
.ui-select .ui-btn-text{font-weight:bold;} /*Text fett im Dropdown-Select-Feld*/


/* Scrollbar Safari: der Scrollbar im Safari Browser wird vom Mac per Default auf "automatisch" gesetzt, das heisst mit anderen Worten, er wird nicht angezeigt
        --> http://heresthethingblog.com/2015/03/10/mac-tip-macs-scroll-bars/
        Dieses Verhalten kann gl�cklicherweise mit CSS �berschrieben werden, wie folgt (http://stackoverflow.com/questions/7855590/how-can-i-prevent-scroll-bars-from-being-hidden-for-os-x-trackpad-users-in-webki):
        Siehe dazu auch im "init.js" und Suche nach "overflow-x".
*/
[data-role=content]{
	overflow-y:hidden;
	overflow-x:auto;
}

.ui-content::-webkit-scrollbar {
    -webkit-appearance: none;
}
.ui-content::-webkit-scrollbar:vertical {
    width: 11px;
}
.ui-content::-webkit-scrollbar:horizontal {
    height: 11px;
}
.ui-content::-webkit-scrollbar-thumb {
    border-radius: 8px;
    border: 2px solid white; /* should match background, can't be transparent */
    background-color: rgba(0, 0, 0, .5);
}
.ui-content::-webkit-scrollbar-track {
    background-color: #fff;
    border-radius: 8px;
}

#ContainerFixed{
	position:fixed;
    z-index: 2;
    width: 100%;
    max-width: 994px;
	background:white;
	height:200px;
}

/* Abstand nach halboffenen Textfeldern (nicht innerhalb von Grids) */
span.mrQuestionTable div.ui-input-text{
    margin-bottom:30px !important;
}

/* von mrScript eingef�gte <br>s DIREKT NACH Bannern */
span.mrBannerText + br {
	display: none;
}

#speechbubble{
	-webkit-border-radius: 40px;
    -webkit-border-bottom-left-radius: 0;
    -moz-border-radius: 40px;
    -moz-border-radius-bottomleft: 0;
    border-radius: 40px;
    border-bottom-left-radius: 0;
    background-color: #FFEE9F;
    padding: 20px 30px;
    margin-left: 200px;
}

.clearBoth{clear:both !important;}

.RankingBubble{
	border-radius: 50%;
    background: #357abe;
    width: 24px;
    color: white;
    text-align: center;
    line-height: 24px;
    margin-bottom: 5px;
}

.setDisplayNone{display:none !important;}

.intNote {
    color: black;
    font-style: italic;
    font-weight: normal;
    background-color:aquamarine;
    font-size: 12pt;
	padding: 10px;
    border-radius: 8px;
	text-shadow: none;
}
.intNoteOpt {
    color: black;
    font-style: italic;
    font-weight: normal;
    background-color:antiquewhite;
    font-size: 12pt;
	padding: 10px;
    border-radius: 8px;
	text-shadow: none;
}

.sticky {
        position: fixed;
        top: 0;
        /*border: 1px solid red;*/
        background: white !important;
        padding-bottom: 15px;
        padding-top:15px;        
        z-index: 1000;
        width:974px;
      }

@media only screen and (max-width: 1022px) {
	.sticky {width: calc(100% - 30px) !important;}
}