
.isotope-gallery{
	float:left;
	width:100%;
	height:auto;
	margin-top:0px;
	margin-bottom:0px;
}

/* ---- button ---- */

.isotope-button-group .button {
  display: inline-block;
  padding: 0.5em 1.0em;
  background: #40597E;
  border: none;
  border-radius: 7px;
  text-transform:capitalize;
  background-image: linear-gradient( to bottom, hsla(0, 0%, 0%, 0), hsla(0, 0%, 0%, 0.2) );
  color: #FFFFFF;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  text-shadow: 0 1px white;
  cursor: pointer;
  margin-bottom:2px;
}

.isotope-button-group .link{
  display: inline-block;
  padding: 5px 10px;
  background: none;
  border: 1px solid #40597E;
  text-transform:capitalize;
  color: #FFFFFF;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  cursor: pointer;
  margin-bottom:2px;
}

.isotope-button-group .shape{
  display: inline-block;
  padding: 4px 12px;
  background: #40597E;
  border: 0px solid #40597E;
  color: #FFFFFF;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  cursor: pointer;
  margin-bottom:2px;
}

.isotope-button-group .button:hover {
  background-color: #8A99A9;
  text-shadow: 0 1px hsla(0, 0%, 100%, 0.5);
  color: #FFFFFF;
}

.isotope-button-group .link:hover{
	text-decoration:none;
	color:#FFFFFF;
	background-color: #8A99A9;
}

.isotope-button-group .shape:hover{
	text-decoration:none;
	color:#FFFFFF;
	background-color: #8A99A9;
}

.isotope-button-group .button:active,
.isotope-button-group .button.is-checked {
  background-color: #40597E;
}

.isotope-button-group .link:active,
.isotope-button-group .link.is-checked{
	color:#FFFFFF;
	background:#40597E;
}

.isotope-button-group .shape:active,
.isotope-button-group .shape.is-checked{
	color:#FFFFFF;
	position:relative;
}

.isotope-button-group .shape:active::after, .isotope-button-group .shape.is-checked::after {
	z-index: -1;
	position: absolute;
	top: 100%;
	left: 30%;
	margin-left: 0;
	content: '';
	width: 0;
	height: 0;
	border-top: solid 15px #40597E;
	border-left: solid 15px transparent;
	border-right: solid 15px transparent;
}

.isotope-button-group .button.is-checked {
  color: #FFFFFF;
  text-shadow: 0 -1px hsla(0, 0%, 0%, 0.8);
}

.isotope-button-group .button:active {
  box-shadow: inset 0 1px 10px hsla(0, 0%, 0%, 0.8);
}

/* ---- button-group ---- */

.isotope-button-group {
  margin: 10px auto;
  width: 100%; 
  text-align: center;
  margin-bottom: 20px;
}

.isotope-button-group:after {
  content: '';
  display: block;
  clear: both;
}

.isotope-button-group .button {
  border-radius: 0;
  margin-left: 0;
  margin-right: 1px;
}

.isotope-button-group .button:first-child { border-radius: 0.5em 0 0 0.5em; }
.isotope-button-group .button:last-child { border-radius: 0 0.5em 0.5em 0; }



/* ---- isotope ---- */

.isotope-grid {
  margin: 0 auto;
  width: 100%; 
  font-family: 'Open Sans', sans-serif;
}

.isotope-grid:after {
  content: '';
  display: block;
  clear: both;
}




/****** image zoom in ******/

.isotope-grid .isotope-image-zoom {
	position:relative;
	width:100%;
	height:100%;
	display:inline-block;
	overflow:hidden;
}

.isotope-grid .isotope-image-zoom img 
{
	transition:all .5s ease-in-out;
	-webkit-transition:all .5s ease-in-out;
	-moz-transition:all .5s ease-in-out;
	-ms-transition:all .5s ease-in-out;
	-o-transition:all .5s ease-in-out;
}

.isotope-grid .isotope-image-zoom:hover img 
{
	transform:scale(1.2);
	-webkit-transform:scale(1.2);
	-moz-transform:scale(1.2);
	-ms-transform:scale(1.2);
	-o-transform:scale(1.2);
}



/* ---- .grid-item ---- */

.isotope-grid p, .isotope-grid h2, .isotope-grid h3, .isotope-grid h4{
	clear:both;
	margin:0px;
	padding:0px;
}

.isotope-grid img{
	position:center;
	border:0px solid #40597E;
}

.isotope-grid a, .isotope-grid a:hover{
	color:#000000;
	text-decoration:none;
}

.isotope-grid .isotope-grid-item {
  display:block;
  overflow:hidden;
  height:auto;
  padding:5px;
  color: #444;
}

.isotope-grid .isotope-item{
	float:left;
	width:100%;
	height:100%;
	background:#FFFFFF;
	box-shadow:0px 0px 2px 1px #ccc;
	padding:6px;
	overflow:hidden;
}


@media only screen and (max-width: 767px){
  .isotope-item{
	  margin:0 auto !important;
	  float:none !important;
	  width:280px !important;
  }
  
  .isotope-button-group .shape:active::after, .isotope-button-group .shape.is-checked::after {
		z-index: -1;
		position: absolute;
		top: 100%;
		left: 30%;
		margin-left: 0;
		content: '';
		width: 0;
		height: 0;
		border-top: solid 0px #f44336;
		border-left: solid 0px transparent;
		border-right: solid 0px transparent;
	}
}

