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

	/* ################ Started Styling for page ############################ */
	* {
		margin: 0;
		padding: 0;
		font-family: 'Comfortaa', cursive;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
	}

	/* .xtr_links_1{
         text-decoration: none;
    }
     */
	a {
		text-decoration: none;
	}

	body {
		/* background-color: rgb(255, 255, 255);
         */
		background-color: var(--dark_color);
	}

/* >>>>>>>>>>>>>>>>>>>> Header area started <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< */
		/* header css gula combild css file "tagWise--blog_Header.css" theke load hobe*/
/* >>>>>>>>>>>>>>>>>>>> Header area end <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< */



/* >>>>>>>>>>>>>>>>>>>> MAin area started <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< */
	.main {
		/* background-color: antiquewhite;
         */
		background-color: var(--dark_color);
		/* padding-bottom: 8rem;
         */
		width: 90%;
		max-width: 90rem;
		display: flex;
		justify-content: space-between;
		margin: auto;
	}

	.post_area {
		/* min-height: 50rem;
         */
		width: 100%;
		max-width: 100vw;

	}

	.post_area_header_space {
		width: 100%;
		/* margin-bottom: 2rem;
         */
	}

	.post_area_header_btn_area {
		margin: auto;
		max-width: 90vw;
		padding: 2rem 0rem;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
	}

	/* .filter_btn, .search_bar{
         background-color: transparent;
         backdrop-filter: blur(10px);
    }
     */
	.filter_btn {
		/* width: 32vw; */
		width: max-content;
		max-width: 10rem;
		border-radius: 5px;
		border: 1px none;
		background-color: var(--mini_white);
		padding: .2rem 1rem;
	}

	.search_bar {
		width: max-content;
		/* min-width: 30%; */
		max-width: 15rem;
		/* width: 33vw; */
		height: 30px;
		border-radius: 5px;
		border: 1px none;
		padding: .2rem 1rem;
		background-color: var(--mini_white);
		font-size: .8rem;
		color: rgb(0, 0, 0);
	}

	.post_area_wrapper hr {
		width: 90%;
		margin: auto;
		margin-bottom: 2rem;
		/* margin-top: 1rem;
         */
	}

	.post_card_wrapper {
		width: 100%;
		margin: 0 auto;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: space-evenly;
		-ms-flex-pack: space-evenly;
		justify-content: space-evenly;
		-webkit-box-align: start;
		-ms-flex-align: start;
		align-items: flex-start;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		height: max-content;
		margin-bottom: 4rem;
	}

	/* ---Post card info started-------------------- */
	.post_card {
		max-width: 22rem;
		min-width: 20rem;
		width: 100%;
		max-height: max-content;
		border: 1.2px solid #ffffff3f;
		border-radius: 10px;
		background-color: var(--dark_color);
		margin: 1rem;
		/* box-shadow: 0 0 10px -1px #ffffff2d;
         */
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		-webkit-transition: .2s;
		-o-transition: .2s;
		transition: .2s;
	}

	.post_card:hover {
		/* box-shadow:inset 0 0 10px 5px #ffffff2a;
         */
		/* box-shadow: 0 0 10px -1px #ffffff;
         */
		/* border: 1.2px solid var(--dark_color);
         */
		/* background-color: var(--dark_color_hover); */
		/* box-shadow: #ffffff40 0px 6px 12px -2px, #ffffff48 0px 3px 7px -3px; */
		/* border: 1.2px solid #00ff886e;
		box-shadow: #00ff8848 0px 0px 8px 1px; */
		border: 1.2px solid #ffffff6e;
		box-shadow: #ffffff48 0px 0px 8px 0px;

	}

	.p_c_header_area {
		/* width: 100%;
         */
		padding: 1rem 1.5rem;
		/* line-height: 1.8em;
         */
		/* margin-bottom: 1rem;
         */
	}

	.c_hearder {
		font-family: var(--sm_font_5);
		font-weight: bold;
		font-size: 1.3rem;
		color: var(--white);
	}

	.p_c_img_area {
		width: 100%;
		/* padding: 1rem 1.5rem;
         */
		/* margin-bottom: .4rem;
         */
	}

	.c_pic {
		width: 100%;
		height: auto;
	}

	.p_c_writter_area {
		/* width: 100%;
         */
		padding: 1rem 1rem;
	}

	.c_author {
		font-weight: normal;
		font-size: .9rem;
		color: var(--white);
	}

	.p_c_discription_area {
		/* width: 100%;
         */
		padding: 0rem 1rem;
		margin-bottom: 1rem;
	}

	.c_discription {
		font-family: var(--sm_font_5);
		font-weight: normal;
		font-size: .9rem;
		color: var(--white);
	}

	.readMore {
		color: rgb(100, 255, 255);
		font-size: .9rem;
		-webkit-transition: .3s;
		-o-transition: .3s;
		transition: .3s;
	}

	.readMore:hover {
		color: rgba(0, 255, 255, 0.596);
        
		/* font-size: 1.1rem;
         */
		/* text-decoration: underline; */
	}

	.readMore::after {
		color: rgb(255, 30, 0);
		font-size: 1.1rem;
		text-decoration: underline;
	}

	.comingSoon {
		color: #19fd8093;
		font-size: .9rem;
		-webkit-transition: .3s;
		-o-transition: .3s;
		transition: .3s;
		font-weight: bolder;
	}

	.comingSoon:hover {
		color: #19fd80;
		/* font-size: 1.1rem;
		/* text-decoration: underline; */
	}

	.comingSoon::after {
		color: rgb(255, 30, 0);
		font-size: 1.1rem;
		text-decoration: underline;
	}

	.p_c_time_area {
		/* width: 100%;
         */
		padding: 0rem 1rem;
		margin-top: 1.5rem;
		margin-bottom: 1rem;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
	}

	.c_upTime,
	.c_readingTime,
	.c_copyPostLink {
		font-family: var(--sm_font_2);
		font-weight: normal;
		font-size: .8rem;
		color: var(--white);
		display: inline-block;
		/* margin-right: 2rem;
         */
	}
}

.c_copyPostLink {
	cursor: pointer;
}

/* ---Post card info end--------- */
/* ------- search bar er jonno css start ------- */
/* হাইলাইট করা টেক্সটের স্টাইলিং */
mark {
	background-color: yellow;
	/* হাইলাইট রঙ */
	color: black;
	/* টেক্সট রঙ */
	padding: 2px;
	border-radius: 4px;
}

/* ব্লিংক ইফেক্ট */
@-webkit-keyframes blink {

	0%,
	100% {
		opacity: 1;
	}

	50% {
		opacity: 0;
	}
}

@keyframes blink {

	0%,
	100% {
		opacity: 1;
	}

	50% {
		opacity: 0;
	}
}

mark.blink {
	-webkit-animation: blink 1s infinite;
	animation: blink 1s infinite;
}

/* ------- search bar er jonno css end------- */
/* >>>>>>>>>>>>>>>>>>>> main area end <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< */

#hr_2 {
	margin-bottom: 10vh;
	margin-top: 20vh;
}



/* >>>>>>>>>>>>>>>>>>>> footer area started <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< */
	/* footer css gula combild css file "tagWise--blog_Footer.css" theke load hobe*/
/* >>>>>>>>>>>>>>>>>>>> Footer area end <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< */