.nav-link:hover {
    text-decoration: underline;
}

.nav-link.active {
    text-decoration: underline;
}

.justify-text {
    text-align: justify;
}

.blog-tag-circle {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 80px;
	height: 80px;
	background-color: #7c7c7c8b;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 1;
  }
  
  .blog-tag-text {
	color: white;
	font-size: 14px;
	font-weight: bold;
  }
  
.btn-amazon {
    /*background-color: #ff9900;*/
	background-color: #ffffff;
    color: rgb(0, 0, 0);
    border: solid;
	border-width: 1px;
	border-color: #cacaca;
}

.btn-amazon:hover {
    /*background-color: #e68a00;*/
	background-color: #ededed;
    color: rgb(0, 0, 0);
    transition: background-color 0.1s ease-in-out;
	border: solid;
	border-width: 1px;
	border-color: #cacaca;
}

.btn-barnesnoble {
    background-color: #ffffff;
    color: rgb(0, 0, 0);
    border: solid;
	border-width: 1px;
	border-color: #cacaca;
}

.btn-barnesnoble:hover {
    background-color: #ededed;
    color: rgb(0, 0, 0);
    transition: background-color 0.1s ease-in-out;
	border: solid;
	border-width: 1px;
	border-color: #cacaca;
}

.btn-apple {
    background-color: #ffffff;
    color: rgb(0, 0, 0);
    border: solid;
	border-width: 1px;
	border-color: #cacaca;
}

.btn-apple:hover {
    background-color: #ededed;
    color: rgb(0, 0, 0);
    transition: background-color 0.1s ease-in-out;
	border: solid;
	border-width: 1px;
	border-color: #cacaca;
}

.new-blog-post-tag {
	position: absolute;
	top: 5px;
	left: 5px;
	width: 100px;
	height: 40px;
	border-radius: 20px;
	box-shadow: 0 0 10px rgba(16, 16, 16, 0.792);
	overflow: hidden;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(to right, #367ab9,  #5cabf6); /* Added gradient colors */
}

.new-blog-post-tag::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url('/pics/blognew.png');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	opacity: 0.99;
	z-index: -1;
}
  

  


/* https://miketricking.github.io/bootstrap-image-hover/ */  
.hovereffect {
	/*width:100%; 
	height:100%;*/
	float:left;
	overflow:hidden;
	position:relative;
	text-align:center;
	cursor:hand;
	}
	
	.hovereffect .overlay {
	width:100%;
	height:100%;
	position:absolute;
	overflow:hidden;
	top:0;
	left:0;
	opacity:0;
	background-color:rgba(255, 255, 255, 0.248);
	-webkit-transition:all .4s ease-in-out;
	transition:all .4s ease-in-out
	}

	.hovereffect .highlight {
		width:100%;
		height:100%;
		position:absolute;
		overflow:hidden;
		top:0;
		left:0;
		opacity:0;
		background-color:rgba(255, 255, 255, 0.398);
		-webkit-transition:all .4s ease-in-out;
		transition:all .4s ease-in-out
	}
	
	.hovereffect img {
	display:block;
	position:relative;
	-webkit-transition:all .2s linear;
	transition:all .2s linear;
	
	}

	.hovereffect col {
	display:block;
	position:relative;
	-webkit-transition:all .4s linear;
	transition:all .4s linear;
	}

	#hovereffect-card {
		width:100%;
		display:block;
		position:relative;
		-webkit-transition:all .4s linear;
		transition:all .4s linear;
		
	}
	
	
	.hovereffect h2 {
	top: 40%;
	/* height:534px; */
	text-transform:none;
	color:#fff;
	text-align:center;
	position:relative;
	font-size:20px;
	background:rgba(0,0,0,0.6);
	-webkit-transform:translatey(-100px);
	-ms-transform:translatey(-100px);
	transform:translatey(-100px);
	-webkit-transition:all .2s ease-in-out;
	transition:all .2s ease-in-out;
	padding:10px;
	}

	.hovereffect h1 {
		top: 50%;
		/* height:534px; */
		text-transform:none;
		color:#fff;
		text-align:center;
		position:relative;
		font-size:50px;
		background:rgba(0,0,0,0.6);
		-webkit-transform:translatey(-100px);
		-ms-transform:translatey(-100px);
		transform:translatey(-100px);
		-webkit-transition:all .2s ease-in-out;
		transition:all .2s ease-in-out;
		padding:10px;
		}
	
	.hovereffect a.info {
	text-decoration:none;
	display:inline-block;
	text-transform:uppercase;
	color:#fff;
	border:1px solid #fff;
	background-color:transparent;
	opacity:0;
	filter:alpha(opacity=0);
	-webkit-transition:all .2s ease-in-out;
	transition:all .2s ease-in-out;
	margin:50px 0 0;
	padding:7px 14px;
	}
	
	.hovereffect a.info:hover {
	box-shadow:0 0 5px #fff;
	}
	
	.hovereffect:hover img {
	-ms-transform:scale(1.2);
	-webkit-transform:scale(1.2);
	transform:scale(1.2);
	/*filter: blur(3px);*/
	
	}
	
	.hovereffect:hover .overlay {
	opacity:1;
	filter:alpha(opacity=100);
	}

	.hovereffect:hover .highlight {
		opacity:1;
		filter:alpha(opacity=100);
	}
	
	.hovereffect:hover h2,.hovereffect:hover a.info {
	opacity:1;
	filter:alpha(opacity=100);
	-ms-transform:translatey(0);
	-webkit-transform:translatey(0);
	transform:translatey(0);
	}
	
	.hovereffect:hover a.info {
	-webkit-transition-delay:.2s;
	transition-delay:.2s;
	}

	.hovereffect .card-img-overlay {
		background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 50%);
	}
	