/* CSS Document */
#wrapper{ width:auto; margin:auto;clear:both; }
#logoleft {float:left;padding-top:10px;padding-left:50px;}
#menu-main {top:62px;}
#suchen {float:right;margin-right:10px;margin-top:14px;}
#lupe {float:right;margin-right:10%;margin-top:20px;}
#benutzer {float:right;padding-top:14px;padding-right:50px;}
#greybackground {clear:both;border-radius:10px;background-color:#b5c4cb;padding-left:20px;padding-top:20px;max-width:1080px;}
#logintodo {width:360px;margin-left:auto;margin-right:auto;margin-top:180px;}
#inhalt {margin-top:90px;margin-left:50px;margin-right:50px;}
header {background-color:#455A64;position:absolute;left:0px;top:0px;height:60px;z-index:8;width:100%;}

.menubuttonpos {position:absolute;right:50px;top:85px;z-index:15;}
.menupos {position:absolute;right:50px;top:145px;z-index:15;width:225px;}
#list-container {
	background-color:#ffffff;
    border-radius:5px;
	padding:7px;	
	border:1px solid #d6d5ca;
}
#list-container:hover {
   box-shadow: 0 5px 10px rgb(0 0 0 / 30%);
    transition: all .5s;
    transform: scale(01.0);
}
#list-simple-container {
	background-color:#ffffff;
    border-radius:5px;
	padding:7px;	
	border:1px solid #d6d5ca;
}

@media only screen and ( min-width:880px ) and ( max-width:1240px ) {
	#menu-main {top:62px;}
	#suchen {display:none;}
	#lupe {display:none;}
    #greybackground {max-width:720px;}
}

@media only screen and ( max-width:880px ) {
	#menu-main {display:none;}
	#benutzer {display:none;}
	#suchen {display:none;}
	#lupe {display:none;}
    #greybackground {max-width:360px;}
    #logintodo {width:280px;margin-top:100px;}
	#logoleft {padding-left:20px;}
    #inhalt {margin-top:90px;margin-left:0px;margin-right:20px;}
    .menubuttonpos {position:absolute;left:330px;top:85px;z-index:15;}
    .menupos {position:absolute;right:10px;top:145px;z-index:15;width:225px;}
	header {width:390px;}
}