/*******************************************/
/*                                GRID                        */
/*                                                                    */
/*******************************************/

/** Resetter
/*********************************************************/
 *{ margin: 0px; padding: 0px; }

*:before, *:after {
    box-sizing: border-box;
        }
* {
    box-sizing: border-box;  }

 /* Base Grid */

.wrapper, .commerce-checkout-flow, .path-user main, .cart-empty-page, .path-adressbuch main, .instagram-feed, .paragraph-id--7 {
    position: relative;
    margin: 0px auto;
    width: calc(100% - 200px);
max-width: 1620px;
 }
 .block-webform-block.popup .wrapper{ margin: 0px; width: 100%; }
.footer .wrapper{ text-align: center!important; }

 .column{
   position: relative;
   float: left;
 }

  /** Mobile Groessen
 ************************************************/

  /* Einer */
  .one{ width: 100%; }

  /* Zweier */
 .one-two{ width: 50%; }

  /* Dreier */
 .one-three{ width: 33.33%;  }
 .two-three { width: 66.66%; }

 /* Vierer */
.one-four { width: 25%; }

/* Fuenfer */
.one-five { width: 20%; }

.one-six { width: 14%; }


/* Achter */
.one-eight { width: 12.5%; }

/* 30:70 */
.one-thirds{ width: 32%; margin-right: 4%; }
.two-thirds{ width: 64%; }

/* 40:60*/
.one-fourth{ width: 40%; }
.two-fourth{ width: 60%; }


/* #Tablet (Portrait)
================================================== */


    @media only screen and (min-width: 1025px) and (max-width: 1200px) {

            .one-four { width: 33.3334%; }
             .one-six { width: 16%; }

         }

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

                    .one-three.column { width: calc(50% - 20px); }

         }

    @media only screen and (min-width: 769px) and (max-width: 1024px) {


        .one-four { width: 50%; }
        .one-two, .one-three { width: 100%; padding-right: 0px; padding-left: 0px; }



        .popup { width: 90%; }

        /* Filter */


        .one-six { width: 16%; }

    }

/* Zwischengröße
===================================================*/


/* #Mobile (Landscape)
================================================== */

  @media only screen and (min-width: 0px) and (max-width: 1444px) {
  .wrapper, .commerce-checkout-flow, .path-user main, .cart-empty-page, .path-adressbuch main, .instagram-feed {  width: calc(100% - 160px); max-width: none; margin: 0px 80px; }
  }

  @media only screen and (min-width: 0px) and (max-width: 1024px) {
    .wrapper.product-content-wrapper, .wrapper {
width: calc(100% - 120px);
max-width: none;
margin: 0px 60px 0px 60px;
}
  }

    @media only screen and (min-width: 0px) and (max-width: 800px) {
        .wrapper, .commerce-checkout-flow, .path-user main, .path-adressbuch main, .cart-empty-page, .wrapper.product-content-wrapper, .instagram-feed  {  width: calc(100% - 40px); max-width: none; margin: 0px 20px; }
        .one-four.column { width: 50%; }

}

@media only screen and (min-width: 0px) and (max-width: 600px) {

    .wrapper.product-content-wrapper {
width: calc(100% - 40px);
margin: 0px 20px 0px 20px;
}

    }



/*  #Mobile (Portrait)
================================================== */

    /* Note: Design for a width of 320px */

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


        .column { float: none; }
         .one-two.column, .one-three.column { float: none; }

           .one-two.column, .one-three.column { width: 100%; padding-right: 0px; padding-left: 0px; }

        /* Filter */
        select, .js-form-type-textfield input, input { width: 100%; float: none;  }

    }



/********************************************************************************************************************/
