.webShopRow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
/*   margin-right: -10px;*/
 /*  margin-left: -10px; */
  text-align: justify;
}

/* Clear floats after the columns */
/* .webShopRow:after {
  content: "";
  display: table;
  clear: both;
} */

/*.webShopColumn2 {
  float: left;
  width: 2.5%;
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 0px;
  padding-bottom: 10px;
}*/

.webShopColumn25 {
  float: left;
  width: 25%;
  /* height: 400px; */
  border: 3px solid black;
  /* background-color:#ccc;  gray*/
  background-color:white;
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
}

.webShopColumn50 {
    float: left;
    width: 50%;
    /* height: 400px; */
    border: 3px solid black;
    /* background-color:#ccc;  gray*/
    background-color: black;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
}

.webShopColumn50PadLeft {
    float: left;
    width: 50%;
    /* height: 400px; */
    border: 3px solid black;
    /* background-color:#ccc;  gray*/
    background-color: black;
    padding-left: 5px;
    padding-right: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
}

/*.webShopColumn33 {
  float: left;
  width: 33.33%;*/
  /* height: 400px; */
  /*border: 3px solid black;*/
  /* background-color:#ccc;  gray*/
  /*background-color:white;
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
}*/


.webShopPicture {
/*  float: center;
  width: 100%;
  height: 100%; */
  border: 3px solid white;
  padding-left: 0px;
  padding-right: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
}

.buttonPicture {
  background-color: white;
  border: none;
  color: white;
  text-align: center;
  text-decoration: none;
  display: stretch;
  width: 100%;
  font-size: 16px;
  cursor: pointer;
}

.button2 {background-color: #008CBA;} /* Blue */
.button3 {background-color: #f44336;} /* Red */ 
.button4 {background-color: #e7e7e7; color: black;} /* Gray */ 
.button5 {background-color: #555555;} /* Black */

.buttonPicture:hover {
  background-color: #F5F5F5; /* White smoke */
  color: #6394F8;
  box-shadow: 0px 5px #6394F8;
}

.buttonPicture:active {
  background-color: #F5F5F5; /* White smoke */
  box-shadow: 0px 5px #008CBA;
  transform: translateY(4px);
}

.productTitle {
    display: 100%;
    width: 100%;
    /*height: 35px;*/
    color: black;
    /*  border: 3px solid yellow; */
    text-align: center;
    /* font-size: 1.6rem;*/
    font-size: 1.2rem;
    font-weight: bold;
}

.productPrice {
  display: 100%;
  width: 100%;
  color: black;
 /*  border: 3px solid yellow; */
  text-align: center;
  font-size: 1.2rem;
 /* font: 28px "Lato", Arial, sans-serif; */
}

.imgProductDescription {
    max-width: 50%;
    float: left;
    margin-right: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.productDescriptionTitle {
    font-size: 1.4rem;
    color: black;
    margin-top: 2px;
}

.productDescriptionInfo {
    font-size: 1.2rem;
    text-align: left;
}

.productDescriptionBody {
    font-size: 1rem;
}

.promoAction {
    width: 100%;
    display: block;
    border: 3px solid black;
}

.promoActionTitle {
    text-align: center;
    font-size: 1.6rem;
    color: yellow;
}

.promoActionDescription {
    text-align: center;
    font-size: 1.2rem;
}

/* ----------------------- */
/* ----- MODAL STYLE ----- */
/* ----------------------- */
.modal-body-WebShopProductDetails {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    background-color: black;
    border-width: 3px;
    border-style: solid;
    border-color: white;
    padding: 5px;
}	

/* .modal-header .close {
  padding: 0rem 1rem 0rem 1rem;
  margin: 0.5rem 0rem 0rem 0rem;
  color: black;
  background-color:Red;
} */


/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media screen and (max-width: 1600px) {
    .webShopColumn25 {
        width: 25%;
    }

    .webShopColumn50 {
        width: 50%;
    }

    .webShopColumn50PadLeft {
        width: 50%;
        padding-left: 5px;
    }

    .productTitle {
        font-size: 1rem;
    }

    .productPrice {
        font-size: 1rem;
    }
}

@media screen and (max-width: 1280px) {
    .webShopColumn25 {
        width: 33.33%;
    }

    .webShopColumn50 {
        width: 50%;
    }

    .webShopColumn50PadLeft {
        width: 50%;
        padding-left: 5px;
    }

    .productTitle {
        font-size: 0.9rem;
    }

    .productPrice {
        font-size: 0.9rem;
    }
}

@media screen and (max-width: 992px) {
    .webShopColumn25 {
        width: 50%;
    }

    .webShopColumn50 {
        width: 100%;
    }

    .webShopColumn50PadLeft {
        width: 100%;
        padding-left: 0px;
    }

    .productTitle {
        font-size: 0.9rem;
    }

    .productPrice {
        font-size: 0.9rem;
    }
}

@media screen and (max-width: 600px) {
    .webShopColumn25 {
        width: 50%;
    }

    .webShopColumn50 {
        width: 100%;
    }

    .webShopColumn50PadLeft {
        width: 100%;
        padding-left: 0px;
    }

    .productTitle {
        font-size: 0.8rem;
    }

    .productPrice {
        font-size: 0.8rem;
    }

    .imgProductDescription {
        max-width: 100%;
    }

    .productDescriptionTitle {
        font-size: 0.9rem;
    }

    .productDescriptionInfo {
        font-size: 0.9rem;
    }

    .productDescriptionBody {
        font-size: 0.8rem;
    }
}

@media screen and (max-width: 452px) {
    .webShopColumn25 {
        width: 100%;
    }

    .webShopColumn50 {
        width: 100%;
    }

    .webShopColumn50PadLeft {
        width: 100%;
        padding-left: 0px;
    }

    .productTitle {
        font-size: 0.9rem;
    }

    .productPrice {
        font-size: 0.9rem;
    }

    .promoActionTitle {
        font-size: 1.4rem;
    }

    .promoActionDescription {
        font-size: 1rem;
    }
}

@media screen and (max-width: 352px) {
    .promoActionTitle {
        font-size: 1.2rem;
    }

    .promoActionDescription {
        font-size: 0.9rem;
    }
}