@charset "UTF-8";
body {
	background: url("https://spanienwetter.es/bilder/wall.jpg")  no-repeat fixed center center / cover;
	margin: 0;
	padding: 0;
	color: #0f2b4a;
    font-family: 'Quicksand', sans-serif;
	font-weight:lighter;
    -webkit-font-smoothing: antialiased;
}

.ui-mobile-viewport ui-overlay-a { visibility:hidden; height:0px; width:0px;}

h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;	
	padding-right: 15px;
	padding-left: 15px; 
}

h2#ueberschrift { font-size:22px; font-weight:100;}


a img {
	border: none;
}

a:link {
	color: #42413C;
	text-decoration: underline; 
}
a:visited {
	color: #6E6C64;
	text-decoration: underline;
}
a:hover, a:active, a:focus { 
	text-decoration: none;
}

.container {
	border-radius:5px;
	width: -webkit-calc(100% - 10px);
    width:    -moz-calc(100% - 10px);
    width:         calc(100% - 10px);
	padding-top:60px;
	padding-left: 5px;
	padding-right: 5px;
	max-width:1050px;
	margin: 5px auto; 
	color: #0f2b4a;
}

.container a { color: #0f2b4a; text-decoration:none; }

h2#webcam_ueberschrift { font-size:20px; font-weight:100; text-align:center; padding-top:20px; }
h2#webcam_ueberschrift a { text-decoration: underline;}

#hintergrund {background-color: rgba(255,255,255, 0.5); border-radius:5px; width:100%;}

#bild-cam2 {
    border: 2px solid #ffffff;
    border-radius: 5px;
    height: auto;
    max-height: 550px;
    max-width: 1000px;
    overflow: hidden;
    /*position: relative;*/
    width: 98%;
	margin:5px auto;
}

#bild-cam2 img {
    margin-top: -60px; width: 100%; height: auto;
}

#bild-cam3 {
    border: 2px solid #ffffff;
    border-radius: 5px;
    height: auto;
    max-height: 550px;
    max-width: 1000px;
    overflow: hidden;
    /*position: relative;*/
    width: 98%;
	margin:5px auto;
}

#bild-cam3 img {
    margin-top: -160px; width: 100%; height: auto;
}


#bild-cam4 {
	border:2px solid #fff;
	border-radius:5px;
	margin:0 auto;
	width:100%;
	max-width:660px;
	overflow:hidden;
	position:relative;}

#bild-cam4 img { width:100%; margin-top:-20px;}	


#bild-camsev {
    border: 2px solid #ffffff;
    border-radius: 5px;
    height: auto;
    max-height: 550px;
    max-width: 1000px;
    overflow: hidden;
    /*position: relative;*/
    width: 98%;
	margin:5px auto;
}

#bild-camsev img {
    margin-top: -20px; width: 100%; height: auto;
}


header {
    background: #5abbe8 none repeat scroll 0 0;
    border-bottom: 1px solid #3d9fe0;
    box-shadow: -8px -8px 12px #14478c;
    color: #eee;
    float: left;
    height: 40px;
    left: 0;
    margin: 0;
    padding: 0 0 4px;
    position: fixed;
    top: 0;
    width: 100%;
    z-index:9999999999;
}

#headerinhalt {
	width: 96%;
	padding-top:0px;
	max-width:1050px;
	margin: 5px auto; 
}

#headerinhalt a { color:#FFFFFF;}

input#project2 { float:right; border-radius: 5px; background-color: #3ea0df; border: none; padding: 5px; color: #fff; letter-spacing: 1px; margin-right: 160px; margin-top: -30px;}

iframe#suchen {margin-right: 60px; margin-top: -40px; float:right;  }

#spanienwetter {float:left; margin-left:50px; margin-top:-32px; font-size:20px; font-weight:100; letter-spacing:1px; text-shadow:1px 1px 1px #247ead;}
#spanienwetter a { font-weight:100;}

#flightmap {}

img#flight {margin:0px; float:left; width:100%; max-width:400px; border-radius: 5px;}

#logo {
  display: block;
  position: relative;
  /*margin: 0 auto;*/
  top: 0px;
  height: 35px;
  width: 35px;
  /*background: url('../bilder/sun.png') center center no-repeat, #fba717;
  border-radius: 50%;
  box-shadow: 1px 1px 2px rgba(0,0,0,.3);*/
  background: url('https://spanienwetter.es/bilder/sun.png') center center no-repeat;
	background-size: 30px;
}

#logonews {
  display: block;
  position: relative;
  /*margin: 0 auto;*/
  top: 0px;
  height: 26px;
  width: 26px;
	border-radius: 50%;
  /*background: url('../bilder/sun.png') center center no-repeat, #fba717;
  
  box-shadow: 1px 1px 2px rgba(0,0,0,.3);*/
  background: url('https://spanienwetter.es/bilder/sun.png') center center no-repeat, #fba717;
	background-size: 20px;
}


#einstellungen {
  display: block;
  position: relative;
  /*margin: 0 auto;*/
  top: 0px;
  height: 40px;
  width: 40px;
  background: url('https://spanienwetter.es/bilder/weiss30neu.png') center center no-repeat, #5abbe8;
  border-radius: 10px;
  box-shadow: inset 0 0 17px rgba(13,59,81,.4);
}

#headerlogo {width:100px; height:20px;  float:right; margin-top:-32px; font-size: 11px; }
#headerlogo a { text-decoration: none;  }
#headerlogo img {  vertical-align: text-bottom;  }

#mapklein { float:right; width:350px; margin-top: 60px; }
#littlemap {height:299px;}

#littleueberschrift2 { text-align: center; font-size: 16px; margin-top: 10px; color: #174b63;}


.sidebar1 {
	float: right;
	width: 220px;
	background: #eeeef0;
	padding-bottom: 10px;
}
.content {
	padding: 10px 0;
	width: 100%;
	
}

#rundherum {margin-top:20px; width:100%;}
#divrundum2 { float:left; width: -webkit-calc(100% - 620px); width:    -moz-calc(100% - 620px); width:         calc(100% - 620px); }

#divrundum2erdbeben  { float:left; width: -webkit-calc(100% - 800px); width: -moz-calc(100% - 800px); width: calc(100% - 800px); visibility: visible; }

#divrundum2erdbeben img { border-radius: 5px;}

#div3x25_1 { width:310px; height:260px; float:left; background-color: rgba(255,255,255, 0.5); border-radius:5px; margin:0px;-webkit-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);-moz-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1); cursor:pointer;}
#div3x25_2 { width:310px; height:259px;  background-color: rgba(255,255,255, 0.5); border-radius:5px; margin:0px auto; padding-top:1px;-webkit-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);-moz-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1); cursor:pointer;}
#div3x25_3 { width:310px; height:260px; float:right; background-color: rgba(255,255,255, 0.5); border-radius:5px; margin:0px;-webkit-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);-moz-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1); cursor:pointer;}
#div3x25_4 { width:0; height:0px; visibility:hidden; float:left; background-color: rgba(255,255,255, 0.5); border-radius:5px; margin:0px;-webkit-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);-moz-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1); cursor:pointer;}

#div3x25_1:hover { background-color: rgba(140,238,202, 0.3); }
#div3x25_2:hover { background-color: rgba(140,238,202, 0.3); }
#div3x25_3:hover { background-color: rgba(140,238,202, 0.3); }


#div4x25_1 { width:49%; height:242px; float:left; /*background-color: rgba(255,255,255, 0.3); border-radius:5px;*/ margin:0px;}
#div4x25_2 { width:49%; height:242px; float:right; /*background-color: rgba(255,255,255, 0.3); border-radius:5px;*/ margin:0px;}


.div300250 { width:300px; height:250px; margin:5px auto;}


#dynamic-slider-form { margin-top:10px; margin-bottom:10px; }

#umkreis {width:100%; max-width:1050px; margin:0 auto; float:left;}
#mapa {
    /*border: 1px solid #eeeef0;*/
	width:71%;
	max-width:740px;
	height:480px;
	float:left;
}

#map {
    /*border: 1px solid #eeeef0;*/
	width:100%;
	height:490px;
	/*margin-top:-111px;*/
	display:block;
}

#map2 {
	/*border: 1px solid #eeeef0;*/
	width:100%;
	height:520px;
	float:left;
	/*margin-top:-111px;*/
	display:block;
	/*width: -webkit-calc(100% - 310px);
    width:    -moz-calc(100% - 310px);
    width:         calc(100% - 310px);*/
}

#leftmap { 
    float:left; 	
    width: -webkit-calc(100% - 310px);
    width:    -moz-calc(100% - 310px);
    width:         calc(100% - 310px);
}

#leftmap2 { width: 100%; }

#anzeige {font-size:9px; float:right; padding-right:10px; margin-bottom:7px;}
#tagprognose { font-size:16px; margin:0 auto; line-height:25px;}
#tagprognose2 { font-size:16px; margin:0 auto; line-height:25px; padding:2px 6px; background:#fba717; border-radius:5px; text-align:center; color:#ffffff; text-decoration:none; cursor:pointer;}
#tagprognose2 a { color:#ffffff; text-decoration:none;}


#wetterrecht {float:right; width:27%; max-width:300px; height:480px;  border-radius:5px; padding:0px;}
#wetterbox {float:right; width:290px; height:60px; background-color: rgba(255,255,255, 0.3); border-radius:5px;-moz-border-radius-topleft: 0px; -webkit-border-top-left-radius:0px;  padding:5px;}

#wettertopten {float:left; width:66%; max-width:600px; height:480px;  border-radius:5px; padding:0px; font-size:13px; font-weight:100;}
#wetterboxtopten {width:99%;  background-color: rgba(255,255,255, 0.3); border-radius:5px;-moz-border-radius-topleft: 0px; -webkit-border-top-left-radius:0px;  padding:5px; font-size:13px; font-weight:100;
-webkit-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);
-moz-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);
box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);}

#wetterboxtoptenaktuell {width:99%;  background-color: rgba(255,255,255, 0.3); border-radius:5px;-moz-border-radius-topleft: 0px; -webkit-border-top-left-radius:0px;  padding:5px; font-size:13px; font-weight:100;
-webkit-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);
-moz-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);
box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);}


#newsbox {width: -webkit-calc(100% - 20px); width: -moz-calc(100% - 20px); width: calc(100% - 20px);  font-size:13px; font-weight:100; margin-top:40px; margin-bottom:20px;  border-radius:5px; padding:10px;  -webkit-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);
-moz-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);
box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);
 background-color: rgba(255,255,255, 0.6);
 }

#newsbox2 {height: 680px; width: -webkit-calc(100% - 400px); width: -moz-calc(100% - 400px); width: calc(100% - 400px);  font-size:13px; font-weight:100; margin-top:30px; margin-bottom:5px;  border-radius:5px; padding:10px;  -webkit-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1); float: left;
-moz-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);
box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);
 background-color: rgba(255,255,255, 0.6);
 }

#newsbox3 {width: 340px; height: 680px; float: right;  font-size:13px; font-weight:100; margin-top:30px; margin-bottom:5px;  border-radius:5px; padding:10px;  -webkit-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);
-moz-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);
box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);
 background-color: rgba(255,255,255, 0.6);  overflow-y: scroll; overflow-x: hidden;
 }

#info {float:right; width:290px; height:180px; background-color: rgba(255,255,255, 0.6); border-radius:5px;  padding:5px; margin-top:10px;}
#werbebanner {float:right; width:300px; height:265px; visibility:visible; border-radius:5px;  padding:0px; margin-top:5px;}

#wetter-tabelle { width:100%; background-color: rgba(255,255,255, 0.3); border-radius:5px; margin-top:10px; overflow:hidden;}

#menu { position:relative; margin-left:80%; z-index:999999999; height:95px; }
#menu ul { list-style:none;   }
#menu ul li { /*display:inline; float:right;*/  }

#menu ul li:first-child { margin-bottom:8px; }

#menu ul li {  }

/* -moz-border-radius-topleft: 5px; -webkit-border-top-left-radius:5px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius:5px; */
#menu ul li:first-child a { border-radius:5px; width:120px; }

/* :last-child pseudo selector with rounded top right corner */
#menu ul li:last-child a { border-radius:5px;}

/* background color set to RGBA, with opacity on 0.3 and also using text-shadow */
#menu ul li a { padding:8px; background: rgba(243,156,18,0.4); text-decoration: none; letter-spacing:1px; color: #ffffff; font-size:13px; border-radius:5px;}
	
/* hover state shows a linear gradient and opacity it brought down to 0.9 and also shows a very slight grey gradient on top */
#menu ul li a:hover { background: -webkit-gradient(linear, right bottom, left top, color-stop(0, rgb(90,187,232)), color-stop(0.72, rgb(44,138,182))) !important;
	background: -moz-linear-gradient(right bottom, rgb(90,187,232) 0%, rgb(44,138,182) 72%) !important;
	background-color:rgb(90,187,232) !important;
	-moz-opacity:.90; filter:alpha(opacity=90); opacity:.90; color:#FFF; }

/* another RGBA background, now with an opacity of 0.8 */
#menu ul li a.active { background: rgba(243,156,18,0.9) !important;  }


#menu2 { margin-top:-1px; margin-left:-40px; margin-bottom:42px; }
#menu2 ul { list-style:none; }
#menu2 ul li { display:inline; float:left; margin-bottom:6px; }

/* :first-child pseudo selector with rounded top left corner */
#menu2 ul li:first-child a { -moz-border-radius-topleft: 5px; -webkit-border-top-left-radius:5px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius:5px;}

/* :last-child pseudo selector with rounded top right corner */
#menu2 ul li:last-child a {  -moz-border-radius-topleft: 5px; -webkit-border-top-left-radius:5px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius:5px; }

/* background color set to RGBA, with opacity on 0.3 and also using text-shadow */
#menu2 ul li a { padding:7px 10px;  text-decoration: none; letter-spacing:1px; font-size:13px; -moz-border-radius-topleft: 5px; -webkit-border-top-left-radius:5px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius:5px;}
	
/* hover state shows a linear gradient and opacity it brought down to 0.9 and also shows a very slight grey gradient on top */
#menu2 ul li a:hover { background: -webkit-gradient(linear, right bottom, left top, color-stop(0, rgb(90,187,232)), color-stop(0.72, rgb(44,138,182))) !important;
	background: -moz-linear-gradient(right bottom, rgb(90,187,232) 0%, rgb(44,138,182) 72%) !important;
	background-color:rgb(90,187,232) !important;
	-moz-opacity:.90; filter:alpha(opacity=90); opacity:.90; color:#FFF; }

/* another RGBA background, now with an opacity of 0.8 */
#menu2 ul li a.active { background: rgba(255,255,255,0.3) !important; }

/*#aktuelltopten { width:90%; line-height:30px; cursor:pointer; font-size:12px; margin-bottom:10px; background-color: rgba(255,255,255, 0.3); border-radius:5px; padding:0px; text-align:center;}
#prognosetopten { line-height:30px; cursor:pointer; font-size:12px; margin-bottom:5px; background-color: rgba(255,255,255, 0.3); border-radius:5px; padding:0px; text-align:center;}*/

#mausaktiv { position:relative; z-index:999999; width:40px; float:right; margin-top:-500px; padding-right:20px;}
#mausaktiv2 {position:absolute; width:40px; margin: 5px;z-index:999999;}

h3#webcamzeit { text-align: center; font-size: 12px; font-weight: 100;}

#aktuell { width:80px; line-height:30px; cursor:pointer; font-size:12px; margin-bottom:10px; background-color: rgba(255,255,255, 0.3); border-radius:5px; padding:0px; text-align:center;}
#prognose { line-height:30px; cursor:pointer; font-size:12px; margin-bottom:5px; background-color: rgba(255,255,255, 0.3); border-radius:5px; padding:0px; text-align:center;}

table.drei { width:100%; margin-top:10px;}
table.drei tr td.eins { font-size:18px; letter-spacing:1px; text-align:center; color:#174b63;}

table.drei tr td.tempen {
	font-weight:200;
	font-size:30px;
background-color: #102f3d;
  color: transparent;
  text-shadow: 0px 2px 3px rgba(90,187,232,0.6);
  -webkit-background-clip: text;
     -moz-background-clip: text;
          background-clip: text;
		  width:100px;
		  float:right;

}

table.drei tr td.wind2 { width:30px; float:right;}
table.drei tr td.wind2 img { width:30px;}
table.drei tr td.wind strong { font-size:12px;}
table.drei tr td.wind small { font-size:9px;}
table.drei tr td.wind { font-size:10px; letter-spacing:1px; text-align:center;}

table.drei tr td.boen2 { width:30px; float:right;}
table.drei tr td.boen2 img { width:30px;}
table.drei tr td.boen strong { font-size:12px;}
table.drei tr td.boen small { font-size:9px;}
table.drei tr td.boen { font-size:10px; letter-spacing:1px; text-align:center;}

table.drei tr td.prec strong { font-size:12px;}
table.drei tr td.prec small { font-size:9px;}
table.drei tr td.prec { font-size:10px; letter-spacing:1px; text-align:center; width:33%;}

.ueberschrift44 { font-size:10px; text-align:center; margin-top:25px; margin-bottom:20px;}

table.fuenf { width:100%; margin-top:15px; border-collapse: collapse;}
table.fuenf tr td.eins { font-size:18px; letter-spacing:1px; text-align:left; color:#174b63; padding-left: 10px;}

table.fuenf tr td.wasser { font-size:22px; letter-spacing:1px; text-align:center; color:#064a7c; padding-top: 10px; padding-bottom: 5px; }
table.fuenf tr td.luft { font-size:16px; letter-spacing:1px; text-align:center; color:#064a7c; border-bottom: 1px solid rgba(255,255,255,0.1); padding-bottom: 10px; }
table.fuenf tr td.wann { font-size:12px; letter-spacing:1px; text-align:center; color:#1d996f; border-bottom: 1px solid rgba(255,255,255,0.1); margin-bottom: 5px; background-color: rgba(127,255,212,0.4); }

table.fuenf tr td.prec { font-size:13px; letter-spacing:1px; text-align:center; color:#174b63; padding-top: 5px; padding-bottom: 8px;  /*background-color: rgba(127,255,212,0.2);*/ }

#info5 { text-align:center; font-size: 12px;}

table#tutili { width:100%; margin-top:15px; border-collapse: collapse;}
table#tutili tr td { font-size:15px; letter-spacing:1px; text-align:left; color:#174b63; width: 50%;padding-top: 7px; padding-bottom: 10px;}

table#tutili tr td.klein { font-size:12px; letter-spacing:1px; text-align:left; color:#174b63; width: 50%;padding-top: 7px; padding-left: 10px; padding-bottom: 10px;}
table#tutili tr td.klein2 { font-size:14px; letter-spacing:1px; text-align:left; color:#174b63; width: 70%;padding-top: 7px; padding-left: 10px; padding-bottom: 10px;}
table#tutili tr td.klein3 { font-size:14px; letter-spacing:1px; text-align:left; color:#174b63; width: 20%;padding-top: 7px; padding-left: 10px; padding-bottom: 10px;}





footer {
	padding: 10px 0;
	/*background: #eeeef0;*/
	position: relative;
	clear: both; 
}

footer { margin:20px auto; width:100%; max-width:800px; text-align:center; border-top:1px solid rgba(28,49,20, 0.3);}

footer a { text-decoration:none;}


header, section, footer, aside, nav, article, figure {
	display: block;
}

#tablestunde { width:100%;overflow-x:scroll; overflow-y:hidden; max-width:1030px; margin-top:10px; /*background-color: rgba(255,255,255, 1);*/ border-radius:5px;  border-right:10px; }

#tablestunde::-webkit-scrollbar {
    width: 5px;
	border-radius:5px;
}
 
#tablestunde::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,0.3);
}
 
#tablestunde::-webkit-scrollbar-thumb {
  background-color: #3c86a8;
  border-radius:5px;
}

h2#wetterheute { font-weight:100; font-size: 24px; padding-bottom: 10px; }

#sunrise {width: -webkit-calc(100% - 10px); width:    -moz-calc(100% - 10px); width:         calc(100% - 10px); border-radius: 5px; background-image: url(https://spanienwetter.es/bilder/sunback.jpg); background-size: cover; padding-top:10px; padding-left:5px; padding-right: 5px; margin-top: 12px;  padding-bottom: 10px;}

#sonnetablle { overflow:hidden;}

table.sonne { width:100%; font-size: 13px; margin-top: 10px; border-collapse: collapse; }
table.sonne tr.sonnen td { border-bottom: thin solid rgba(214,93,48, 0.4); padding-bottom: 8px;}
table.sonne td { width:10%; text-align: center; padding-bottom: 5px; padding-top: 5px; }
#sonneundprog {width: -webkit-calc(100% - 380px); width:    -moz-calc(100% - 380px); width:         calc(100% - 380px); float:left;}

#prognosestundenklein {width:100%;}
#littletablestunde { width:100%; overflow-x:scroll; overflow-y:hidden; max-width:1030px; margin-top:10px; background-color: rgba(255,255,255, 1); border-radius:5px;  border-right:10px solid #FFF; }

#littletablestunde::-webkit-scrollbar {
    width: 5px;
	border-radius:5px;
}
 
#littletablestunde::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,0.3);
}
 
#littletablestunde::-webkit-scrollbar-thumb {
  background-color: #3c86a8;
  border-radius:5px;
}


#prognosestunden { width: -webkit-calc(100% - 20px); width: -moz-calc(100% - 20px); width: calc(100% - 20px); padding:10px; overflow:hidden; max-width:1030px; margin-top:10px; background-color: rgba(255,255,255, 0.4); border-radius:5px; margin-bottom: 20px; }
#prognosestundenkleinm { width:98%; padding:10px; overflow:hidden; max-width:1030px; margin-top:10px; background-color: rgba(255,255,255, 1); border-radius:5px; margin-bottom: 20px; }
#tablestunde2 { width:100%; margin-top:10px; margin-bottom:16px;}

#prognosestunden2 { width:98%; overflow:hidden; margin-top:0px; }

#cvs {
width: 100%;
}

.progsuche { width:48%; text-align: center; float: left; padding-bottom: 20px;}

.pointerspanien { cursor:pointer; background-color:#28a2eb; padding:5px; border-radius:5px; margin-right:10px;}
.pointerbalearen { cursor:pointer; background-color:#28a2eb; padding:5px; border-radius:5px; margin-right:10px;}
.pointerkanaren { cursor:pointer; background-color:#28a2eb; padding:5px; border-radius:5px;}

table.stunde { border-collapse: collapse;}

table.stunde tr { border-right:10px;}

table.stunde tr td.klein { font-size:9px; text-align:left;}

table.stunde tr td { border-right:1px solid rgba(0,0,0, 0.1); text-align:center; padding:5px 5px; font-size:14px;}


table.stunde2 { border-collapse: collapse; margin:0 auto;}

table.stunde2 tr td.klein { font-size:9px; text-align:left;}

table.stunde2 tr td { border-right:1px solid rgba(0,0,0, 0.1); text-align:center; padding:5px 5px; font-size:14px;}

#wetterticker-rahmen { width:320px; margin-top:5px; margin-bottom: 10px; border-radius: 5px; border:1px solid rgba(4,132,145,0.4); padding: 5px; background-color: rgba(255,255,255, 0.5);}
#wettertickertextbox { width:200px; margin-left:40px; margin-top: -38px;}
#wettertickertextbox-zeit { font-size:9px;}
.wettertickertext { font-size: 13px; margin-top: 8px; margin-bottom: 10px; padding-top: 8px; border-top:1px solid rgba(4,132,145,0.2);}
img.wetterticker-bild { width:84%; margin: 0 auto;}

#ticker-rahmennews { width:98%; float:right; margin-top:5px; }

#tickertextboxnews { float:right; width:220px; height:60px; /*border-top:1px solid #f1f1f1;*/}

h2.ticker-newsnews { font-size:13px; font-weight:100; padding-left:4px; padding-right:2px;}

img.ticker-bildnews { width:60px; border-radius:5px; }



#ticker-rahmen-big { width:60%; float:left; max-width:600px;  }
#ticker-rahmen-big88 { width:100%; float:left; max-width:660px; margin-bottom: 20px;  }

#ticker-rahmen { width:37%; float:right; margin-top:-2px; }
#ticker-rahmen88 { width:49%; float:left; margin-top:-2px; margin-right: 2px; }

#ticker-rahmen-big a { text-decoration:none;  }
#ticker-rahmen a { text-decoration:none; }

img.ticker-bild-big  { width:100%; border-radius:5px; height:400px; overflow:hidden;  z-index: 9999999; }
img.ticker-bild { width:100px; border-radius:5px; float:left; }

h2.ticker-news-big { font-weight:100; font-size:18px; padding-left:4px; }
h2.ticker-news { font-weight:100; font-size:14px; padding:0px; margin-top:3px; line-height:20px; }

.ticker-news2-big { font-size:12px;padding-left:4px;}
.ticker-news2 { font-size:10px;}

#tickertextbox { float:right; width:67%; height:114px;}
#tickertextbox88 { float:right; height:114px; width: -webkit-calc(100% - 104px); width: -moz-calc(100% - 104px); width: calc(100% - 104px);}

#tickertextboxbig { background-color: rgba(255,255,255, 0.6); border-radius:5px; margin-top:-55px; position: relative; z-index: 999; height:50px; padding-top:2px;}


#ticker-rahmen-news { width:100%; float:left; max-width:700px; margin-top:10px; }
#ticker-rahmen-news a { text-decoration:none; }
img.ticker-bild-news  { width:100%; border-radius:5px; height:auto; overflow:hidden;  z-index: 9999999; }

.ticker-news-news { font-weight:100; font-size:20px; padding:0px; }
.ticker-news2-news { font-weight:100; font-size:12px; text-align:right; }

.ticker-news22 { margin-top:20px; font-size:14px; line-height:30px; font-weight:300;}

#webcam {
    border-radius: 5px;
	width:16%;
	padding:0 1%;
	height:120px;
	max-width:120px;
    overflow: hidden;
    position: relative;
	float:left;
	text-align:center;
	font-size:13px;
	line-height:20px;
	letter-spacing:2px;
}

#webcam img {
    width:100%; max-width:100px; border-radius: 5px; /*margin-top:-20px;*/ height:80px; overflow:hidden;
}

h2#cams { font-size:18px; padding: 0px 10px 5px 10px; font-weight:100;}

#cambox { padding:10px; background-color: rgba(255,255,255, 0.6); border-radius:5px; margin-top:20px; width: -webkit-calc(100% - 20px); width: -moz-calc(100% - 20px); width: calc(100% - 20px); }

#werbebanner900 { visibility:hidden; width:0px; height:0px; }

#werbebanner97 { visibility:visible; width:99%; margin:0 auto; }

#werbebanner970 {visibility:visible; width:auto; height:auto; margin-top: 30px; }
#werbebanner728 {visibility:hidden; width:0px; height:0px; }
#werbebanner468 {visibility:hidden; width:0px; height:0px; }
#werbebanner320 {visibility:hidden; width:0px; height:0px; }

#rundherumtable { width:100%; margin:5px auto;}

#ueberschriftwertestart { height:50px; margin-top:10px;}
#ueberschriftwertestart2 { height:50px; margin-top:10px;}
#ueberschriftwertestart3 { height:50px; margin-top:10px; }


#containerwetter { width:100%; max-width: 600px; height:100px; margin:0 auto; background-color: rgba(45,185,122,0.6); color:#FFFFFF; font-weight:100; border-radius: 5px; }
#containerwetter small { font-size:10px; }

#containerwetterklein { width:100%; max-width: 340px; height:100px; margin:0 auto; background-color: rgba(45,185,122,0.6); color:#FFFFFF; font-weight:100; border-radius: 5px; }


#schriftwetter { padding:2px; border-radius:5px; background-color:rgba(255,255,255, 0.4); width:300px; color:rgba(45,185,122,1); position:absolute; margin:5px; text-align:center;}
#updatewetter { padding:2px; border-radius:5px; background-color:rgba(255,255,255, 0.4); width:130px; color:rgba(45,185,122,1); margin-top:12px; margin-right:10px; text-align:center; float:right; font-size:12px;}

img#rain { margin-top:35px; width:35px;}
img#wind { margin-top:35px; width:28px; margin-bottom:4px;}
.kastenwetter {width:90px; font-size:19px; float:left;}
.kasten2wetter {width:90px; font-size:24px; padding-top:20px; padding-right:20px;float:right;}

#beachsuche { float: right; padding: 5px; color: #d1edd4; background-color: rgba(127, 255, 212, 0.4); border-radius: 5px;}
#beachsuche a { color: #d1edd4;}
#beachsuche img {vertical-align: text-bottom;}


#sidebar { width:300px; float: right; background: #BCBCBC;}

#infowetteraktuell {width:100%; height:auto; float:left;  border-radius:5px; margin-bottom: 20px;}

#kugeltemp { border-radius: 100%; text-align: center; background-color: #fff; width: 60px; height: 60px; line-height: 60px; margin: 0 auto;}
#kugelwind { border-radius: 100%; text-align: center; background-color: #fff; width: 60px; height: 60px; line-height: 15px; margin: 0 auto;}

table.vierzehn { width:100%; margin-top:10px; }
table.vierzehn tr td { font-size:12px; letter-spacing:1px; text-align:center; color:#174b63;}

table.drei tr td.tempen {
	font-weight:200;
	font-size:30px;


}


table#tutio { width: 250px; border-radius: 5px; background-color: #fff; float: left; padding: 10px; margin-right: 10px;}
.tutiodatum {  background-color:deepskyblue;padding: 3px; color:aliceblue; font-size: 11px; border-radius: 5px; }
table#tutio tr td.tempe { color:deepskyblue; font-size: 24px; text-align: center;}
table#tutio tr td.erk {  color:deepskyblue; font-size: 11px; text-align: center;}

#allin {overflow-x: scroll; overflow-y: hidden; width: 100%; margin-bottom: 20px;}


#menu3 { margin-top:10px; margin-left:-40px; margin-bottom:42px; }
#menu3 ul { list-style:none; }
#menu3 ul li { display:inline; float:left; margin-bottom:6px; }

/* :first-child pseudo selector with rounded top left corner */
#menu3 ul li:first-child a { -moz-border-radius-topleft: 5px; -webkit-border-top-left-radius:5px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius:5px;}

/* :last-child pseudo selector with rounded top right corner */
#menu3 ul li:last-child a {  -moz-border-radius-topleft: 5px; -webkit-border-top-left-radius:5px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius:5px; }

/* background color set to RGBA, with opacity on 0.3 and also using text-shadow */
#menu3 ul li a { padding:7px 10px;  text-decoration: none; letter-spacing:1px; font-size:13px; -moz-border-radius-topleft: 5px; -webkit-border-top-left-radius:5px; -moz-border-radius-topright: 5px; -webkit-border-top-right-radius:5px;}
	
/* hover state shows a linear gradient and opacity it brought down to 0.9 and also shows a very slight grey gradient on top */
#menu3 ul li a:hover { background-color: rgb(90,187,232) !important;
	color:#FFF; }

/* another RGBA background, now with an opacity of 0.8 */
#menu3 ul li a.active { background: rgba(255,255,255,0.4) !important; }

#menu3 ul li a.ging { background-color: rgb(90,187,232) !important;color:#FFF; }


#wetterboxstart { float: left; width: -webkit-calc(100% - 10px); width: -moz-calc(100% - 10px); width: calc(100% - 10px);  background-color: rgba(255,255,255, 0.4); border-radius:5px;-moz-border-radius-topleft: 0px; -webkit-border-top-left-radius:0px;  padding:5px; font-size:13px; font-weight:100;
-webkit-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);
-moz-box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1);
box-shadow: 0px 5px 5px 0px rgba(20,71,140,0.1); margin-bottom: 10px;
}

#kmhklein { font-size:10px; /*margin-top: -24px;*/}
#kmhklein2 { font-size:10px; line-height: 10px; margin-top: 6px; }
#kmhklein3 { font-size:10px; line-height: 10px; margin-top: 18px; }
#kmhklein4 { font-size:10px; line-height: 10px; margin-top: 10px; }


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

#div3x25_1 { width:300px; cursor:pointer; }
#div3x25_2 { width:300px; cursor:pointer; }
#div3x25_3 { width:300px; cursor:pointer; }

#divrundum2 { float:left; width: -webkit-calc(100% - 600px); width: -moz-calc(100% - 600px); width: calc(100% - 600px); }

#werbebanner970 {visibility:hidden; width:0px; height:0px; margin-top: 0px;}
#werbebanner728 {visibility:visible; width:auto; height:auto; }
#werbebanner468 {visibility:hidden; width:0px; height:0px; }
#werbebanner320 {visibility:hidden; width:0px; height:0px; }

#werbebanner970 img {visibility:hidden; width:0px; height:0px;}
#werbebanner728 img {visibility:visible; width:auto; height:auto; }
#werbebanner468 img {visibility:hidden; width:0px; height:0px; }
#werbebanner320 img {visibility:hidden; width:0px; height:0px; }




#divrundum2erdbeben  { width: 0px; visibility: hidden; }
#divrundum2erdbeben img  { width: 0px; height:0px; visibility: hidden; }
	

}




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

#div3x25_1 { width:290px; height:260px; cursor:pointer;}
#div3x25_2 { width:290px; height:259px; cursor:pointer;}
#div3x25_3 { width:290px; margin-top:0px; height:260px; cursor:pointer;}

#divrundum2 { float:left; width: -webkit-calc(100% - 580px); width: -moz-calc(100% - 580px); width: calc(100% - 580px); }


}


@media only screen and (max-width: 905px) {
#werbebanner900 { visibility:visible; width:300px; height:260px; }
#divrundum2 { float:left; width:310px; float:right; }
#rundherum { width:90%; margin:5px auto;}
#div3x25_1 { width:310px; height:270px;  cursor:pointer;}
#div3x25_2 { width:310px; height:269px; cursor:pointer;}
#div3x25_3 { width:310px; margin-top:20px; height:270px; cursor:pointer;}
#div3x25_4 { width:310px; margin-top:20px; visibility:visible; height:270px;}

#leftmap { width:100%; }

#werbebanner {float:none; visibility:hidden; width:0px; height:0px; border-radius:5px;  padding:0px; margin-top:0px;}
#werbebanner img {float:none; visibility:hidden; width:0px; height:0px; border-radius:5px;  padding:0px; margin-top:0px;}

#map2 { width:100%;height:450px;}


#ticker-rahmen-big { width:98%; max-width: 700px; margin-left:1%; margin-bottom:20px;}
#ticker-rahmen { width:48%; float:left;margin-left:1%;}

#div4x25_1 { width:360px; height:242px; float:left; background-color: rgba(255,255,255, 0.3); border-radius:5px; margin:0px;}
#div4x25_2 { width:360px; height:242px; float:right; background-color: rgba(255,255,255, 0.3); border-radius:5px; margin:0px;}

#newsbox2 {height: auto; width: -webkit-calc(100% - 20px); width: -moz-calc(100% - 20px); width: calc(100% - 20px);  }
#newsbox3 { margin: 0 auto; float: none;  }
	
}

@media only screen and (max-width: 806px) {
#div4x25_1 { width:350px; height:242px; float:left; background-color: rgba(255,255,255, 0.3); border-radius:5px; margin:0px;}
#div4x25_2 { width:350px; height:242px; float:right; background-color: rgba(255,255,255, 0.3); border-radius:5px; margin:0px;}

}

@media only screen and (max-width: 728px) {
#rundherum { width:100%; margin:0px auto;}
#werbebanner970 {visibility:hidden; width:0px; height:0px; }
#werbebanner728 {visibility:hidden; width:0px; height:0px; }
#werbebanner468 {visibility:visible; width:auto; height:auto; }
#werbebanner320 {visibility:hidden; width:0px; height:0px; }

#werbebanner970 img {visibility:hidden; width:0px; height:0px; }
#werbebanner728 img {visibility:hidden; width:0px; height:0px; }
#werbebanner468 img {visibility:visible; width:auto; height:auto; }
#werbebanner320 img {visibility:hidden; width:0px; height:0px; }

.container { width: 98%; }

#div4x25_1 { width:300px; height:242px; float:left; background-color: rgba(255,255,255, 0.3); border-radius:5px; margin:0px;}
#div4x25_2 { width:300px; height:242px; float:right; background-color: rgba(255,255,255, 0.3); border-radius:5px; margin:0px;}

#tickertextbox { float:right; width: -webkit-calc(100% - 110px); width: -moz-calc(100% - 110px); width: calc(100% - 110px);  height:114px;}
#rundherum { width:100%; margin:0px auto;}


	
}

@media only screen and (max-width: 660px) {
#divrundum2 { float:left; width:300px; float:right; }
#rundherum { width:100%; margin:0px auto;}
#div3x25_1 { width:300px; height:270px;  cursor:pointer;}
#div3x25_2 { width:300px; height:269px;}
#div3x25_3 { width:300px; margin-top:20px; height:270px;}
#div3x25_4 { width:300px; margin-top:20px; visibility:visible; height:270px;}
img.ticker-bild-big  { width:100%; border-radius:5px; height:auto; overflow:hidden;  z-index: 9999999; }

/*#newsbox {height:990px;}*/
}


@media only screen and (max-width: 630px) {
#divrundum2 { float:left; width:300px; float:right; }
#rundherum { width:320px; margin:5px auto;}
#div3x25_1 { float:right; height:260px; margin-bottom:10px; }
#div3x25_4 { float:right;}
#ticker-rahmen { width:98%; float:left;margin-left:1%;}
#tickertextboxbig { background-color: rgba(255,255,255, 0.0); border-radius:5px; margin-top:5px; position: relative; z-index: 999999999; height:auto; padding-top:2px;}
#tickertextbox { float:right; width: -webkit-calc(100% - 120px); width: -moz-calc(100% - 120px); width: calc(100% - 120px);  height:114px;}

#div4x25_1 { width:100%; height:242px; float:left; background-color: rgba(255,255,255, 0.3); border-radius:5px; margin:5px auto;}
#div4x25_2 { width:100%; height:242px; float:left; background-color: rgba(255,255,255, 0.3); border-radius:5px; margin:5px auto;}
iframe#suchen {margin-right: 0px; margin-left: 50%; margin-top: 4px; float:left;  }
.container { width: 96%; padding-left: 0px; }
#mapklein { float:left; width:100%; margin-top: 10px; }
	#sonneundprog { width:100%;}
	#littlemap {height:0px;}
img#flight {margin:5px auto; float:left; width:100%; max-width:400px; border-radius: 5px;}


/*#newsbox {height:900px;}*/
}


@media only screen and (max-width: 570px) {  
#containerwetter { width:100%; height:180px; margin:0 auto;  color:#FFFFFF; font-weight:100; }
.kastenwetter {width:30%; font-size:19px; float:left;}
.kasten2wetter {width:60px; font-size:30px;  padding-top:20px; padding-right:20px;float:left;margin-top:35px;}
#updatewetter { clear:both;  padding:10px 0 10px 0; border-radius:5px; background-color:rgba(255,255,255, 0.4); width:100%; color:rgba(45,185,122,1);  text-align:center; float:none; font-size:13px;}

#headerlogo {width:40px; height:20px;  float:right; margin-top:-44px; font-size: 11px; }

}

@media only screen and (max-width: 500px) {
#map2 { width:100%;height:220px;}
#leftmap { width:97%; }

#bild-cam2 img {  margin-top: 0px;}
#bild-cam3 img {  margin-top: -5px;}
}

@media only screen and (max-width: 470px) {
#werbebanner970 {visibility:hidden; width:0px; height:0px; }
#werbebanner728 {visibility:hidden; width:0px; height:0px; }
#werbebanner468 {visibility:hidden; width:0px; height:0px; }
#werbebanner320 {visibility:visible; width:auto; height:auto; }

#werbebanner970 img {visibility:hidden; width:0px; height:0px; }
#werbebanner728 img {visibility:hidden; width:0px; height:0px; }
#werbebanner468 img {visibility:hidden; width:0px; height:0px; }
#werbebanner320 img {visibility:visible; width:auto; height:auto; }

#webcam {
    border-radius: 5px;
	width:30%;
	padding:0 1%;
	height:120px;
	max-width:120px;
    overflow: hidden;
    position: relative;
	float:left;
	text-align:center;
	font-size:11px;
	line-height:20px;
	letter-spacing:2px;
}

#webcam img { width:100%; max-width:100px; border-radius: 5px; /*margin-top:-20px;*/ height:80px; overflow:hidden; }
h2#webcam_ueberschrift { font-size:15px; }
h3#webcamzeit { font-size: 10px;}

#schriftwetter {  width:300px; color:rgba(45,185,122,1); font-size: 12px;}
	.kastenwetter 	{font-size: 12px;}
	.kasten2wetter {font-size: 18px; width: 60px; padding-right: 0px; padding-top: 0px;}
	
#updatewetter { clear:both;  padding:1px 0 1px 0; border-radius:5px; background-color:rgba(255,255,255, 0.4); width:100%; color:rgba(45,185,122,1);  text-align:center; float:none; font-size:13px;}

	
#div3x25_1 { float:left; width: 96%; margin: 5px 2%;}
#div3x25_2 { float:left; width: 100%; margin: 0;}
#div3x25_3 { float:left; width: 96%; margin: 5px 2%;}
#div3x25_4 { float:left; width: 96%; margin: 5px 2%;}
#divrundum2 { float:left; width: 96%; margin: 5px 2%; }
	
#ticker-rahmennews { width:98%; float:right; margin-top:0px auto; }
	
}