@import url('https://fonts.googleapis.com/css?family=Ubuntu');

html,body{font-family:Ubuntu,arial;padding:0px;margin:0px;background-color:#fff;color:#fff;}
#oben{font-size:30px;position:fixed;top:0px;padding:5px;background-color:#883D00;color:#fff;width:calc(100% - 225px);max-width:600px;box-shadow:0px 3px 5px #888888;z-index:500;}
/* #oben .fa-ellipsis-v{float:right;margin-right:10px;padding:0 10 0 10;} */
#title{user-select:none;font-size:20px;float:left;color:#fff;line-height:30px;padding-right:5px;margin:0px;border:0px solid black;height:30px;width:calc(100% - 90px);overflow:hidden;}
#lupe{font-size:25px;float:right;margin-right:10px;margin-top:3px;cursor:pointer;}
#navibutton{cursor:pointer;padding-right:10px;display:none;float:left;}
#suchfeld{font-size:15px;padding:3px;color:#444;border:3px solid #444;width:calc(100% - 50px);outline:0px;border-radius:5px;}
#backbutton{padding:0px;padding-right:15px;color:#fff;float:left;}

.zett{font-weight:bold;text-decoration-color:#000000;text-decoration:underline overline;font-family:arial;display:inline-block;letter-spacing:1px;line-height:20px;font-size:20px;color:#000;}

.beitrag,.beitrag_details{font-size:15px;color:#444;padding:4px;border-bottom:1px solid #CD9464;word-wrap:break-word;margin-bottom:5px;margin-top:5px;}
.beitrag{user-select:none;cursor:pointer;}
.beitrag a,.beitrag_details a{font-weight:bold;}
.beitrag:nth-of-type(even),.beitrag_details{background-color: #dddddd;}
.beitrag:nth-of-type(odd){background-color: #eeeeee;}
.beitrag:hover{background-color:#CD9464;color:#fff;}
.beitrag_legende{padding-top:10px;}
.beitrag_legende,.beitrag_legende a{font-size:12px;color:#777;}

/*.channel{user-select:none;display:block;font-size:15px;color:#444;cursor:pointer;padding:10px;border:1px solid #CD9464;word-wrap:break-word;border-radius:5px;width:94%;margin-bottom:2px;margin-top:2px;}*/
.channel{user-select:none;display:block;font-size:15px;color:#444;cursor:pointer;padding:10px;border-bottom:1px solid #CD9464;border-top:1px solid #CD9464;word-wrap:break-word;margin-bottom:5px;margin-top:5px;}

.channel a{font-weight:bold;}
.channel:nth-of-type(even){background-color: #eeeeee;}
.channel:nth-of-type(odd){background-color: #dddddd;}
.channel:hover{background-color:#CD9464;color:#fff;}
.channel_details{border:3px solid #CD9464;padding:3px;margin-bottom:20px;}
.channel_details h1{margin-top:0px;}

.comment{background-color: #eeeeee;user-select:none;display:block;font-size:13px;color:#444;padding:3px;border-bottom:1px solid #CD9464;word-wrap:break-word;margin-bottom:2px;margin-top:2px;}
.comment a{font-weight:bold;}
.comment_legende{padding-top:20px;font-size:10px;margin-bottom:0px;color:#777;}

.updown{display:inline-block;margin:0 4 0 4;text-align:center;;min-width:15px}

#channel_plus{cursor:pointer;font-size:30px;position:fixed;right:20px;bottom:10px;border-radius:50%;color:#fff;padding:10px;background-color:#883D00;box-shadow: 3px 3px 5px #888888;}

a.melden{color:#fff;float:right;background-color:#883D00;border-radius:5px;padding:5px;margin:5px;height:18px;}
a{color:#444;text-decoration:none;}

h1{font-size:20px;line-height:20px;}
h2{font-size:18px;line-height:18px;}

.l{float:left;}
.r{float:right;}
.c{clear:both;}

hr{background-color:#fff;padding:2px;border:0px;}

#navi::-webkit-scrollbar {
    width: 0px;  /* remove scrollbar space */
    background: transparent;  /* optional: just make scrollbar invisible */
}

#verdunklung{display:none;position:fixed;top:0px;left:0px;height:100%;z-index:900;width:100%;background-color:#000000;opacity:0.5;}
#navi{user-select:none;color:#fff;padding:10px;height:100%;overflow-y:scroll;scrollbars:none;position:fixed;top:0px;width:200px;z-index:901;background-color:#883D00;border-right:2px solid #333333;box-shadow: 3px 3px 5px #888888;}
#navi a,#navi_r a{color:#fff;padding:5px;text-decoration:none;font-weight:bold;width:95%;display:block;border-radius:3px;}
#navi a:hover,#navi_r a:hover{background-color:#cccccc;}
#navi i{width:18px;text-align:center;}
#navi input[type=search]{width:150px;margin:0px;}

/*.bbild{width:100%;max-width:600px;padding-bottom:10px;}*/

.bbild img,.bbildK img{width:100%;}
.bbild,.bbildK{width:100%;max-width:600px;}
.bbildK{height:200px;overflow:hidden;background-size:cover;background-position:50% 50%;}

/* Navi Animation */
#navi.open
{
  left:0px;
  opacity:1;
  transition:200ms ease-in-out;
  -webkit-transition:200ms ease-in-out;
  -moz-transition:200ms ease-in-out;
  -o-transition:200ms ease-in-out;
}
#navi.close
{
  left:0px;
  opacity:1;
  transition:200ms ease-in-out;
  -webkit-transition:200ms ease-in-out;
  -moz-transition:200ms ease-in-out;
  -o-transition:200ms ease-in-out;
}

#navi_r{position:fixed;top:35px;right:0px;background-color:#883D00;padding:5px;z-index:510;}

a.button,input[type=submit],input[type=button],a.folder{font-size:16px;font-weight:bold;border:2px solid #333333;font-weight:bold;border-radius:5px;padding:5px;margin:5px;margin-left:0px;background-color:#CD9464;box-shadow: 3px 3px 5px #888888;cursor:pointer;user-select:none;text-decoration:none;color:#fff;}
a.button i{width:20px;text-align:center;}
.folder{font-size:15px;padding:5px;margin-bottom:10px;line-height:40px;}

#unten{position:fixed;bottom:0px;padding:1px;background-color:#883D00;width:calc(100% - 225px);max-width:600px;color:#fff;box-shadow:0px -3px 5px #888888;}
form{margin:0px;display:inline;}

input[type=text],input[type=password]{width:300px;border:1px solid #444;font size:15px;border-radius:3px;padding:3px;}

/*#unten input,#unten input:focus,#unten textarea,#unten textarea:focus{font-family:Ubuntu,arial;-webkit-appearance:none;outline:0px;border-radius:3px;font-size:15px;scollbars:no;resize:none;margin:4px;padding:4px;border:3px solid #CD9464;width:calc( 100% - 100px );height:24px;float:left;}*/
#schreibfeld{-webkit-appearance:none;outline:0px;font-family: 'FontAwesome', 'Ubuntu', 'Arial';float:left;display:inline-block;margin:2px;font-size:15px;padding:3px;background-color:#fff;color:#444;border:3px solid #fff;width:calc(100% - 60px);min-height:18px;max-height:110px;border-radius:5px;overflow-y:scroll;}
.button_unten{font-size:19px;background-color:#fff;color:#000;border:1px solid #fff;padding:4 5 4 5;border-radius:3px;font-weight:bold;float:left;margin:2px;width:20px;height:20px;}

#smilies{height:100px;overflow-y:scroll;background-color:#883D00;}
#content{padding:3px;margin-top:50px;padding-bottom:30px;color:#444;}
#content h2{color:#444;}

#cookie{display:none;}

#alles{padding-left:225px;max-width:600px;}

/* Malert (Popup) */
#malert_aussen{display:none;position:fixed;top:0px;left:0px;height:100%;z-index:999;width:100%;background-color:#000000;opacity:0.5;}
/*#malert_innen{display:none;color:#444;position:fixed;top:20%;left:20%;z-index:1000;padding:25px;background-color:#FAFAFA;border-radius:5px;box-shadow: 3px 3px 5px #000000;max-height:80%;overflow-y:scroll;}*/
#malert_innen{left: 50%;transform: translateX(-50%);display:none;color:#444;position:fixed;top:50px;width:500px;z-index:1000;padding:15px;background-color:#FAFAFA;border-radius:5px;box-shadow: 3px 3px 5px #000000;max-height:80%;overflow-y:scroll;}
#malert_x{float:right;cursor:pointer;font-size:30px;margin-right:-10px;margin-top:-12px;}
#malert_inhalt{height:100%;display:block;overflow:auto;color:#444;}
#malert_innen {
    -ms-overflow-style: none;  // IE 10+
    overflow: -moz-scrollbars-none;  // Firefox
}
#malert_innen::-webkit-scrollbar {
    display: none;  // Safari and Chrome
}

@media(max-width: 900px)
{
html{zoom: 120%;}
  input[type=text],input[type=password]{width:90%;}
  #malert_innen{width:80%;}
  #alles{padding-left:0px;}
  #oben{width:100%;}
  #suchfeld{width:calc(100% - 90px);}

  #unten{width:100%;}
  #navi.close{left:-250px;  opacity:0;}
  #navibutton{display:block;}
}