@media screen and (max-width: 991px){

	.navbar-nav li.nav-item
	{
		margin:15px 0;
		text-align: center;
	}

	.navbar-nav-bg
	{
		background-color: rgba(0,0,0,0.7);
	}

	.services-content .row .col-lg-4
	{
		margin-top: 60px;
	}

	.services-content .row .col-lg-4:nth-child(1)
	{
		margin-top: 0;
	}

	.main .type
	{
		font-size: 40px;
	}

	.post-image
	{
		height: 400px;
	}
}

@media screen and (max-width: 767px){

	.about .col-md-7
	{
		margin-top: 60px;
	}

	.education, .experience, .about .col-md-7,.skills
	{
		text-align: center;
	}

	.post-image
	{
		height: 350px;
		box-sizing: content-box;
	}
}



@media screen and (max-width: 600px){
	.post-image
	{
		height: 300px;
	}
}

@media screen and (max-width: 500px){
	.main .type
	{
		font-size: 24px;
	}
}

@media screen and (max-width: 450px){
	.post-image
	{
		height: 250px;
	}
}




.water-cycle .btn-custom {
	position: absolute;
	top: 75%;
	left: 77%;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	background-color: #BAC69B;
	color: #483018;
	font-size: 16px;
	padding: 5px 24px;
	border: none;
	cursor: pointer;
	border-radius: 5px;
	text-align: center;
	z-index: 1;
	border-radius: 15px;
}

.water-cycle .btn-custom:hover {
	background-color: white;
	z-index: 2;
}

.water-cycle span[text]::after {
	position: absolute;
	content: attr(text);
	top: 0;
	left: 0;
	font-size: 12px;
	background-color: white;
	padding: 5px;
	border-radius: 15px;
	text-align: left;
	min-width: 200px;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	z-index: 2;
	opacity: 0;
}

.water-cycle span[text]:hover::after {
	opacity: 1;
}