.productImage  img#largeImage{
    height:500px;
    width: 100%;
}
.productImage a{
    display: block;
}
 #description{
    padding:5px;
    margin:10px 0;
    color:rgba(0,0,0,0.5);
 }

 #thumbs img {
    height: 80px;
    cursor: pointer;
    width: 100%;
    margin-bottom: 15px;
}
.product-bg{
    background-color: #fff;
    padding: 20px;
}
.modal-dialog {
    width: 100%;
    max-width: 80%;
    margin: 0 auto;
    top: 15%;
    position: relative;
}
.modal-body {
    padding: 40px;
}

#thumbsOne img {
    width: 100%;
    max-width: 20%;
}
.img-border{
    border: 1px solid gray;
}

.modal .modal-body .col-md-9{
    text-align: center;
}
#thumbsOne img {
    width: 100%;
    max-width: 31%;
    padding-right: 8px;
    padding-bottom: 20px;
}
div#thumbsOne {
    padding: 20px 0;
}
.modal .productImage {
    text-align: center;
}

@media screen and (max-width:1024px){
    .productImage img#largeImage {
        height: auto;
    }
    #thumbs img {
        height: auto;
    }
    .product-bg .col-md-1 {
        padding: 0;
    }
    .product-button {
        margin-right: 13px;
        margin-left: 13px;
    }
    #thumbsOne img {
        max-width: 47%;
    }
}

@media screen and (max-width:991px){
    #thumbsOne img {
        max-width: 100%;
    }
}

@media screen and (max-width:991px){
    #thumbs img, .modal .modal-body #thumbsOne img {
        max-width: 18%;
    }
    .modal .modal-body {
        padding: 25px;
    }
    .img-border {
        margin-bottom: 20px;
    }
    #thumbs img, .modal .modal-body #thumbsOne img {
        padding-bottom: 0;
    }
    .modal .modal-body .productImage img {
        width: 100%;
    }
    .product-bg .col-md-5, .product-bg .col-md-6, .modal .modal-body .col-md-10{
        padding: 0;
    }
    .product-bg .col-md-5 {
        margin-top: 20px;
    }
}

@media screen and (max-width:567px){
    div#thumbsOne {
        padding: 10px 0;
    }
}