/*
Theme Name:  Sebastian Michel
Theme URI: http://sebastian-michel.eu
Description: Sebastian Michel, WetterWarn WebApp
Author: Sebastian Michel
Author URI: http://www.sebastian-michel.eu/
Version: 1.0
*/

/* source-sans-pro-200 - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 200;
  src: local(''),
       url('/css/fonts/source-sans-pro-v21-latin-200.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/css/fonts/source-sans-pro-v21-latin-200.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-200italic - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 200;
  src: local(''),
       url('/css/fonts/source-sans-pro-v21-latin-200italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/css/fonts/source-sans-pro-v21-latin-200italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-300 - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 300;
  src: local(''),
       url('/css/fonts/source-sans-pro-v21-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/css/fonts/source-sans-pro-v21-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-300italic - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 300;
  src: local(''),
       url('/css/fonts/source-sans-pro-v21-latin-300italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/css/fonts/source-sans-pro-v21-latin-300italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-regular - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('/css/fonts/source-sans-pro-v21-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/css/fonts/source-sans-pro-v21-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-600 - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 600;
  src: local(''),
       url('/css/fonts/source-sans-pro-v21-latin-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/css/fonts/source-sans-pro-v21-latin-600.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-600italic - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 600;
  src: local(''),
       url('/css/fonts/source-sans-pro-v21-latin-600italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/css/fonts/source-sans-pro-v21-latin-600italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-700 - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 700;
  src: local(''),
       url('/css/fonts/source-sans-pro-v21-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/css/fonts/source-sans-pro-v21-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-700italic - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 700;
  src: local(''),
       url('/css/fonts/source-sans-pro-v21-latin-700italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/css/fonts/source-sans-pro-v21-latin-700italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-900 - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 900;
  src: local(''),
       url('/css/fonts/source-sans-pro-v21-latin-900.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/css/fonts/source-sans-pro-v21-latin-900.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* source-sans-pro-900italic - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 900;
  src: local(''),
       url('/css/fonts/source-sans-pro-v21-latin-900italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/css/fonts/source-sans-pro-v21-latin-900italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}


html {-webkit-text-size-adjust: none;height:100%;}
img {border: 0 none;}
body {height: 100%;font-family: 'Source Sans Pro', sans-serif;font-size: 1em;font-weight: 400;color: #000;background-repeat: no-repeat;background-image: url(/img/wetter1.jpg);background-size: cover;background-position: center;}
.clearfix {clear:both;}
#bg {background: #fff;}


#header {padding: 17px 10px 10px;background: #fff;min-width: 260px;max-width: 1024px;margin: 0 auto;}
#header h1 {font-size: 1.5em;font-weight: 800;}
#header h2 {font-size: 1em;font-weight: 400;}
#headlogo{float: left;}
#headtext {float: left;padding-top: 10px;padding-left:10px;}
#main {height: 96%;min-height:96%;display: table;width: 100%;}
#content  {margin-bottom: 25px;width: 100%;height: 100%;min-height:100%;display: table-row;}
#content-unterseite  {background: #fff;margin-bottom: 25px;height: 100%;}
#content-unterseite img {height: auto; width: 100%;}
#contenthead {color: #fff;padding: 10px;background: #2b7483;font-size: 1.3em;font-weight: 300;}
#contenthead a {color: #fff;padding-right:20px;}
#content .text-inhalt {font-weight:300;min-width: 260px;max-width: 1024px;margin: 0 auto;padding: 20px;font-size: 1.1em;line-height: 29px;}
#content-unterseite .text-inhalt {font-weight:300;min-width: 260px;max-width: 1024px;margin: 0 auto;padding: 10px;font-size: 1.1em;line-height: 29px;}
#content .mitte {min-width: 260px;max-width: 1024px;margin: 0 auto;padding-left:10px;padding-right:10px;}
#footer .mitte {min-width: 260px;max-width: 1024px;margin: 0 auto;padding-left:10px;padding-right:10px;}
#bg {background:#fff;}

h3 {font-weight:300;}

/*Startseite*/
.startseite-button {min-width: 260px;max-width: 1024px;margin: 0 auto;height: 100%;}
.startseite-button a {display: block;}
.startseite-button li {background: #fff;margin: 10px;font-size: 1.3em; font-weight: 300;text-align: center;padding-bottom: 15px;padding-top: 15px;padding-left:5px;padding-right:5px;box-shadow: 0px 3px 3px rgba(0,0,0,0.2);-moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);-webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);}
#content  .startseite-button li img {height: auto;width: 30%;}


/*App Unterseiten*/
#content-unterseite .dwd-info {text-align: center;padding: 10px;}
#content-unterseite .dwd-info img {height: auto; width: 40%;text-align: center;}
#content-unterseite .zubutton {height: 32px;width: 32px;float: left;top: -8px;position: relative;margin-right: 10px;}
#content-unterseite .zubutton a {background: url(/img/zubutton.png);display: block;height: 32px;width: 32px;background-position: 66px 35px;}
#content .zubutton {height: 32px;width: 32px;float: left;top: -8px;position: relative;margin-right: 10px;}
#content .zubutton a {background: url(/img/zubutton.png);display: block;height: 32px;width: 32px;background-position:66px 35px;}
#wetterberichte {margin-top: 10px;}
#wetterberichte li {margin-bottom: 20px;text-align: center;font-weight: 300;font-size: 1.3em;}
#wetterberichte-2 {margin-top: 10px;}
#wetterberichte-2 li {margin-bottom: 20px;text-align: left;font-weight: 300;font-size: 1.1em;}
#diagramme p img {height: auto; width: 100%;}
#werte img {height: auto; width: 45%;}
#footer {padding: 10px;background: #2b7483;color: #fff;font-size: 1.3em;font-weight: 300;}
    
/*Menu*/
#topmenu-2 {position: absolute;top:0;left:0;width: 100%;}
#menu-mobi-800 {background: #cfcfcf; }
#menu-mobi-800 li a {display: block;padding-bottom: 8px;padding-left: 10px;padding-top: 8px;}
#menu-mobi-800 .menu-mobi-button {padding:10px;background: #e3e3e3 none repeat scroll 0 0;
font-size: 1.4em;
    font-weight: 300;
    color:#60701f;
}
#menu-mobi-800 .menu-mobi-button a {display: block;}
#menu-mobi-800 .menu-mobi-hide {padding:10px;background: #ccc none repeat scroll 0 0;width: 100%;}
#menu-mobi-800 .menu-mobi-panel {
    background: #d9d9d9 none repeat scroll 0 0;
    display: none;
    font-size: 1.4em;
    font-weight: 300;
    position: absolute;
    top: 38px;
    width: 100%;
}

.underbox-info-app-down img {height:auto;width:31.111%;border-radius: 8px;margin: 10px;}
.underboxhead {font-size:1.5em;}

/*displaynone*/
.none {display:none;}
.block {display:block;}
    
/*Hover*/
a:active {color: #2b7483;text-decoration: none;}
a:link {color: #2b7483; text-decoration: none;}
a:focus {color: #2b7483; text-decoration: none;}
a:visited {color: #2b7483; text-decoration: none;}
a:hover {color: #1f1f1f; text-decoration: none;}

/*Responsive Webdesign */
@media screen and (max-width: 1024px){}
@media screen and (max-width: 768px) {
#headtext {float: left;padding-left: 2px;padding-top: 10px;}
#footer .mitte {line-height: 24px;text-align: center;}
.underbox-info-app-down img {margin: 0px;margin-bottom:10px;}
}
@media screen and (max-width: 480px) {
#header h2 {font-size: 0.9em;font-weight: 400;}
#contenthead a {display:block;color: #fff;padding-right:20px;padding-bottom:10px;padding-top:10px;border-bottom:1px solid #fff;}
#content .mitte {padding-bottom:17px;}
.underboxhead {font-size: 1.1em;font-weight:400;}
.underbox-info-app-down img {height:auto;width:100%;}
}
@media screen and (max-width: 320px) {
#header h2 {font-size: 0.8em;font-weight: 400;}
.underbox-info-app-down img {height:auto;width:100%;}
}
@media screen and (max-width: 240px) {
#header h2 {font-size: 0.8em;font-weight: 400;}
#header h1 {font-size: 1.2em;font-weight: 800;}
#headtext {float: left;padding-left: 3px;}
}