/*-------------------------------------
	Responsive Properties
--------------------------------------*/


@media screen and (max-width:960px){
	#main #content {display: block;}

	#container #main #content,
	#container #main .sidebar {
		width: 100%;
		max-width: 100%;
	}
}


@media screen and (max-width:840px){
	#header-logo {
		margin: 0;
		text-align: center;
		width: 100%;
	}

	#header-logo > a {
		float: left;
		line-height: 0;
		width: 100%;
	}

	#header-logo img {
		float: none;
	}

	.widget-header {
		float: none;
		text-align: center;
		width: 100%;
	}

	.widget-footer {
		display: block;
		margin: 0 0 10px;
		width: 100% !important;
	}

	/* === CUSTOM MOBILE MENU (MATCHING SCREENSHOT) === */
	#top-bar { 
		background-color: #6b0000 !important; /* Dark red/brown top */
		padding: 12px 15px !important; 
		text-align: left !important;
	}
	#top-bar-info { float: none; text-align: left; }
	#site-title { display: inline-block; margin: 0; }
	#site-title a { color: #ffa500 !important; font-size: 1.3rem; font-weight: bold; text-transform: uppercase; }
	#site-description { display: inline-block; color: #e0e0e0 !important; font-size: 1.05rem; margin-left: 8px; }

	#nav-top { display: none; /* Hide top nav links on mobile to focus on main nav */ }

	/* Main Nav styling */
	#nav-main {
		padding: 0 !important;
		width: 100% !important;
		display: block !important;
	}
	
	#nav-main .drop-toggle {
		display: none !important; /* Always show menu on mobile, hide toggle button */
	}

	#nav-main.drop .nav-main, #nav-main.dropped .nav-main, #nav-main .nav-main {
		display: block !important;
		background-color: transparent !important;
		margin: 0 !important;
		padding: 0 !important;
		border: none !important;
		width: 100% !important;
	}

	#nav-main .nav-main > li, #nav-main .nav-main > ul > li {
		display: block !important;
		clear: both !important;
		float: none !important;
		width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		box-sizing: border-box !important;
		border-bottom: 1px solid rgba(0,0,0,0.2) !important;
		border-top: 1px solid rgba(255,255,255,0.1) !important;
		background-color: transparent !important;
	}

	#nav-main .nav-main > li:last-child { border-bottom: 2px solid rgba(0,0,0,0.3) !important; }

	#nav-main .nav-main > li > a {
		color: #ffffff !important;
		text-align: center !important;
		padding: 8px !important;
		font-size: 1.05rem;
		display: block !important;
		width: 100% !important;
		box-sizing: border-box !important;
		text-transform: capitalize;
	}

	/* Sub-menus */
	#nav-main .sub-menu { display: none !important; } /* Hide sub-menus for clean look, or style them similarly if needed */

	.rtl #nav-main {padding-right: 0;}
	.rtl #nav-main .nav-main,
	.rtl #nav-main .nav-main li {float: none;}
}


@media screen and (max-width:480px){
	.bjqs-heading, .bjqs-descript {display: none;}

	.entry-excerpt, .entry-thumbnail {
		clear: both;
		padding-right: 0;
	}
	.entry-thumbnail {margin-bottom: 4px;}

	.rtl .entry-thumbnail {padding-left: 0;}
}