/***************************/
/* STYLESHEET www.link.ch  */
/***************************/

* {
	color:#706F6E;
/*	font-family: "futura-pt", sans-serif;
	font-size:16px;	*/
	font-family:sans-serif;
	font-size:14px;
	line-height:22px;
	letter-spacing:1px;
	font-weight:500;
	padding: 0;	
	margin: 0;	
}


hr{
	border-top: 1px solid #dbdbdb;
}

/* ===== FOOTER | START */

div#wrap{

	min-height: 100%;
	height: auto !important;

	margin-top:25px;
	/* Negative indent footer by it's height */
	padding: 0 20px 0 20px; 
}

/* bei geringen Aufl�sungen (also sobald die Div-Boxen untereinander dargestellt werden), m�ssen die 3 Hauptboxen einen margin haben */
#sidebar, #content, .teaser-right{margin-bottom:40px;}

html,
body {

	height: 100%;

	padding:0;
	min-width:241px;
	/* The html and body elements cannot have any padding or margin. */
}

/* Set the fixed height of the footer here */
#push, #footer {
	min-height: 105px;
	padding-top:20px;
}

#push, #footer {
	min-height: 10px;
}


#footer{
	background-color:#dbdbdb;
	box-shadow:        inset 0  8px 8px -8px #696868;

}

.footer1, .footer2, .footer3{

	font-size:20px;
    color: #CCCCCC;
    /*text-shadow: 0 -1px 1px #666666, 0 1px 2px #FFFFFF;*/
	height:110px;
	position: relative;
}

/*.footer1{	position: relative;}
.footer2{	position: relative;}
.footer3{	position: relative;}*/
.divBottom{	position: absolute;bottom:10px;}
.bottom > * {
  vertical-align: bottom;
}

/*
.footer1{background-color:#00CC99;}
.footer2{background-color:red;}
.footer3{background-color:blue;}
*/

#verbandLogo{
	/*height:50px;*/
	/*width:200PX;*/
}




/* Lastly, apply responsive CSS fixes as necessary */
@media (max-width: 767px) {
#footer {

}
}

/* go-to-top */
/*************/
#toTop {
	width:80px;
	/*border:1px solid #ccc;*/
	background:#357ABE;
	opacity:0.7;
	text-align:center;
	/*padding:3px;*/
	position:fixed; /* this is the magic */
	bottom:10px; /* together with this to put the div at the bottom*/
	right:10px;
	cursor:pointer;
	display:none;
	color:white;
	font-size:11px;
	background: url("../img/top.png") no-repeat;
	height:43px;
	width:43px;
}
/* ===== FOOTER | ENDE */

/* ===== FOOTER SOCIAL-MEDIA ICONS | START */
#facebook, #li, #xing, #vsms, #esomar, #sm, #smfr, #smit, #smde, #adm, #EphMRA, #sagJa{
	margin-right:15px;
	/*float:right;*/
	float:left;
	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;
}

#vsms, #adm{
	margin-right:0px;
}


#facebook{	background: url("../img/footer_facebook.png") no-repeat;			width:24px;height:24px;margin-bottom:0;}
#li{		background: url("../img/footer_linkedin.png") no-repeat;			width:22px;height:50px;margin-bottom:0;}
#xing{		background: url("../img/footer_xing.png") no-repeat;    			width:21px;height:50px;margin-bottom:0;}
#vsms{		background: url("../img/logo-vsms-asms_grey.png") no-repeat;    	width:100%;height:100%;}
#esomar{	background: url("../img/esomar.png") no-repeat;    				width:100%;height:100%;}
#smde{    	background: url("../img/vsms-de-gray.png") no-repeat;   		 	width:153px;height:50px;margin-bottom:5px;background-size:100% 100%;}
#smfr{    	background: url("../img/vsms-fr-gray.png") no-repeat;    			width:153px;height:50px;margin-bottom:5px;background-size:100% 100%;}
#smit{    	background: url("../img/vsms-it-gray.png") no-repeat;    			width:153px;height:50px;margin-bottom:5px;background-size:100% 100%;}
#sm{    	background: url("../img/sm.jpg") no-repeat;    					width:130px;height:36px;margin-bottom:5px;}
#adm{    	background: url("../img/FFM/adm.png") no-repeat;    				width:100%;height:100%;}
#EphMRA{    background: url("../img/FFM/EphMRA_grey.jpg") no-repeat;    		width:100%;height:100%;}
#sagJa{    	background: url("../img/FFM/mafo_grey.jpg") no-repeat;    		width:100%;height:100%;}

#facebook:hover, #li:hover, #xing:hover, #vsms:hover, #esomar:hover, #sm:hover, #smde:hover, #smfr:hover, #smit:hover, #adm:hover, #EphMRA:hover, #sagJa:hover{
	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;
}

#facebook:hover{	background: url("../img/footer_facebook_over.png") no-repeat;}
#li:hover{			background: url("../img/footer_linkedin_over.png") no-repeat;}
#xing:hover{		background: url("../img/footer_xing_over.png") no-repeat;}
#vsms:hover{		background: url("../img/logo-vsms-asms_color.png") no-repeat;}
#esomar:hover{		background: url("../img/esomar-hover.png") no-repeat;}
#smde:hover{		background: url("../img/vsms-de.png") no-repeat;background-size:100% 100%;}
#smfr:hover{		background: url("../img/vsms-fr.png") no-repeat;background-size:100% 100%;}
#smit:hover{		background: url("../img/vsms-it.png") no-repeat;background-size:100% 100%;}
#sm:hover{			background: url("../img/sm-hover.jpg") no-repeat;}
#adm:hover{			background: url("../img/FFM/adm-hover.png") no-repeat;}
#EphMRA:hover{		background: url("../img/FFM/EphMRA_color.jpg") no-repeat;}
#sagJa:hover{		background: url("../img/FFM/mafo_color.jpg") no-repeat;}
/* ===== FOOTER SOCIAL-MEDIA ICONS | ENDE */

.subheader{
	font-size:18px;
	font-weight:bold; 
	color:#357ABE;
	font-family: "futura-pt", sans-serif;
	padding-top:20px;
	display:block;
}

/* Datum bei News-Beitr�gen*/
/* Sidebar (Men�) + Beitrag selbst */
.newsdate
{
	display:block;
	color:#ffcc00;
}
/* Nur Beitrag selbst */
.entry .newsdate
{
	display:block;
	color:#ffcc00;
	font-size:20px;
	font-weight:bold; 	
    padding-top: 6px;	
}




/* neu ab 14.9.2015, te / Grund: semantischer Aufbau | START */
h1 .postTitle a{
/*	font-weight:900;*/
	font-size:27px;
	font-weight:bold; 
	color:#357ABE;
/*	margin-top:-8px;*/
	text-decoration:none !important; /* a:hover -> text-decoration:underline wieder �berschreiben */
	font-family: "futura-pt", sans-serif;
}

h1 .postTitle{
	margin:-8px 0 20px 0;
}
/* neu ab 14.9.2015, te / Grund: semantischer Aufbau | ENDE */

h2{
	font-size:18px;
	font-weight:bold; 
	color:#357ABE;
	margin-top:-8px;
	font-family: "futura-pt", sans-serif;
}

.h2_android{
	font-size:18px;
	font-weight:bold; 
	color:#357ABE;
	margin-top:-8px;
	font-family: Arial;

}
.ip-h2_android{
	color:white !important;
}

div.teaser-right div h2{
	line-height:23px;
	letter-spacing:0;
	margin-top:0;
}

h3{
	font-size:13px;
	font-weight:lighter;
	color:#357ABE;
	font-family: "futura-pt", sans-serif;
}

h4{
	text-transform:uppercase; 
	font-weight:bold; 
	color:white;
	font-size:15px;
	font-family: "futura-pt", sans-serif;
}
.h4_anddroid{
	text-transform:uppercase; 
	font-weight:bold; 
	color:white;
	font-size:15px;
	font-family: "futura-pt", sans-serif;
	padding-left:10px;
}
h5{
	text-transform:uppercase; 
	font-family: "futura-pt", sans-serif;
	text-align:center;
	font-size: 33px;
    font-weight: 100;
    letter-spacing: 5px;
	padding-bottom:30px;
	position:relative;
	line-height:32px;
}
h5:after
{
     content: '';
      position:absolute;
      bottom:0;
      left: 45%;
      right: 45%;
      height: 4px;
      background:#357abe;
      display:block;
}
/*
h5:before{
	content : "";
  position: absolute;
  left    : 50%;
  bottom  : 0;
  height  : 1px;
  width   : 30px; 
    border-bottom: 1px solid #706F6E;
}
*/



/* ===== LISTEN / MEN�-NAVIGATION | START */
ul{
	padding:0;
	margin:0;
}
#language *{font-size:12px !important;}
#language ul{
	list-style-type:none;
}

.menu{margin-top:8px;}

.menu ul, .lcp_catlist{
	list-style-type:none;
}

.menu ul{
/*	text-transform:uppercase; */
}


.myul li{
	padding: 3px;
	margin: 20px;
}

.menu li a{
	font-size:16px;
	font-weight:400;
	letter-spacing:1px; 
	font-family: "futura-pt", sans-serif;
}

ul#normal_nav li{
	float:left;			
	padding-right:15px;
	margin-top:10px;
}

ul#mob_nav {	
	width:100%;
	padding:0;
	background-color:#357ABE;
}

ul#mob_nav li  {
	padding: 15px 20px;
}

ul#mob_nav div ul li a{
	color: white;	
	max-width: 480px;
}

#mob_nav ul li a span{
	color: white;	
	font-size:16px;
}

ul.menu li:hover, 
ul.menu li:link{
	color:#357ABE;
	
}

#language a{color:#FFFFFF;} /* im Header Bereich bei "Luzern Z�rich Lugano Frankfurt" soll die Verlinkung nicht grau sein*/
a{
	color:#706F6E;
}
a:link{		text-decoration:none;}
a:visited{	text-decoration:none;}
a:hover{	text-decoration:none;}
a:active{	text-decoration:none;}
/* Verlinkung mit span class .download */
a .download{	text-decoration:underline;}
a:hover .download{color:#357ABE;}


#content div ul li a:hover{	text-decoration:underline;} /* normale "a href" hover im Content mit underline */

/* postTitle innerhalb der Seiten formatieren */
.postTitle a{
/*	font-weight:900;*/
	font-size:27px;
	font-weight:bold; 
	color:#357ABE;
/*	margin-top:-8px;*/
	text-decoration:none !important; /* a:hover -> text-decoration:underline wieder �berschreiben */
	font-family: "futura-pt", sans-serif;
}

.postTitle{
	margin:-8px 0 20px 0;
}

.activeA{
	color:#357ABE;
	font-weight:500 !important;
	/*text-shadow:0px 0px 40px #000;*/
}

.activeB{
	background-color: #357ABE;
	/*width: 100%;*/
	/*margin-left: -20px;*/
	/*padding: 2px 0 2px 20px;*/
	padding:10px 10px 10px 10px;
}
.activeB{
	color:#FFFFFF;
}
p.sidebarP{
	transition: background-color 0.5s ease;
}
p.sidebarP:hover{
	color:white;
	background-color: #357ABE;
}

h4.sidebarP 
{color:#357ABE}

/* ===== SIDEBAR ===== */
.sidebarP{
	padding:10px 10px 10px 10px;
}

div#latestnews .sidebarP a{
/*color:white*/
}

/* ===== SIDBAR: BOX-RIGHT | START */
.box-right{
	padding:0;
	border:1px solid #dbdbdb;
}

.box-right p a{
	font-size: 18px;
	font-weight: 400;
}

#latestnews{
background-color:#dbdbdb;
margin-bottom:-10px; /* margin der <p> Tags in der Sidebar entfernen*/
/*margin-top:-10px;    /* margin der <p> Tags in der Sidebar entfernen*/
color:white;
padding-top:10px;
}

/* ===== SIDBAR: BOX-RIGHT | ENDE */



/* ===== LISTEN / MEN�-NAVIGATION | ENDE */

.hero-unit{
	padding:0;
	background:none;
}

img.link_logo{
	margin-bottom:20px;	
	margin-top:10px;
	max-height:67px;
	}
#wrap_logo{
/*max-width:145px;*/
}
div#header{
	margin: 0 0 50px 0;
	height:130px;
	border-bottom:1px solid #706F6E;
	position:relative; /* neu seit 28.1.2013: brauchts f�r Berg-Logo bei i-Panel */
	padding-bottom:28px;
}

.darkgrey{	           color:#706F6E;}
.darkgreyBG{background-color:#706F6E;}
.grey1{				   color:#dbdbdb;}
.grey1BG{	background-color:#dbdbdb;}
.grey2BG{	background-color:#FFFFFF;}
.grey2{		background-color:#F5F5F5;}
.blue{		color:#357ABE}
.lightblue{ color:#CCDFF2}
.bold{font-weight:900;}


div#blueline{ /* USED TO BE BLUE */
	width:100%;
	height:40px;
	height:48px;
	background-color:#706F6E;
	background-color:#4a4a4a;	
}

#bluelineContainer{
	color:#FFFFFF;
	height:100%;
}

/* ===== ERROR-SITE IE6/7 | START */
#wrapperIE6{
	margin:0 auto;
	width:100%;
	max-width:600px;
	height:300px;
	padding: 50px 20px 0 20px;
}

#ie7Error{
	display:none;
}
/* ===== ERROR-SITE IE6/7 | ENDE */

/* ===== LANGUAGE SWICHTER | START */
#language{
	height: 30px;text-align:right;margin-bottom: 5px;padding-top: 15px;
}
#language span{
	color: rgb(255, 255, 255);
	height: 100%;
}

#language ul li a span{
	margin-left:40px;
}
ul#qtranslate-chooser{
	list-style-type: none;
	display: inline;
}
ul#qtranslate-chooser li{
	float:right;
	padding-left:10px;
}
ul#qtranslate-chooser li span{
	font-size: 16px;
	font-weight: 500;
	color: white;
}
/* ===== LANGUAGE SWICHTER | ENDE */

/* ===== SEARCH | START */
/*
#search{
	height:100%;
	text-align:right;
}
#search_submit{
	background: url("http://www.link.ch/_SHARED/img/search.png") no-repeat;
	margin: 0 0 7px 10px;
	border:none;
	height:16px;
	width:16px;
}
*/
/*
#searchform input#s{
	height:17px;
	width:100%;
	margin-top:11px;
	margin-right:0;
	font-size:12px;	
	padding-left:0;
	padding-right:0;	
	border-radius:0 !important;	
}
*/
/* ===== SEARCH | ENDE */





#logo{float:left;}
.clearboth{clear:both;margin:0;}
/*a name{margin-top:50px;} */

ul.lcp_catlist li{
margin-bottom:70px;
}
ul.lcp_catlist li li{
margin-bottom:5px;
}




/*.floatTop{float:right;background-color:blue;}*/

/* Klasse, welche nur angezeigt wird, wenn max-width : 480px -> sonst per default display:none | Home-Site, Wenn das Bild nicht kommt, dann Div-Box mit Text */
.myShow{display:none;}





/* hier war die smartphone section */







/* ===== IMAGES ===== */
/* Referenzen Bilder */
.ref_img{padding-right:80px;}


/* ===== KONTAKTFORMULAR ===== */
textarea{width:70%}

form p input{
	background-color:#dbdbdb;
	transition: background-color 0.5s ease;
	color:#706F6E;
	border-radius: 3px;
	border:none;
	padding:1px 5px 1px 5px;
}
form p input:hover{
	background-color:#357ABE;
	color:#FFFFFF;
	box-shadow:2px 2px 5px #888;
}

#teaser1,#teaser2,#teaser3,#teaser4{
	min-height:390px;
	height:500px;
	padding:0;
	margin-bottom:10px;
}

#teaser1 h4,#teaser2 h4,#teaser3 h4,#teaser4 h4{
	padding:10px;
	word-wrap:break-word;
	color:#357ABE;
}
#teaser1 span,#teaser2 span,#teaser3 span,#teaser4 span{
	padding:10px;
}
#teaser1 p,#teaser2 p,#teaser3 p,#teaser4 p{
	padding:10px;
	word-wrap:break-word;
	margin:0;
	transition: background-color 0.5s ease;
}

#teaser1 p.sidebarP:hover, #teaser2 p.sidebarP:hover, #teaser3 p.sidebarP:hover, #teaser4 p.sidebarP:hover{
	background-color:#357ABE;
}
#teaser1 p.sidebarP:hover *, #teaser2 p.sidebarP:hover *, #teaser3 p.sidebarP:hover *, #teaser4 p.sidebarP:hover *{
	color:white;
}


.link-teaser3{
padding:0;
background:url("../img/LINKtouch/LINKtouch_2015_WF11/LINKtouch_11b_teaser.png");
background-size: 100%;
background-repeat: no-repeat;
}
.link-teaser4{
padding:0;
background:url("../img/LINKtouch/LINKtouch_2015_WF13/LINKtouch_2015_13_teaser.png");
background-size: 100%;
background-repeat: no-repeat;
/*border:2px solid #357ABE;
max-width:266px;*/
}

.imgBorder{border: 1px solid #357ABE;padding:10px;}


/* ===== Internet-Panel ONLY ===== */
/* panel blauer background */
#ip-bg{
	position:absolute;
	left:0;
	width:100%;
	background-color:#357ABE;
	z-index:-10000;
}
div#footer.ip-footer{
	background-color:#357ABE;
	box-shadow:none;

}
div#footer.ip-footer *{

	color:#FFFFFF;
}

/*.ip-content{background:#FFFFFF;}*/
/*.ip-entry{padding:10px;}*/
.ip-box-right{background:#FFFFFF;border:1px solid white;}
div#header.ip-header{border-bottom:none;}
div#blueline.ip-blueline{background-color:#FFFFFF;}
.ip-teaser1, .ip-teaser2, .ip-teaser3, .ip-teaser4{height:560px !important;}
#ip-headerImg{display:none;}/* wird im master.js gestylt und positioniert */
#ip-sidebar{display:none;} /* wird im master.js gesetzt */
ul#mob_nav.ip-mob_nav {background-color:#FFFFFF;}
ul#mob_nav.ip-mob_nav div ul li a{color: #357ABE;}
#mob_nav ul li a span.ip-mob_nav{color: #357ABE;}
#mob_nav.ip-mob_nav span{color:#357ABE;}
#language.ip-language span{color:#000000;}
.myShow.ip-myShow h2, .myShow.ip-myShow h3{color:#FFFFFF;}

.spenden{
	transition: background-color 0.5s ease;
	background-color: #DBDBDB;
	width: 150px;
	height: 180px;
	padding: 10px;
	margin: 0 20px 20px 0;
	float: left;
	position: relative;
}
.spenden:hover{
	transition: background-color 0.5s ease;
	background-color:#FFEE9F;
}

.download-spenden{
/*	position:absolute;
	bottom:0px;
	left:0;
	transition: background-color 0.5s ease;
	background-color:#357ABE;
	width:220px;
	height:20px;
	color:white;
	text-align:center;
	padding:5px 0 5px 0;
*/
	position: absolute;
	bottom: 0px;
	left: 0;
	transition: background-color 0.5s ease;
	background-color: #357ABE;
	width: 170px;
	height: 20px;
	color: white;
	text-align: center;
	padding: 5px 0 5px 0;
}

.download-spenden:hover{
	/*transition: background-color 0.5s ease;
	background-color:blue;*/
}

#ref{
height:auto;
}
#ref div{
text-align:center;
}

#ref div img{
margin-right:10px;
width:	100px;
height:100px;
}

.ref-wrap{
float: left;
margin: 0 20px 20px 0;
height: 229px;
position: relative;
}
.ref-box{
/*border: 1px solid #dbdbdb;
padding: 25px 0 0 0;
height: 175px;
width: 200px;
text-align:center;*/
	border: 1px solid #dbdbdb;
	padding: 12px 0 0 0;
	height: 156px;
	width: 168px;
	text-align: center;
	
	border-radius: 50%;
    padding: 20px;	
	height:90px;
	width:90px;
float: left;
margin: 0 8px 8px 0;	
	
}
.ref-txt{
display:none;

	background-color: #357ABE;
	position: absolute;
	bottom: 0;
	height: 50px;
	width: 160px;
	padding: 10px 0 0 10px;
}
.ref-txt p{
	color:#FFFFFF;
	margin:0;
}

.teaser-right div{
	background-color:#357ABE;
	background-color:#E5F0F8;
}
#teaser-right-1 *{
/*	color:#FFFFFF;*/
}
.teaser-right div{
	padding:10px;
	height:auto;
}
.teaser-right div h4{
	margin-top:0;
}
.ip-teaser-right-1{
	border: 1px solid #FFFFFF;
}

#teaser-right-2{
	margin-top:20px;
	background-color:#FFFFFF;
	border: 1px solid #357ABE;
}
#teaser-right-2 p{
	color:#706F6E;
}

#map-canvas1, #map-canvas2, #map-canvas3, #map-canvas4, #map-canvas5, #map-canvas6{
	height: 237px;
	width: 100%;
	position:relative !important;  /* position:relative  wird zwar per google script gesetzt, teilweise jedoch zu sp�t. So kommt es im IE zu Problemen: die Karten werden absolute 0 0 im body positioniert. Deshalb setze ich hier das relative mit !important, so funktionert es auch im IE
/*	visibility:visible; */
}

/* Resetting bootstraps max-width:100% to "none", otherwise the google maps Streetview-Icon doesn't appear */
#map-canvas1 img, #map-canvas2 img, #map-canvas3 img, #map-canvas4 img, #map-canvas5 img, #map-canvas6 img{
	max-width: none
}


::selection {
	background: #357ABE; /* Safari */
	color:#FFFFFF;
	}
::-moz-selection {
	background: #357ABE; /* Firefox */
	color:#FFFFFF;	
}

/* spendenstand in index teaserbox */
.spendenstand{
	background-color: #ffcc00;
 	margin: 0 10px 0 10px;
 	text-align: center;
	line-height:50px;
}
/*
.spendenstand p{
	background:#ffcc00;
	margin:0 10px 0 10px !important;
	text-align:center;	
	display:block !important;
	height:24px;
}
*/
.spendenstand *{
	font-family: "futura-pt", sans-serif;
	color:#357ABE !important;
	letter-spacing:6px;  
	font-size:16px !important;
/*	text-shadow:
    0 0 10px #357ABE,
    0 0 20px #357ABE;
*/
}
.odometer * {
/*letter-spacing:0 !important;*/
padding:0 !important;
}



/* ============================================== */
/* PROVISORISCH, BIS ALLE SPRACHEN VORHANDEN SIND */
.lang-de, .lang-en, .lang-fr, .lang-it{
/*display:none;*/
}


/* BILDER */
.fancy-content div{
float:left;
margin-right:0px;
margin-top:8px;}


/* FFM ONLY */
.footerHeightFFM{
min-height:130px;
}
#EphMRA{
margin-top:18px;
}
.teaserFFM1,.teaserFFM2,.teaserFFM3,.teaserFFM4{
	min-height:310px !important; /* min-height von id's #teaser1/#teaser2/#teaser3/#teaser4 f�r FFM �berschreiben, daher !important */
}


.blueLineFFM{
	background-color:#357ABE !important;
}



/* ===== SMARTPHONE SECTION | START */
@media only screen and (max-width : 480px) {
/* neu (seit 25.10.2013) werden die folgenden Styles bereits ab max-width 767px definiert  

	div#wrap {
		margin-top:30px;
	}
	a#nav_ctrl {		
		display:inline-block;
		float: right;

	}	
	ul#normal_nav {
		display:none;
	}
	div#footer {
		padding-left:10px;
	}
	#language ul li a span{
		font-size:20px !important;
	}
*/

	
	/* evtl. ab hier ebenfalls bereits ab max-width: 767px setzen */
	#language{display:none;}
	#search{display:none;}	
	.myHide{display:none;}	
	/*div#blueline{height:5px;}*/
	.myShow{display:block;}	
	#searchform input#s{
		height:30px;
		width:60%;
		margin-left:20px;
	}

/*	#ip-headerImg{display:none;}/* wird im master.js gestylt und positioniert */

}

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

	.ip-teaser1, .ip-teaser2, .ip-teaser3, .ip-teaser4{height:750px !important;}

	#teaser1,#teaser2,#teaser3,#teaser4{
		height:600px;
	}

}

@media only screen and (min-width : 481px) {
/*
	a#nav_ctrl {
		display:none;
	}
	ul#mob_nav {
		display:none !important;
	}
*/

}

iframe {
	padding:0;
	margin:0;
}

@media (max-width: 767px) {  
	.footer1, .footer2, .footer3 {
		padding-left:20px;
	}

	.footer1{
		height:110px;
	}
	.footer2{
		height:10px;
	}	
	.footer3{
		height:70px;
	}		
	.divBottom{line-height:13px;}
	
	div#blueline{height:5px;}
	

/* neu (seit 25.10.2013) werden die folgenden Styles bereits ab max-width 767px definiert  */
	div#wrap {
		margin-top:30px;
	}
	a#nav_ctrl {		
		display:inline-block;
		float: right;

	}	
	ul#normal_nav {
		display:none;
	}
	div#footer {
		padding-left:10px;
	}
	#language ul li a span{
		font-size:20px !important;
	}
	div#header{
		height:60px;
	}	
/* neu (seit 25.10.2013) werden die folgenden Styles bereits ab max-width 767px definiert  ENDE */

	div#header.ip-header{
		background: white;
		/*height:49px;*/
		height:110px;
		padding:10px;
	}

/*	.ip-header img.trans.link_logo{max-width:75%;}*/
	#logo{max-width:70%;}



}


/* ===== SMARTPHONE SECTION | ENDE */



.inputField 
{ 
	background:#CCCCCC !important;
} 

.errorField 
{
	background:#CCDFF2 !important;
	border: 2px solid #FFCC00 !important;
} 

.captcha{
	background:#357ABE;
	line-height:20px;
	width:28px;
	padding:10px;
	color:#FFFFFF;
	margin-top:10px;
}
.formError
{
color:#357ABE;
background: #FFCC00;
padding: 8px;
}

/* href Buttons: blaues Div, weisser resp. gelber Background */
.refButton{
	margin: 30px 0 30px 0;
	padding:10px;
	text-align:center;
/*	
	-webkit-box-shadow: 0px 0px 56px -10px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 0px 56px -10px rgba(0,0,0,0.75);
	box-shadow: 0px 0px 56px -10px rgba(0,0,0,0.75);	
*/	
	transition: background-color 0.5s ease;
	background-color:#939393 !important;
}

.refButton:hover{
	background-color: #ffcc00 !important;
}

/* generell keine Text-Decoration bei href f�r diese Klasse */
.noText-Decoration,.noText-Decoration:hover,.noText-Decoration *,.noText-Decoration:hover * {	text-decoration:none !important;}


/* innerhalb des Divs .refButton soll die Schrift mit einem Background-Image ("Download-Icon") hinterlegt sein */
.refButtonDownloadIcon{
	background: url("../img/icon-set/download.png");
	background-repeat:no-repeat;
	background-position:left;
	color:white;
	padding-left:60px; 
	display:block;
}
.textAlignLeft{
text-align:left;
padding-left:50px;
}







/* tempor�r, da Kontaktformular aktuell nicht funktioniert. via mailto gel�st und hierf�r hab ich das noch etwas gestylt */
#mailtoButton{width:200px;border:1px solid #adadad;padding:5px;border-radius:4px;text-align:center;margin-top:30px;
cursor:pointer;
	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;
}
#mailtoButton a{text-decoration:none !important;}
#mailtoButton:hover{border:1px solid #357abe;color:#357abe;}



/* STARTSEITE TEASER THEMES | START */

.start-teaser-theme-txticon
{
	max-height:40px;
	margin:10px 0 10px 0;
}


.wrapperTeaserThemes
{
	margin-top:50px;
}
.wrapperTeaserThemes .start-teaser-theme-image img
{
	margin-top:10px;
	max-height:400px;
}
.teaserTheme{
	font-size:20px;
	font-family: "futura-pt", sans-serif;
	color:#939393;
	text-transform:uppercase; 	
	letter-spacing:3px;
	margin-bottom:30px;
}
.text-align-center{text-align:center;}

@media (min-width: 768px) {  
.text-align-right{text-align:right;}
.text-align-left{text-align:left;}
}
@media (max-width: 767px) {  
.wrapperTeaserThemes {text-align:center;}
.text-align-right{margin-bottom:20px;}
.text-align-left{margin-bottom:20px;}
.start-teaser-theme-image img {padding:0 !important}


}



.scrollDown{
margin: 200px 0 70px 0;
}
.scrollDownNewsletter{
margin: 50px 0 50px 0;
}
.scrollDown>a>div{
text-align:center;
border-top:5px solid #939393}
.scrollDown img{
width:50px;
margin-top:-5px;
}
.Startseite-Teaser-Descr{
	margin-top:50px;
	text-align:justify;
}
.Startseite-Teaser-Descr *{
	font-size:17px;
	font-family: "futura-pt", sans-serif;
	color:#939393;
	letter-spacing:1px;
}
.Startseite-Teaser-Descr p:first-child::first-letter{
	font-size:200%;
	float: left; color: #357abe; font-size: 45px; line-height: 38px; padding-top: 4px; padding-right: 9px; padding-left: 0px; 

}
.margin-top-minus100{
	margin-top:-100px;
}

/* Teaser LINK touch start */

.c2{margin-top:-100px;}
.c3{margin-top:-400px;margin-left:180px;}
.c4{margin-top:-440px;margin-right:180px;}
.txtc1{margin-top:-760px;}
.txtc2{margin-top:-244px;}
.txtc3{margin-top:-569px;margin-left:301px;}
.txtc4{margin-top:-613px;margin-right:305px;}
.linktouch-txt{margin-top:-657px;}
@media (max-width: 768px) {  
	.margin-top-minus100{
		margin-top:-50px;
	}
}

@media (max-width: 460px) {  
	.c2{margin-top:-155px;}
	.c3{margin-top:-161px;margin-left:0;}
	.c4{margin-top:-155px;margin-right:0;}
	.txtc1{margin-top:-873px;}
	.txtc2{margin-top:-748px;}
	.txtc3{margin-top:-652px;margin-left:0;}
	.txtc4{margin-top:-545px;margin-right:0;}
	.linktouch-txt{margin-top:-307px;}
	.margin-top-minus100{
		margin-top:-10px;
	}
}


/* Teaser LINK touch ende */


/* STARTSEITE TEASER THEMES | ENDE */

.noBootstrapMarginLeft /* Default bootstrap margin-left von -30px (was normalerweise wohl sinn macht) aufl�sen */ 
{
margin-left:0 !important;

}




.smartBox{
	transition: background-color 0.5s ease;
    width: 90px;
    height: 90px;
    padding: 10px;
    margin: 0 20px 20px 0;
    float: left;
	border:2px solid #357abe;
	position:relative;
}
.smartBox img
{
position:absolute;
bottom:10px;
right:10px;
width:25px;
z-index:100000;
}
.smartBox p
{
	color:#357abe;
	font-weight:bold;	
	line-height:7px;
	font-size:12px;	
}
/*
.smartBox:hover{
	transition: background-color 0.5s ease;
	background-color:#EDEDED;
}
*/

.entry{
text-align:justify;}

/* newsletter auf website: www.link.ch/newsletter */
.newsletterbox{
width:100%;
height:100px;
background:#357abe;
margin-bottom:70px;
padding:20px;
}

/* Klassen f�r Elemente, welche nur auf link.ch resp. nur auf link-institut.de angezeigt werden sollen. Suche im master.js nach de-only */
.de-only{display:none;}
.ch-only{display:none;}

/* ============================================================================================== Tableau (dynamische Grafiken) von Tom Bauer einbinden | START */
/* diese sind nicht responsive, daher setze ich den Container auf "auto"*/
/* zus�tzlich wird das iFrame dynamisch in der Gr�sse angepasst, mittels JS -> ../_SHARED/js/iframe/iframeresize.js (eingebunden im footer.php) */
/*.tableauPlaceholder{width:auto !important;height:auto !important} */

.tableauDesktop{display:block !important;width:auto !important;height:auto !important} 
.tableauMobile {display:none !important;} 

/*.tableauStaticImg{display:none;} /* Bild anstelle iFrame */

/* Generell Smartphone(s) (stimmt plus/minus) und ist auch nicht extrem wichtig dass es immer "greift" */
/* https://www.bhalash.com/archives/13544803259 */
@media only screen 
    and (min-device-width: 320px) and (max-device-width: 736px) and (orientation: portrait),
only screen
    and (min-device-width: 320px) and (max-device-width: 736px) and (orientation: landscape) {
        /*.tableauPlaceholder {display:none !important;}*/
		
/*		.tableauStaticImg{display:block;}  /* Bild anstelle iFrame */
		
		.tableauDesktop{display:none !important;} 
		.tableauMobile{display:block !important;width:auto !important;height:auto !important} 
		
}
/* ============================================================================================== Tableau (dynamische Grafiken) von Tom Bauer einbinden | ENDE */


/* ============================================================================================== ghost-button style | START */
.ghost *{text-decoration:none !important;color:white;}
.ghost{padding: 10px;margin: 0 auto;text-align: center;width: 250px;border: 1px solid #fff;margin-top: 40px;
	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;
}
.ghost a{
	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;
}


.ghost:hover  {border: 1px solid #357abe;}
.ghost:hover a{color:#357abe;}
/* ============================================================================================== ghost-button style | ENDE */

/* ============================================================================================== Popup-Box / Modal-Box | START */
/* z.B. bei Standortbilder unter Kontakt auf link.ch.
   Klick auf Bild �ffnet Modal-Box. Darin �ffnet sich das iFrame mit GoogleMaps
   Tutorial: http://www.webdesignerdepot.com/2012/10/creating-a-modal-window-with-html5-and-css3/
*/
.modalDialog {
	position: fixed;
	font-family: Arial, Helvetica, sans-serif;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0,0,0,0.8);
	z-index: 99999;
	opacity:0;
	-webkit-transition: opacity 400ms ease-in;
	-moz-transition: opacity 400ms ease-in;
	transition: opacity 400ms ease-in;
	pointer-events: none;
}
.modalDialog:target {
	opacity:1;
	pointer-events: auto;
}

.modalDialog > div {
	width: 80%;
	height:60%;
	position: relative;
	margin: 10% auto;
	padding:5px;
	padding:0px;	
	border-radius: 5px;
	border:none;
	background: #fff;
	background: -moz-linear-gradient(#fff, #999);
	background: -webkit-linear-gradient(#fff, #999);
	background: -o-linear-gradient(#fff, #999);
}
.modalDialog iframe {
	width: 100% !important;
	height:100% !important;
}
.close {
	background: white;
	color: black;
	line-height: 25px;
	position: absolute;
	right: -30px;
	text-align: center;
	top: -10px;
	width: 24px;
	text-decoration: none;
	font-weight: bold;
	-webkit-border-radius: 12px;
	-moz-border-radius: 12px;
	border-radius: 12px;
	-moz-box-shadow: 1px 1px 3px #000;
	-webkit-box-shadow: 1px 1px 3px #000;
	box-shadow: 1px 1px 3px #000;
}

.close:hover { background: #ffcc00; }

/* ============================================================================================== Popup-Box / Modal-Box | ENDE */