.gallery {
-webkit-column-count: 4;
-moz-column-count: 3;
column-count: 3;
-webkit-column-width: 33%;
-moz-column-width: 33%;
column-width: 33%; }
.gallery .pics {
-webkit-transition: all 350ms ease;
transition: all 350ms ease; }
.gallery .animation {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1); }



/*customstyles*/
.filter-button
{
    font-size: 18px;
    border: 1px solid #42B32F;
    border-radius: 5px;
    text-align: center;
    color: #42B32F;
    margin-bottom: 30px;

}
.filter-button:hover
{
    font-size: 18px;
    border: 1px solid #42B32F;
    border-radius: 5px;
    text-align: center;
    color: #ffffff;
    background-color: #42B32F;

}
.btn-default:active .filter-button:active
{
    background-color: #42B32F;
    color: white;
}


/*customstyles*/



#more {display: none;}


a:not([href]):not([tabindex]) {
    color: #007bff;
    text-decoration: none;
	font-size: .7em;
	font-weight: 500;
}






@media (max-width: 450px) {
.gallery {
-webkit-column-count: 1;
-moz-column-count: 1;
column-count: 1;
-webkit-column-width: 100%;
-moz-column-width: 100%;
column-width: 100%;
}
}

@media (max-width: 400px) {
.btn.filter {
padding-left: 1.1rem;
padding-right: 1.1rem;
}
}






/* Style the tab */
div.tab {
    float: left;
    border: 1px solid #ccc;
    background-color: #f1f1f1;
    width: 30%;
    height: 300px;
}

/* Style the buttons inside the tab */
div.tab button {
    display: block;
    background-color: inherit;
    color: black;
    padding: 22px 16px;
    width: 100%;
    border: none;
    outline: none;
    text-align: left;
    cursor: pointer;
    transition: 0.3s;
}

/* Change background color of buttons on hover */
div.tab button:hover {
    background-color: #ddd;
}

/* Create an active/current "tab button" class */
div.tab button.active {
    background-color: #ccc;
}

/* Style the tab content */
.tabcontent {
    float: left;
    padding: 0px 12px;
    border: 1px solid #ccc;
    width: 70%;
    border-left: none;
    height: 300px;
}



	.servbox{
	background-color: #fff;
    border: 1px solid #f2f2f2;
    color: #009a9a;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    border-radius: 0;
    padding: 5px 10% 5px 10%;
    margin-top: 10px;
    margin-bottom: 10px;	
	
		
		
	}

	.servbox img{
		width: 60%;
	}

	.servbox img:hover {
	/*   -webkit-filter: grayscale(100%); Ch 23+, Saf 6.0+, BB 10.0+ */
	  /* filter: grayscale(100%); FF 35+ */
	}



	
	.servbox h2{
	font-size: 1em;
    font-weight: 600;
	letter-spacing: -1px !important;
	margin-bottom: .4rem !important;
	}
	
	.servbox p{
	font-size: .7em;
    font-weight: 500 !important;
	color: #FF0055;
	text-transform: capitalize;
	margin-bottom: .4rem !important;
	}
	
	
	.servbtn{
	background-color: #fff !important;
    color: #5ec9d8 !important;
    width: 90%;
    border: 1px solid #5ec9d8 !important;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    border-radius: 0;
    padding: 5px 10% 5px 10%;
    margin-bottom: 10px;
	font-weight: 300;
	font-size: .8em;
	}
	
	.servbtn:hover{
		background-color: #5ec9d8 !important;
		color: #fff !important;
		
		
	}




@media (max-width: 767px){
	
	
	.servbox{
	background-color: #fff;
    border: 1px solid #f2f2f2;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    border-radius: 0;
    margin-bottom: 10px;
    height: auto;
	}
	
	
	
	.servbox img{
		width: 80%;
		
	}

	
	.servbox h2{
	font-size: .8em;
    font-weight: 400;
	}
	
	
	
	
	
	
	
}