.col-sm-6 {
	padding: 1em;
	text-align: left;
}
.col-sm-6 img {
	height:auto;
	max-width:97%;
}
.img-responsive {
	border-radius: 10px;
}	
.carousel-inner {
	border-radius: 10px;
}
.carousel-control {
	border-radius: 10px;
}

/*Bootstrap box sizing repair*/
#content {
	box-sizing: content-box;
	width:98%
}





	align-content:  cursor on images to hand pointer -->
    img:hover {
    cursor:pointer;
}
<!-- stop lightbox image changing cursor -->
.gridder-show .img-responsive:hover {
    cursor:default;
}

.gridder{position:relative;padding:0px;list-style-type:none;font-size:0;text-align: center}
.gridder-list,.gridder-show{font-size:16px}
.gridder-content{display:none}

li.gridder-list {
    display:inline-flex;
    align-items:space-around;
}

.gridder-list:{ 
    
}

.gridder-navigation a.disabled {
    opacity: 0.5;
}

.gridder-nav.next::before {
    content: url("/images/portfolio-img/next.png");
}
.gridder-nav.prev::before {
    content: url("/images/portfolio-img/prev.png");
}
.gridder-close::before {
    content: url("/images/portfolio-img/close.png");
}
.img-responsive {
	
    border-radius:8px;
    padding:3px;
    width:30vw;
    height:30vw;
	max-width: 97%;
	margin:0 auto;
}

.gridder-show {
    display:block;
	width:98%;
	position: relative;
    top:0.5%;
    left:0.5%;
    border-radius: 10px;
	border: solid 2px #8db863;
	padding: 0.5em;
	margin-left:auto;
    margin-right:auto;
    margin-top:2em;
    margin-bottom:2em;
	background: #858585 url("images/index-img/bg.png") repeat scroll 0 0;
    
    
}
#carouseltext {
    width: 50%;
    float: right;
    margin:2%;
}

.gridder-expanded-content .img-responsive {
	
    border-radius:8px;
    padding:0px;
    width:100%;
    height: auto;
}




    
/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 481px) {

	/*Bootstrap box sizing repair*/
#content {
	box-sizing: content-box;
	width:96.4%
}
.img-responsive {
	
    width:18vw;
    height:18vw;
}
.gridder-expanded-content .img-responsive {
	
    border-radius:8px;
    padding: 0px;
    width: 100%;
	height: auto;
    }

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

	/*Bootstrap box sizing repair*/
#content {
	box-sizing: content-box;
	width:97.7%
}
	
	.img-responsive {
	
    width: 15vw;
	height: 15vw;
    
}
.gridder-expanded-content .img-responsive {
	
    border-radius:8px;
    padding:0px;
    width: 100%;
	height: auto;
    }

  
.gridder-show {
    margin-top:2em;
    margin-bottom:2em; 
    width: 90%;
	}
	
	#content-1 {
		width:50%;
		float: left;
	}
}