/* CSS-File fuer FReiradler-Website */

/* Ausnahmen: map.css gallery.css leaflet.css shariff.complete.css  */
body {
	font-family: 'Open Sans', 'Liberation Sans', 'Times New Roman', Arial,
		Helvetica, sans-serif;
	font-size: 90%;
}

p.textblock {
	max-width: 70em;
}

div.textblock {
	max-width: 70em;
}

ul {
	max-width: 70em;
}

/* Small buttons for Shariff */
.shariff .orientation-horizontal li {
	min-width: 35px;
	max-width: 35px;
}

/* Zwei Spalten Layout */
#wrapper {
	width: 26.7em;
	margin: 0;
}

#leftCol {
	float: left;
	width: 15em;
}

#rightCol {
	float: right;
	width: 11em;
}

/* Link-Formate */
a:link {
	text-decoration: none;
	color: black;
}

a:visited {
	text-decoration: none;
}

a:hover {
	text-decoration: none;
	font-weight: bold;
}

/* p.a:hover {text-decoration:none; font-weight:bold; }
	*/
a.mystd {
	font-size: 90%
}

td.mystd {
	font-size: 90%
}

/* Ueberschrift */
td.colu {
	width: 26.7em;
	text-align: center;
	border: none;
}

/* Styles fuer Tabellenkopf 26.7 em*/
td.col1 {
	width: 2.4em;
	text-align: center;
	font-weight: bold;
	font-size: 90%;
	border: none;
	border-bottom: solid;
	border-width: thin;
	height: 1em
}

td.col2 {
	width: 5em;
	text-align: center;
	font-weight: bold;
	font-size: 90%;
	border: none;
	border-bottom: solid;
	border-width: thin
}

td.col3 {
	width: 2.4em;
	text-align: center;
	font-weight: bold;
	font-size: 90%;
	border: none;
	border-bottom: solid;
	border-width: thin
}

td.col4 {
	width: 14em;
	text-align: center;
	font-weight: bold;
	font-size: 90%;
	border: none;
	border-bottom: solid;
	border-width: thin
}

td.col5 {
	width: 2.9em;
	text-align: center;
	font-weight: bold;
	font-size: 90%;
	border: none;
	border-bottom: solid;
	border-width: thin
}

/* Styles fuer Tabelleninhalte 26.7 em*/
td.cb1 {
	width: 2.4em;
	text-align: center;
	font-weight: normal;
	font-size: 90%;
	border-top: none;
	border-bottom: none;
	border-left: none
}

td.cb2 {
	width: 5em;
	text-align: center;
	font-weight: normal;
	font-size: 90%;
	border-top: none;
	border-bottom: none;
	border-left: none
}

td.cb3 {
	width: 2.4em;
	text-align: center;
	font-weight: normal;
	font-size: 90%;
	border-top: none;
	border-bottom: none;
	border-left: none
}

td.cb4 {
	width: 14em;
	text-align: center;
	font-weight: normal;
	font-size: 90%;
	border-top: none;
	border-bottom: none;
	border-left: none
}

td.cb5 {
	width: 2.9em;
	text-align: center;
	font-weight: normal;
	font-size: 90%;
	border-top: none;
	border-bottom: none;
	border-left: none
}

/* Styles fuer Tabelleninhalte Legende */
td.cl1 {
	text-align: center;
	font-weight: normal;
	font-size: 90%;
	border-top: none;
	border-left: none
}

td.cl4 {
	font-weight: normal;
	font-size: 90%;
	border-top: none;
	border-left: none
}

/* Styles fuer Footer-Tabelle 26.7em */
td.clfoot1 {
	width: 8em;
	text-align: center;
	font-weight: normal;
	border: none;
	border-right: solid;
	border-width: thin;
}

td.clfoot2 {
	width: 8em;
	text-align: center;
	font-weight: normal;
	border: none;
}

td.clfoot3 {
	width: 10.7em;
	text-align: center;
	font-weight: normal;
	border: none;
	border-left: solid;
	border-width: thin;
}

/* Tabellen-Formate */
td.foot {
	font-size: 90%;
	text-align: center;
	border-top: none;
	border-left: none
}

td.thead {
	font-size: 90%;
	font-weight: bold;
	text-align: center;
	border-top: none;
	border-left: none
}

td.tbody {
	font-size: 90%;
	text-align: center;
	border-top: none;
	border-left: none
}

td.tbodytime {
	font-size: 90%;
	white-space: nowrap;
	text-align: center;
	border-top: none;
	border-left: none;
	margin: 1em;
}
/* tour.html */
td.tbodyleft {
	font-size: 90%;
	text-align: left;
	border-top: none;
	border-left: none
}

/* Styles fuer Tabelleninhalte Buttons */
td.cl_info2 {
	text-align: right;
	font-weight: normal;
	border-top: none;
	border-left: none
} /* rechts */
td.cl_cct {
	text-align: center;
	font-weight: normal;
	border-top: none;
	border-left: none
} /* Mitte */
td.cl_history {
	width: 14em;
	font-size: 90%;
	font-weight: normal;
	text-align: center;
	border-top: none;
	border-bottom: none;
	border-left: none
}

/* Standardgroesse fuer Bilder */
img {
	width: 1.6em;
	height: 1.6em;
	vertical-align: middle
}

.imgbutton:hover {
	-webkit-filter: invert(100%) !important;
}

/* Buttons */
button {
	cursor: pointer;
}

input[type=button] {
	cursor: pointer;
}

input[type=button]:hover {
	/* -webkit-filter: invert(100%) !important; */
	box-shadow: 0 0 2px black;
	color: white;
}

#bt1 { /* Status-Button, weiß */
	height: 2.2em;
	width: 2.2em;
	margin: 0 0em;
	padding: 0 0em;
	background-color: white;
}

#bt1:hover {
	box-shadow: 0 0 2px black;
	background-color: rgb(238, 238, 238); /* bright grey */
}

/* aus tour.html */
#bt2 {
	height: 2.7em;
	width: 2.7em;
	margin: 0 0em;
	padding: 0 0em;
	background-color: white;
	text-align: center;
	font-weight: normal;
	font-size: 90%;
}

#bt2:hover {
	box-shadow: 0 0 2px black;
	background-color: rgb(238, 238, 238); /* bright grey */
	/* background-color: rgb(255,255,102);  light yellow */
}

#bt3 { /* Foto-Button, weiß */
	height: 2.2em;
	width: 2.6em;
	margin: 0 0em;
	padding: 0 0em;
	background-color: white;
}

#bt3:hover {
	box-shadow: 0 0 2px black;
	background-color: rgb(238, 238, 238); /* bright grey */
}

#bt4 { /* blauer Tour-Button */
	min-height: 2.2em;
	width: 100%;
	background-image: linear-gradient(to top right, transparent, rgb(167, 200, 239));
}

#bt4:hover {
	box-shadow: 0 0 2px black;
	color: grey;
}

#bt_extra {
	min-height: 3em;
	background-image: linear-gradient(to top left, transparent, green);
}

#bt_extra:hover {
	box-shadow: 0 0 2px black;
	color: white;
}

#bt_extra_green { /* grüner Hintergrund-Verlauf */
	min-height: 3em;
	background-image: linear-gradient(to top left, transparent, green);
}

#bt_extra_green:hover {
	box-shadow: 0 0 2px black;
	color: white;
}

#bt_extra_white { /* gräulicher Hintergrund-Verlauf */
	min-height: 3em;
	background-image: linear-gradient(to top left, transparent, lightgrey);
}

#bt_extra_white:hover {
	box-shadow: 0 0 2px black;
	color: white;
}

#bt_extra_red { /* roter Hintergrund-Verlauf */
	min-height: 3em;
	background-image: linear-gradient(to top left, transparent, red);
}

#bt_extra_red:hover {
	box-shadow: 0 0 2px black;
	color: white;
}

#bt_info {
	min-height: 2.5em;
	background-image: linear-gradient(to bottom right, transparent, yellow);
}

#bt_info:hover {
	box-shadow: 0 0 2px black;
	color: grey;
}

/* Button nur für kleine Bildschirme */
.mobileShow {
	display: none;
}
/* Smartphone Portrait and Landscape */
@media only screen and (max-device-width : 1024px) {
	.mobileShow {
		display: inline;
	}
}

/* Verblassender Kurzabsatz */
div.shortened {
	color: white;
	max-height: 2.5em;
	max-width: 70em;
	overflow: hidden;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-image: linear-gradient(#013399, white);
}

div.shortened:hover {
	color: #013399;
	max-height: 20em;
	max-width: 70em;
	overflow: visible;
	-webkit-text-fill-color: #013399;
	transition: 0.3s;
}

div.shortened:active {
	color: #013399;
	max-height: 20em;
	max-width: 70em;
	overflow: visible;
	-webkit-text-fill-color: #013399;
	transition: 0.3s;
}

/* Bildtausch bei Mouseover */
.imghover img:last-child {
	display: none
}

.imghover:hover img:first-child {
	display: none
}

.imghover:hover img:last-child {
	display: inline-block
}

/*!
 * CSS fuer maps von Selmo (FReiradler)
 * http://rad.soundof.eu/
 * CSS checked at: https://meyerweb.com/eric/articles/webrev/199904.html
 */

/*! Blauer Punkt */
.my-marker-class {
	background: red;
	border: 5px solid rgba(255, 255, 255, 0.5);
	color: blue;
	font-weight: bold;
	text-align: center;
	border-radius: 50%;
	line-height: 30px;
	font-size: 12pt;
	width: 200px;
}

/*! Überschrift */
.map-heading-class {
	height: 30px !important;
	text-align: center;
	background: rgba(255, 255, 255, 0.6);
	border: 2px solid red;
	border-radius: 15px;
	font-size: 18px;
	font-weight: bold;
	color: black;
}

.CIconPinGreen {
	background-image:
		url("http://rad.soundof.eu/icons_rad/pin_icon_green_medium.png");
	font-size: 16px;
	text-align: center;
	position: relative;
	color: White;
}

.CIconPinRed {
	background-image:
		url("http://rad.soundof.eu/icons_rad/pin_icon_red_medium.png");
	font-size: 16px;
	text-align: center;
	position: relative;
	color: White;
}

.CIconPinBlue {
	background-image:
		url("http://rad.soundof.eu/icons_rad/pin_icon_blue_medium.png");
	font-size: 16px;
	text-align: center;
	position: relative;
	color: White;
}

.CIconPinBlack {
	background-image:
		url("http://rad.soundof.eu/icons_rad/pin_icon_black_medium.png");
	font-size: 16px;
	text-align: center;
	position: relative;
	color: White;
}

#mapid {
	
}