@media only screen and (max-width: 1024px) {
    body {
        width: 100%;
         -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
    }
    #page {padding: 0px 15px 15px 15px;}
    header {width: 100%;}
    .mitte, article {width: 100%;}
    footer {width: 100%;}
    .footer2 {width: 100%;}
    
    .logo {width: 40%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
    .sprache {width: 20%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
    .warenkorb {width: 35%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
    aside {width: 22.5%;}
    .content {width: 55%;}
    .rechts {width: 22.5%;}
    nav ul {width: 78%;}
    nav ul a li {padding: 0px 10px;}
    .suchmaske {margin-left: 10px; width: 10%;}
    .suchmaske input[type="text"] {width: 100%;}
    .layer {width: 400px; margin: 17px 0px 0px -220px;}
    .banner_head {display: none;}
    
}
@media only screen and (max-width: 900px) {
    nav ul a li {padding: 0px 1%;}
    .layer {width: 400px; margin: 17px 0px 0px -280px;}
}
@media only screen and (max-width: 800px) {
    aside {width: 31.25%;}
    .content {width: 68.75%;}
    .rechts {display: none;}
}
@media only screen and (max-width: 768px) {}


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

    
    .sprache {width: 13%; display: none;} 
    .warenkorb {padding: 15px 0px 0px 0px;}
    nav {padding: 0px 15px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
    .suchmaske {margin-left: 10px; width: 40%;}
    .navigation {display: none;}
    .mobile_nav {display: block; width: 50px; float: left; line-height: 12px; border-right: 1px solid #dab89d; padding: 10px 0px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
    .loginbtn {border-left: 1px solid #dab89d; margin: 0px 0px 0px 0px; padding: 10px 0px 0px 10px; line-height: 40px;}
    .mobile_nav1 
    {
        position: absolute; 
        z-index: 1001; 
        width: 85%; 
        height: 200px;
        background-color: #c19b7a;
        border-bottom: 1px solid #000;
        border-right: 1px solid #000;
        border-left: 1px solid #000;
        border-top: 0px solid #000;
        margin: 50px 0px 0px 0px;
        padding: 10px 10px;
        color: #c7cacd;
        overflow: auto;
        text-shadow: 1px 1px #000000;
        -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; 
        
    }
    .mobile_nav1 a {color: #c7cacd;}
    .mobile_nav1 input[type=text], .mobile_nav1 input[type=password] {width: 100%; margin-bottom: 10px;}
    .mobile_nav1 h4 {width: 100%; font-size: 18px; margin-top: 25px;}

    .mobile_nav1 ul {margin: 0px; padding: 0px; float: none;}
    .mobile_nav1 ul li {margin: 0px; padding: 4px 0px 12px 0px; list-style: none; line-height: 14px; margin-bottom: 10px; border-bottom: 1px solid #a2a2a2;}
    .mobile_nav1 ul li a {font-size: 15px; text-decoration: none; color: #fff; font-weight: normal;}
    
    #mobile_nav { display: none; }
    
    nav ul {padding: 0px; margin: 0px; float: left; width: 100%;}
    nav ul a li {float: none; width: 100%; display: block; line-height: 50px; text-decoration: none; border-right: 0px solid #dab89d;}
    nav ul a li:hover {background: none;}
    nav ul a:hover {text-decoration: none;}
    .active {background: none;}
    
    .form_links {float: left; width: 100%; margin-right: 0%;}
    .form_rechts {float: left; width: 100%;}  
    
    .layer {width: 400px; margin: 17px 0px 0px 0px;}
    table {overflow: auto;} 
}
@media only screen and (max-width: 640px) {
    aside {width: 100%; padding: 0px;}
    .content {width: 100%;}
    .rechts {width: 100%; padding: 0px;}
    .container {display: none;}
    .footer_links {width: 90%; margin-bottom: 10px; margin-right: 0px;}
    .footer_rechts {width: 90%;}
    .aufklappung {display: block; float: right; margin-right: 10px;}
    #shopmenu, #faq, .ansicht_img {display: none;}
}
@media only screen and (max-width: 480px) {
    header {height: auto; margin-bottom: 15px;}
    .logo {width: 100%; text-align: center; margin: 10px 0px; height: auto;}
    .warenkorb {width: 100%; border: 0px solid; padding: 15px 0px 0px 0px; height: auto;}
    .bg_wk {width: 160px; height: 40px; margin: 0px auto 15px auto;}
    .content_links {width: 100%; margin-bottom: 20px;}
    .content_rechts {width: 100%;}
    .artikel_list .artikel_img {float: none; width: 100%;-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; height: auto;}
    .artikel_list .artikel_beschreibung {float: none; width: 100%; margin: 10px 0px; padding: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
    .artikel_list .artikel_rechts {float: none; width: 100%; text-align: center;  padding: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
    .artikel_list .price_box {
         background-color: #fff;
         -webkit-box-shadow: none;
         -moz-box-shadow: none;
         box-shadow: none;
         color: #f18696;
         border-left: 0px solid #f18696;
         border-bottom: 0px solid #f18696;
         font-size: 18px;
    }
    input[type=submit], input[type=button], input[type=reset], #login input[type=submit], button {width: 100%; line-height: 30px; margin-bottom: 10px;}
    .layer {width: 355px; margin: 17px 0px 0px -50px;}
    .suchform_beschreibung {float: left; width: 200px; margin-right: 10px; margin-top: 3px;}
    .artikel_detail_bild_gross {width: 100%;}
    .artikel_detail_bild_gross img {width: 100%;}
    .artikel_detail_links {display: none;}
    .artikel_detail_rechts {width: 100%; border: 0px solid #f18696;}
    .artikel_detail_rechts form {text-align: center;}
    input[name="menge"] {margin-bottom: 15px;}
    .artikel_detail_rechts .price_box {text-align: center;}
    .futterempfehlung {width: 50%;}
    .futterempfehlung img {height: auto;}
}
@media only screen and (max-width: 360px) {
    .layer {width: 290px; margin: 17px 0px 0px -50px;}
    .suchform_beschreibung {float: left; width: 200px; margin-right: 10px; margin-top: 3px;}
    .versandkosten_links {
        border-right: 0px solid #f18696; 
        border-bottom: 1px solid #f18696; 
        padding: 0px 10px 10px 10px; 
        margin-right: 0%;
        width: 100%; 
    }
    .versandkosten_rechts {width: 100%; padding: 10px 10px 0px 10px; border-bottom: 1px solid #f18696;}
} 
}
@media only screen and (max-width: 320px) {
    .layer {width: auto; margin: 17px 0px 0px 0px;}
    .suchform_beschreibung {float: left; width: 100px; margin-right: 10px; margin-top: 3px;}
}