/* ---------- Overall Specifications ---------- */

/* 1. Global Styles */

html {
	overflow-y: scroll;
}

body {
	/* font-family: 'Open Sans', arial, 'Josefin Sans', sans-serif; -- OLD */
	font-family: 'Roboto', sans-serif;
	color: #333;
	/*background: url(../images/bg1.jpg) no-repeat center center fixed;*/
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

p {
	line-height: 20px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	/* font-family: 'Playfair Display', 'Helvetica Neue', Helvetica, Arial, sans-serif; -- OLD */
	font-family: 'Roboto Slab', serif;
	font-weight: 700;
}

a {
	color: #795548;
	transition: .3s;
}

a:hover {
	color: #795548;
	text-decoration: none;
	outline: 0;
	transition: .3s;
}

ul {
	padding: 0;
	margin: 0;
}

li {
	list-style: none;
	margin: 0;
}

img {
	max-width: 100%;
	height: auto;
}

#user-login-form input.form-text,
#user-register-form input.form-text,
#user-register-form input.form-email,
#user-register-form textarea.form-textarea-wrapper {
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 4px;
	/* Modern rounded corners */
	/* box-shadow: 3px 4px 5px rgba(0, 0, 0, 0.03) inset; -- OLD inset shadow */
	box-shadow: none;
	font-family: 'Roboto', sans-serif;
	height: 38px;
	/* Slightly taller for modern feel */
	margin-bottom: 4px;
	padding: 5px 15px;
	width: 100%;
	transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

#user-login-form input.form-text:focus,
#user-register-form input.form-text:focus,
#user-register-form input.form-email:focus,
#user-register-form textarea.form-textarea-wrapper:focus {
	border-color: #795548;
	box-shadow: 0 0 0 2px rgba(224, 0, 0, 0.1);
	outline: none;
}

/* 2. Topbar */

.top-bar {
	padding: 10px 40px;
	min-height: 40px;
}

.top-bar .block {
	margin-bottom: 0;
}

.tb-left li {
	float: left;
	margin-right: 35px;
	position: relative;
}

.tb-left li:before,
.tb-right li:before {
	content: "";
	width: 5px;
	height: 6px;
	-webkit-border-radius: 3px 2px 2px 3px/3px;
	-moz-border-radius: 3px 2px 2px 3px/3px;
	border-radius: 3px 2px 2px 3px/3px;
	background-color: #444;
	-webkit-box-shadow: 0 1px rgba(255, 255, 255, .35), inset 1px 1px 2px rgba(0, 0, 0, .35);
	-moz-box-shadow: 0 1px rgba(255, 255, 255, .35), inset 1px 1px 2px rgba(0, 0, 0, .35);
	box-shadow: 0 1px rgba(255, 255, 255, .35), inset 1px 1px 2px rgba(0, 0, 0, .35);
	position: absolute;
	top: 6px;
	right: -20px;
}

.tb-left li:last-child:before,
.tb-right li:last-child:before {
	display: none;
}

.tbr-social::before {
	display: none;
}

.tbr-social {
	background: #795548;
	border-radius: 4px;
}

.tbr-login {
	display: none;
}

.tbl-date {
	font-size: 12px;
	background: #795548;
	padding: 5px;
	border-radius: 4px;
	font-weight: bold;
	color: #fff;
	text-transform: uppercase;
}

.tbl-temp {
	font-size: 12px;
	font-weight: bold;
	color: #fff;
	text-transform: uppercase;
}

.tbl-temp i {
	margin-right: 5px;
}

.tb-right li {
	float: left;
	margin-left: 35px;
	position: relative;
}

.tbr-login a {
	font-size: 12px;
	font-weight: bold;
	color: #fff;
	text-transform: uppercase;
}

.tbr-login a:hover {
	color: #795548;
}

.tbr-social span a {
	color: #FFF;
	font-size: 14px;
	margin-left: 10px;
}

.tbr-social span a:hover {
	color: #795548;
}

.tb-right {
	display: table;
	float: right;
}

/* 3. OuterWrap  */

.wrapper {
	background: #fff;
	margin-top: 0;
	padding: 0;
	position: relative;
	border: solid 1px #cecece;
}

.wrapper:before {
	content: "";
	background: rgba(255, 255, 255, 0.6);
	height: 7px;
	position: absolute;
	top: -7px;
	left: 0;
	right: 0;
	width: 98.5%;
	margin: 0;
	margin: 0 auto;
}

.wrapper:after {
	content: "";
	background: rgba(255, 255, 255, 0.7);
	height: 14px;
	position: absolute;
	top: -14px;
	left: 0;
	right: 0;
	width: 97%;
	margin: 0;
	margin: 0 auto;
}

/* 4. Header  */

header {
	background: #f8f8f8;
	height: 50px;
	border-bottom: 1px solid #dddddd;
	position: relative;
}

/* 4.1. Header - Nav */
header .navbar-default {
	float: left;
	background: none;
	border: none;
	margin: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
	position: relative;
	z-index: 99;
}

header nav ul.menu {
	padding-left: 0px;
	margin-left: 0;
}

header nav ul.menu li.menu-item {
	float: left;
	font-family: Oswald;
	font-size: 14px;
	color: #000;
	text-transform: uppercase;
	padding: 0;
	list-style: none;
}

header nav ul.menu li.menu-item a,
header nav ul.menu li.menu-item span {
	padding: 15px 15px;
	display: table;
	background: transparent;
	position: relative;
	color: #000000;
}

header nav ul.menu li.menu-item a:hover,
header nav ul.menu li.menu-item>a.is-active {
	color: #000000;
}

/* Home Link Active Fix: Only be active on Front Page */
background: transparent !important;
color: #000 !important;
}

display: none !important;
}

header nav ul.menu li.menu-item a:hover,
header nav ul.menu li.menu-item a.is-active {
	background: #f0f0f0;
}

header nav ul.menu li.menu-item a:hover:after,
header nav ul.menu li.menu-item a.is-active:after {
	content: "";
	position: absolute;
	height: 4px;
	width: 100%;
	bottom: 0;
	right: 0;
	left: 0;
	background: #795548;
}

header nav ul.menu li.menu-item a {
	padding: 7px 15px;
	display: table;
	background: transparent;
	position: relative;
}

.navbar-toggle {
	float: left;
}

header nav ul.menu li.menu-item--expanded>a,
header nav ul.menu li.menu-item--expanded>span {
	padding-right: 25px;
	position: relative;
}

header nav ul.menu li.menu-item--expanded>a:before,
header nav ul.menu li.menu-item--expanded>span:before {
	content: "\f0d7";
	font-family: 'FontAwesome';
	font-size: 14px;
	color: #333333;
	position: absolute;
	right: 8px;
	top: 7px;
}

header nav ul.menu .menu-item--expanded ul.menu {
	display: none;
	background: #f0f0f0;
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 10;
	width: 15em;
}

header nav ul.menu .menu-item--expanded.open ul.menu {
	display: block;
}

header nav ul.menu li.menu-item--expanded {
	position: relative;
}

header nav ul.menu li.menu-item--expanded ul.menu li {
	width: 100%;
}

header nav ul.menu li.menu-item--expanded ul.menu li a {
	width: 100%;
}

header .navbar-collapse {
	padding-left: 0;
	padding-right: 0;
}


/* 4.2. Header - Search */
.search-trigger {
	float: right;
	width: 60px;
	height: 50px;
	border-left: 1px solid #dddddd;
	text-align: center;
	line-height: 50px;
	color: #795548;
	font-size: 18px;
	margin-right: -15px;
	cursor: pointer;
	position: relative;
	z-index: 999;
}

.search-trigger i {
	transition: .4s;
}

.search-trigger:hover {
	color: #000;
}

.search {
	position: absolute;
	width: 100%;
	height: 100%;
	right: 0;
	padding: 0 15px;
	display: none;
	z-index: 99;
}

.search form {
	background: #f8f8f8;
	display: table;
	width: 100%;
	height: 49px;
	right: 0;
}

.search form input {
	padding: 5px 40px;
	padding-right: 80px;
	background: none;
	border: none;
	color: #000;
	font-size: 16px;
	font-family: Arial;
	width: 100%;
	font-weight: 300;
	height: 49px;
}

.search form .button {
	position: absolute;
	right: 0px;
	width: 100px;
	height: 50px;
	text-align: center;
	line-height: 50px;
	color: #795548;
	font-size: 15px;
	border: none;
	border-left: 1px solid #dddddd;
	border-bottom: 1px solid #dddddd;
	background: #eee;
	top: 0;
	right: 42px;
	text-align: center;
	padding: 0;
	transition: .4s;
}

.mega-menu {
	position: absolute;
	width: 100%;
	left: 0;
	right: 0;
	margin: 0;
	margin-top: 40px;
	border-top: 3px solid #795548;
	padding: 0;
	overflow: hidden;
	background: #1c1c1c;
	z-index: 99999999;
	transition: .4s;
	visibility: hidden;
	opacity: 0;
}

.mega-menu li {
	width: 20%;
	float: left;
	position: relative;
}

.mega-menu li a {
	padding: 0;
}

.mega-menu li a:after {
	display: none;
}

header nav ul li:hover .mega-menu {
	visibility: visible;
	opacity: 1;
	margin-top: 0px;
	transition: .4s;
}

.news-feed,
.bl-featured-big {
	position: relative;
	overflow: hidden;
}

.news-feed:after,
.bl-featured-big:after {
	content: "";
	background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.80)));
	background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#a6000000', GradientType=0);
	position: absolute;
	bottom: -45%;
	left: 0;
	right: 0;
	height: 100%;
	width: 100%;
	z-index: 11;
	transition: .4s;
}

.news-feed h4 {
	font-size: 18px;
	font-weight: bold;
	color: #f8f8f8;
	position: absolute;
	left: 20px;
	bottom: 30px;
	text-transform: none;
	z-index: 77;
}

.news-feed p {
	font-size: 10px;
	font-weight: bold;
	text-transform: uppercase;
	color: #f8f8f8;
	position: absolute;
	left: 20px;
	bottom: 14px;
	margin: 0;
	font-family: 'Josefin Sans', 'Times New Roman', serif;
	z-index: 77;
}

.news-feed:hover:after,
.bl-featured-big:hover:after {
	position: absolute;
	bottom: -30%;
	left: 0;
	right: 0;
	height: 100%;
	width: 100%;
	z-index: 11;
	transition: .4s;
}

.sub-menu {
	padding: 25px 30px;
}

.sub-menu h3 {
	font-family: Oswald;
	font-size: 18px;
	color: #fff;
	text-transform: uppercase;
	margin: 0 0 11px;
	font-weight: 400;
}

.sub-menu ul {
	padding: 0;
}

.sub-menu ul li {
	float: none;
	width: 100%;
	margin-bottom: 10px;
	position: relative;
}

.sub-menu ul li:before {
	content: "";
	background: #795548;
	width: 7px;
	height: 7px;
	position: absolute;
	top: 7px;
	left: 0;
}

.sub-menu ul li a {
	color: #fff;
	background: transparent !important;
	padding-left: 20px;
}

.sub-menu ul li a:hover {
	color: #795548;
}

.sub-menu ul li a:before {
	display: none;
}

.sub-menu ul li:last-child {
	margin-bottom: 0;
}

/* 4.3. Header - Logo */

.header {
	background: #fff;
	border-bottom: 1px solid #dddddd;
	position: relative;
	margin-bottom: 30px;
}

@media (min-width: 992px) {}

#logo {
	background: #FBF0E1;
	/* New background color */
	padding-top: 0;
	padding-bottom: 0;
	/* Ensure height for centering */
	display: flex;
	align-items: center;
	justify-content: center;
}

.region-branding {
	text-align: center;
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

#logo .site-branding__name,
.logo h1 {
	font-family: 'Roboto Slab', serif;
	text-transform: uppercase;
	font-size: 60px;
	font-weight: 900;
	color: #000;
	text-shadow: 1px 2px rgba(0, 0, 0, 0.08);
	/* Updated shadow from recent changes */
	margin-bottom: 0;
	line-height: normal;
	/* Fix line-height */
}


#logo .site-branding__text {
	margin-top: 10px;
}

#logo .site-branding__name a {
	color: #000;
}

#logo .site-branding__name a:hover {
	color: #795548;
}

.path-frontpage h1 {
	display: none;
}

/* 4.4. News Ticker */
.block-breaking-news {
	padding: 20px 0 25px;
	border-left: 1px solid #dddddd;
	padding-left: 140px;
	position: relative;
	min-height: 120px;
	margin-bottom: 0;
}

.block-breaking-news h2.block-title {
	/* background: url(../images/nt.png) no-repeat; -- OLD image */
	background-color: #795548;
	width: 200px;
	height: 97px;
	position: absolute;
	top: 10px;
	left: -10px;
	color: #fff;
	font-size: 22px;
	margin: 0;
	padding: 20px;
	text-transform: uppercase;
	font-family: 'Oswald', Arial, Helvetica, sans-serif;
	text-shadow: 2px 3px rgba(0, 0, 0, 0.1);
}

.block-breaking-news .views-field-field-category a {
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
	color: #795548;
	font-family: "Josefin Sans", Arial, sans-serif;
}

.block-breaking-news .views-field-created {
	font-size: 10px;
	text-transform: uppercase;
	color: #777;
	margin: 7px 0 0;
	font-weight: 700;
	font-family: 'Josefin Sans', Arial, Helvetica, sans-serif;
}

.block-breaking-news .views-field-title {
	margin: 7px 0px 2px;
	font-size: 140%;
}

.views-slideshow-controls-bottom {
	position: absolute;
	right: 0;
	top: 50%;
}

.views-slideshow-controls-bottom .views_slideshow_controls_text_previous a {
	width: 20px;
	height: 20px;
	background-color: #fff;
	display: table;
	font-size: 0px;
	position: relative;
	position: absolute;
	right: 6px;
	top: 0;
	border: none;
}

.views-slideshow-controls-bottom .views_slideshow_controls_text_previous a:after {
	content: "\f106";
	font-family: 'FontAwesome';
	font-size: 12px;
	color: #000;
	width: 20px;
	height: 20px;
	text-align: center;
	line-height: 19px;
	border: solid 1px #777;
	display: table;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
}

.views-slideshow-controls-bottom .views_slideshow_controls_text_next a {
	width: 20px;
	height: 20px;
	background-color: #fff;
	display: table;
	font-size: 0px;
	position: relative;
	position: absolute;
	right: -15px;
	top: 0;
	border: none;
}

.views-slideshow-controls-bottom .views_slideshow_controls_text_next a:after {
	content: "\f107";
	font-family: 'FontAwesome';
	font-size: 12px;
	color: #000;
	width: 20px;
	height: 20px;
	text-align: center;
	line-height: 19px;
	border: solid 1px #777;
	display: table;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
}

.views-slideshow-controls-bottom .views_slideshow_controls_text_pause {
	display: none;
}

#news-ticker .slick-prev:hover:after,
#news-ticker .slick-next:hover:after {
	color: #795548;
	border-color: #795548;
}

/* 5. Homepage Styles */
.block {
	margin-bottom: 0px;
	float: left;
	width: 100%;
}

.block .field--name-field-image {
	text-align: center;
}

.main-content {
	padding-top: 0px;
	/* Reduced from 50px */
	padding-bottom: 50px;
}

.main-content h2.block-title {
	/* background: url(../images/sep.png) repeat-x center; -- OLD image separator */
	border-bottom: 2px solid #795548;
	height: 40px;
	/* Space for the border */
	position: relative;
	margin: 0 0 30px;
}

#block-views-block-article-latest-sidebar-block-1 h2.block-title {
	/* background: url(../images/sep.png) repeat-x center; -- OLD */
	border-bottom: 2px solid #795548;
	height: 40px;
	position: relative;
	margin: 0 0 30px;
	font-size: 14px;
}

.main-content h2.block-title span {
	background: #795548;
	height: 38px;
	text-wrap: nowrap;
	line-height: 38px;
	padding: 0 20px;
	text-align: center;
	font-size: 14px;
	font-weight: bold;
	color: #fff;
	font-family: 'Roboto Condensed', sans-serif;
	/* Clean condensed font */
	text-transform: uppercase;
	display: inline-block;
	/* Cleaner layout */
	position: absolute;
	/* Position over border */
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	/* Center perfectly */
}

.main-content .block-title-black h2.block-title span {
	background: #795548;
}

.region-sidebar-second .block {
	border-bottom: 1px solid #dddddd;
	border-left: 1px solid #dddddd;
	padding: 0 0 0 30px;
	float: left;
	margin-top: 19px;
}

.region-sidebar-second .block-adv {
	border: none;
	padding: 0;
}

.field--name-field-banner {
	text-align: center;
}

#block-blockbannersidebarsecond .field--name-field-banner img {
	padding: 25px;
	background: #e5e5e5;
}

.region-sidebar-second h2.block-title {
	margin-top: -20px;
	margin-left: -30px;
}

.views-field-title,
.field-title {
	font-family: "Playfair Display", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 700;
	font-size: 16px;
	font-weight: bold;
	line-height: 20px;
}

.views-field-title a,
.field-title a {
	color: #333;
}

.views-field-title a:hover,
.field-title a:hover {
	color: #795548;
}

.views-field-created .views-label {
	padding-right: 5px;
}

#block-gazeta-page-title {
	margin: 0;
}

h1.page-title {
	margin-bottom: 20px;
}

body.path-taxonomy #block-gazeta-page-title .content {
	border-bottom: 1px solid #000;
	margin: 20px 0 0;
}

body.path-taxonomy #block-gazeta-page-title .content h1 {
	background: #795548;
	/* Updated from black to brand red */
	color: #fff;
	padding: 10px 20px;
	text-transform: uppercase;
	font-size: 14px;
	display: inline-block;
	margin: 0;
	font-family: 'Roboto Condensed', sans-serif;
}

/* Block Slideshow Homepage */
.block-slideshow-homepage .views-row {
	position: relative;
}

.block-latest-news-by-category .views-row .views-field-field-image,
.block-featured-news .views-field-field-image,
.block-slideshow-homepage .views-row .views-field-field-image {
	position: relative;
	overflow: hidden;
}

.block-latest-news-by-category .views-row .views-field-field-image img,
.block-featured-news .views-field-field-image img,
.block-slideshow-homepage .views-row .views-field-field-image img {
	width: 100%;
}

.block-latest-news-by-category .views-row .views-field-field-image:after,
.block-featured-news .views-field-field-image:after,
.block-slideshow-homepage .views-row .views-field-field-image:after {
	content: "";
	background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.80)));
	background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#a6000000', GradientType=0);
	position: absolute;
	bottom: -45%;
	left: 0;
	right: 0;
	height: 100%;
	width: 100%;
	z-index: 1;
	transition: .4s;
}

.block-featured-news .field-content .fa-comments {
	display: none;
}

.field-header-info {
	display: none;
	position: absolute;
	z-index: 2;
	top: 20px;
	left: 20px;
	right: 20px;
	float: left;
	color: #fff;
	text-transform: uppercase;
	font-family: "Oswald", Arial, Helvetica, sans-serif;
}

.block-slideshow-homepage .views-row .field-footer-info {
	position: absolute;
	z-index: 2;
	bottom: 20px;
	left: 20px;
	right: 20px;
	float: left;
}

.block-slideshow-homepage .views-row .field-footer-info .field-category a {
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
	font-family: 'Roboto Condensed', sans-serif;
}

.block-slideshow-homepage .views-row .field-footer-info .field-title a {
	color: #fff;
	font-size: 30px;
	line-height: 30px;
	margin: 5px 0 15px;

}

.block-slideshow-homepage .views-row .field-footer-info .field-view-node a {
	color: #fff;
	display: table;
	float: right;
	font-family: 'Roboto Slab', serif;
	font-size: 12px;
	font-style: italic;
	padding-right: 30px;
	text-align: right;
	padding-top: 5px;
}

/* Block Featured News */
#block-views-block-article-latest-sidebar-block-1-2 h2.block-title span,
#block-views-block-article-featured-block-1 h2.block-title span {
	background: #795548;
}

.block-featured-news .views-row {
	margin-bottom: 20px;
}

.block-featured-news .views-field-field-image {
	position: relative;
	margin-bottom: 15px;
}

.block-featured-news .views-field-field-image .field-category {
	position: absolute;
	z-index: 1;
	top: 10px;
	left: 20px;
}

.block-featured-news .views-field-field-image .field-category a {
	color: #fff;
	font-size: 12px;
	text-transform: uppercase;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: bold;
}

.block-featured-news .views-field-field-image .field-comment-count {
	position: absolute;
	z-index: 1;
	top: 10px;
	right: 20px;
	color: #fff;
}

.block-featured-news .views-field-title a {
	color: #333;
	font-size: 22px;
	line-height: 26px;
	margin: 15px 0 5px;
}

.block-featured-news .views-field-title a:hover {
	color: #795548;
}

.block-featured-news .views-field-created {
	color: #999999;
	font-size: 10px;
	font-style: normal;
	font-weight: bold;
	margin-bottom: 10px;
	margin-top: 5px;
	text-transform: uppercase;
}

@media only screen and (min-width: 996px) {
	.block-featured-news .views-row {
		width: 47%;
		float: left;
	}

	.block-featured-news .views-row:nth-child(2n+1) {
		clear: left;
		margin-right: 6%;
	}
}

/* Block latest news */
#block-views-block-article-latest-sidebar-block-1 h2.block-title span {
	color: #fff;
	background: #795548;
}

.block-latest-news .view-content .views-row {
	margin-bottom: 20px;
	padding-bottom: 20px;
	position: relative;
}

.block-latest-news .view-content .views-row:after {
	border-bottom: 1px solid #eee;
	border-top: 1px solid #eee;
	background: #000;
	height: 3px;
	content: "";
	width: 130px;
	margin: 0 auto;
	position: absolute;
	bottom: 0;
	left: 50%;
	margin-left: -65px;
}

.block-latest-news .view-content .views-field-field-image {
	position: relative;
}

.block-latest-news .view-content .views-field-field-image img {
	width: 100%;
}

.block-latest-news .view-content .views-field-field-image .field-category {
	position: absolute;
	top: 13px;
	left: 0;
	right: 0;
	text-align: center;
}

.block-latest-news .view-content .views-field-field-category {
	text-align: center;
}

.block-latest-news .view-content .views-field-field-image .field-category a,
.block-latest-news .view-content .views-field-field-category a {
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
	color: #fff;
	font-family: 'Roboto Condensed', sans-serif;
}

.block-latest-news .view-content .views-field-field-category a {
	color: #795548;
}

.block-latest-news .view-content .views-field-created {
	font-size: 10px;
	text-transform: uppercase;
	color: #777;
	margin: 0;
	padding: 10px 0 5px;
	text-align: center;
	font-weight: 700;
	font-weight: 700;
}

.block-latest-news .views-field-title {
	text-align: center;
	margin: 0px;
	font-size: 16px;
	margin: 0;
}

/* Block popular news */
#block-views-block-article-popular-news-block-1 h2.block-title span {
	color: #fff;
	background: #795548;
}

.block-popular-news .views-row {
	border-bottom: 1px dotted #7f7f7f;
	padding-bottom: 20px;
	margin-bottom: 20px;
	float: left;
	width: 100%;
}

.block-popular-news .views-row:last-child {
	border: none;
	margin-bottom: 0;
}

.block-popular-news .views-row .views-field-field-image {
	float: left;
	margin-right: 12px;
	width: 120px;
	flex-shrink: 0;
}

.block-popular-news .views-row .views-field-field-image img {
	width: 120px;
	height: 85px;
	object-fit: cover;
	display: block;
}

.block-popular-news .views-row .views-field-field-category a {
	color: #795548;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 10px;
	font-weight: bold;
	margin: 0;
	text-transform: uppercase;
}

.block-popular-news .views-row .views-field-title,
.block-popular-news .views-row .views-field-subject {
	font-size: 15px;
	line-height: 20px;
	font-family: 'Roboto Slab', serif;
	font-weight: 700;
}

.block-popular-news .views-row .views-field-subject a {
	color: #000;
}

.block-popular-news .views-row .views-field-subject a:hover {
	color: #795548;
}

/* Block latest by Category */
#content-bottom h2.block-title {
	text-align: left;
}

#content-bottom h2.block-title span {
	position: relative;
	margin: 0;
}

#content-bottom h2.block-title span:after {
	/* background: rgba(0, 0, 0, 0) url("../images/cb-ribbon.png") no-repeat scroll 0 0; -- OLD */
	background: #795548;
	width: 4px;
	content: "";
	display: none;
	height: 13px;
	position: absolute;
	right: -7px;
	top: 0;
	width: 8px;
}

@media only screen and (min-width: 996px) {
	.block-latest-news-by-category .view-content {
		width: 48%;
		float: left;
		margin-right: 4%;
	}

	.block-latest-news-by-category .attachment {
		float: left;
		width: 48%;
	}

	.block-latest-news-by-category .attachment .view-content {
		width: 100%;
		margin: 0;
	}
}

.block-latest-news-by-category .views-row {
	position: relative;
}

.block-latest-news-by-category .views-row .field-footer-info {
	position: absolute;
	z-index: 2;
	bottom: 20px;
	left: 20px;
	right: 20px;
	float: left;
}

.block-latest-news-by-category .views-row .field-title a {
	font-size: 22px;
	color: #fff;
	margin: 5px 0 15px;
}

.block-latest-news-by-category .views-row .field-footer-info .field-created {
	color: #fff;
	font-size: 10px;
	font-weight: bold;
	margin: 10px 0 0;
	text-transform: uppercase;
}

.block-latest-news-by-category .views-row .views-field-field-category a {
	color: #795548;
	display: table;
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
	font-family: 'Roboto Condensed', sans-serif;
}

.block-latest-news-by-category .views-row .views-field-title {
	padding: 5px 0 15px;
}

.block-latest-news-by-category .views-row .views-field-title a {
	font-size: 22px;
	line-height: 26px;
}

.block-latest-news-by-category .views-row .views-field-created {
	color: #999999;
	display: table;
	font-size: 10px;
	font-style: normal;
	font-weight: bold;
	margin-bottom: 10px;
	text-transform: uppercase;
}

.block-latest-news-by-category .views-row .views-field-comment-count {
	position: absolute;
	top: 20px;
	left: 20px;
	z-index: 2;
	color: #fff;
	font-weight: bold;
	text-transform: uppercase;
}

.block-latest-news-by-category .view-content ul {
	margin-top: 20px;
}

.block-latest-news-by-category .view-content ul li:before {
	background: #e00000 none repeat scroll 0 0;
	content: "";
	height: 7px;
	left: 0;
	position: absolute;
	top: 17px;
	width: 7px;
}

.block-latest-news-by-category .view-content ul li:first-child {
	border-top: 1px dotted #3f3f3f;
}

.block-latest-news-by-category .view-content ul li {
	border-bottom: 1px dotted #3f3f3f;
	float: none;
	margin: 0;
	padding: 9px 0 12px 20px;
	position: relative;
	width: 100%;
}

.block-latest-news-by-category .view-content ul li .views-field-title a {
	color: #000000;
	font-size: 16px;
	font-weight: bold;
	line-height: 20px;
}

.block-latest-news-by-category .view-content ul li .views-field-title a:hover {
	color: #795548;
}

/* Block All categories */
#panel-first {
	padding-bottom: 50px;
	/* background: url(../images/pat1.png); -- OLD pattern */
	background: #fafafa;
	padding-top: 0px;
	margin-top: 80px;
	position: relative;
	z-index: 0;
}

.block-all-categories h2.block-title {
	margin: -15px -15px 40px;
	border-bottom: 1px solid #ddd;
	/* Clean separator */
	text-align: center;
	font-size: 15px;
	position: relative;
	height: 20px;
}

.block-all-categories h2.block-title span {
	background: #795548;
	color: #fff;
	padding: 10px 20px;
	text-transform: uppercase;
	font-weight: normal;
	display: inline-block;
}

.view-all-categories .view-content .views-row {
	float: left;
	padding: 15px;
	width: 100%;
	position: relative;
}

.view-all-categories .view-content .views-row .views-field-field-image {
	position: relative;
	overflow: hidden;
}

.view-all-categories .view-content .views-row .views-field-field-image:after {
	content: "";
	background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	/* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.80)));
	/* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	/* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	/* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	/* IE10+ */
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	/* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#a6000000', GradientType=0);
	/* IE6-9 */
	position: absolute;
	bottom: -45%;
	left: 0;
	right: 0;
	height: 100%;
	width: 100%;
	z-index: 1;
	transition: .4s;
}

.view-all-categories .view-content .views-row .views-field-field-image:hover:after {
	bottom: -30%;
}

@media only screen and (min-width: 996px) {
	.view-all-categories .attachment .views-element-container {
		float: left;
		width: 50%;
	}

	.view-all-categories .attachment .view-content {
		width: 100%;
		padding: 0;
	}

	.view-all-categories .view-content .views-row {
		float: left;
		width: 25%;
	}

	.view-all-categories .attachment .view-all-categories-attachment-2 .views-row {
		width: 50%;
	}

	.view-all-categories .attachment .view-all-categories-attachment-1 .views-row {
		width: 100%;
	}

	.view-all-categories .attachment .view-all-categories-attachment-2 .views-row:nth-child(2n+1),
	.view-all-categories .views-row:nth-child(4n+1) {
		clear: left;
	}
}

.view-all-categories .view-content .views-row .field-comment-count {
	position: absolute;
	z-index: 2;
	top: 15px;
	left: 15px;
	float: left;
	color: #fff;
	font-family: "Oswald", Arial, Helvetica, sans-serif;
	text-transform: uppercase;
}

.view-all-categories .view-content .views-row .field-footer-info {
	position: absolute;
	z-index: 2;
	bottom: 15px;
	left: 15px;
	right: 15px;
	float: left;
}

.view-all-categories .view-content .views-row .field-image img {
	width: 100%;
}

.view-all-categories .view-content .views-row .field-footer-info .field-category a {
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
}

.view-all-categories .view-content .views-row .field-footer-info .field-category a {
	font-size: 10px;
	font-family: 'Roboto Condensed', sans-serif;
}

.view-all-categories .view-content .views-row .field-footer-info .field-title a {
	color: #fff;
	margin: 5px 0 15px;
	font-size: 18px;
	line-height: 18px;
}

.view-all-categories .attachment .view-all-categories-attachment-1 .view-content .views-row .field-footer-info .field-title a {
	font-size: 30px;
	line-height: 30px;
}

.view-all-categories .view-content .views-row .field-footer-info .views-field-view-node a {
	color: #fff;
	display: table;
	float: right;
	font-family: "Playfair Display", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 14px;
	font-style: italic;
	padding-right: 30px;
	text-align: right;
	margin-top: 5px;
}

/* Block Newsletter */
#block-simplenewssubscription #edit-message {
	/* background: url(../images/newsletter.jpg) 0 0 no-repeat; -- OLD */
	background: #f8f8f8;
	border: 1px solid #e0e0e0;
	border-top: 3px solid #795548;
	padding: 20px;
	min-height: 148px;
	margin-bottom: 0;
	font-style: italic;
	font-family: 'Roboto Slab', serif;
}

#block-simplenewssubscription #edit-mail-wrapper {
	position: relative;
	margin: 20px 0;
}

#block-simplenewssubscription #edit-mail-wrapper:after {
	background: #FFF;
	border: 1px solid #ddd;
	content: "";
	position: absolute;
	top: 6px;
	left: 6px;
	width: 100%;
	height: 100%;
	z-index: 1;
}

#block-simplenewssubscription #edit-mail-wrapper:before {
	background: #FFF;
	border: 1px solid #ddd;
	content: "";
	position: absolute;
	top: 3px;
	left: 3px;
	width: 100%;
	height: 100%;
	z-index: 2;
}

#block-simplenewssubscription #edit-mail-wrapper .form-type-email {
	background: #f4f4f4;
	border: 1px solid #ddd;
	padding: 20px;
	z-index: 3;
	position: relative;
}

#block-simplenewssubscription #edit-mail-wrapper .form-email {
	max-width: 100%;
}


/* Photo Gallery */
.view-list-galleries .views-row {
	position: relative;
	float: left;
	width: 100%;
	margin-bottom: 30px;
}

.view-list-galleries .views-row:before {
	content: "";
	position: absolute;
	top: 3px;
	right: -3px;
	width: 100%;
	height: 100%;
	border-right: 1px solid #333;
	border-bottom: 1px solid #333;
}

.view-list-galleries .views-row:after {
	content: "";
	position: absolute;
	top: 6px;
	right: -6px;
	width: 100%;
	height: 100%;
	border-right: 1px solid #333;
	border-bottom: 1px solid #333;
}

.view-list-galleries .views-row .views-field-field-images {
	overflow: hidden;
	position: relative;
}

.view-list-galleries .views-row .views-field-field-images:after {
	content: "";
	background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	/* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.80)));
	/* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	/* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	/* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	/* IE10+ */
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.80) 100%);
	/* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#a6000000', GradientType=0);
	/* IE6-9 */
	position: absolute;
	bottom: -45%;
	left: 0;
	right: 0;
	height: 100%;
	width: 100%;
	z-index: 1;
	transition: .4s;
}

.view-list-galleries .views-row .views-field-field-images:hover:after {
	position: absolute;
	bottom: -30%;
	left: 0;
	right: 0;
	height: 100%;
	width: 100%;
	z-index: 1;
	transition: .4s;
}

.view-list-galleries .views-row .views-field-field-images img {
	width: 100%;
}

@media only screen and (min-width: 768px) {
	.view-list-galleries .views-row {
		width: 47%;
	}

	.view-list-galleries .views-row:nth-child(2n+1) {
		clear: left;
		margin-right: 6%;
	}

}

.view-list-galleries .views-row .views-field-title {
	position: absolute;
	bottom: 20px;
	left: 20px;
	right: 20px;
	z-index: 5;
}

.view-list-galleries .views-row .views-field-title a {
	font-family: 'Roboto Slab', serif;
	font-style: italic;
	font-weight: bold;
	color: #fff;
	font-size: 30px;
}

/* Block Gallery */
.block-list-galleries .views-row {
	float: left;
	width: 150px;
	padding: 10px 0;
}

@media only screen and (min-width: 996px) {
	.block-list-galleries .views-row {
		width: 30%;
	}

	.block-list-galleries .views-row:nth-child(3n+1) {
		clear: left;
	}

	.block-list-galleries .views-row:nth-child(3n+2) {
		width: 40%;
		padding-left: 5%;
		padding-right: 5%;
	}
}


/* 7. Banner Styles */
.panel-second {
	background: #fff;
	padding: 40px 0 20px;
	border-bottom: 3px solid #f4f4f4;
	border-top: 1px solid #DDD;
}

.big-banner a {
	display: table;
	margin: 0 auto;
}

/* Panel 3 */
#panel-third {
	border-top: 1px solid #ddd;
}

.panel-third .region {
	padding: 30px 10px;
	float: left;
	width: 100%;
}

.panel-third .panel-third-widget {
	padding-bottom: 1000px;
	margin-bottom: -1000px;
}

.panel-third .row {
	overflow: hidden;
}

.panel-third .panel-third-1,
.panel-third .panel-third-2 {
	border-right: 1px solid #eee;
}

.panel-third h2.block-title {
	color: #333;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 14px;
	font-weight: bold;
	margin-top: 0;
	text-transform: uppercase;
}

/* 8. Footer Styles */

footer {
	border-top: 1px solid #ddd;
	padding: 0 !important;
}

.footer-widget {
	padding: 30px;
	border-right: 1px solid #ddd;
	min-height: 457px;
}

.footer-logo h3 {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 36px;
	font-weight: bold;
	color: #fff;
	/* text-shadow: 3px 4px #f4f4f4; -- OLD muddy shadow */
	text-transform: uppercase;
	margin: 5px 0 0;
	display: table;
}

.footer-logo p {
	font-family: 'Roboto', sans-serif;
	color: #aaa;
	line-height: 22px;
	font-size: 14px;
	margin: 0 0 65px;
	position: relative;
}

.footer-logo p b {
	text-transform: uppercase;
	color: #eee;
}

.footer-logo p a {
	color: #aaa;
	text-decoration: none;
	transition: color 0.2s;
}

.footer-logo p a:hover {
	color: #795548;
}

.footer-logo p:after {
	content: "";
	background: #795548;
	width: 48px;
	height: 1px;
	position: absolute;
	bottom: -40px;
	left: 0;
}

/* Node detail */
h2.node__title a {
	color: #333;
}

h2.node__title a:hover {
	color: #795548;
}

.node-image {
	margin-bottom: 20px;
}

iframe {
	max-width: 100%;
}

.node-image .flexslider {
	background: #232323 none repeat scroll 0 0;
	padding: 20px;
	position: relative;
}

.content-author-info {
	text-align: center;
}

.block-author .views-row {
	position: relative;
	padding-left: 100px;
}

.block-author .views-row {
	padding-top: 20px;
	padding-bottom: 20px;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
}

.block-author .views-field-user-picture {
	margin-bottom: 10px;
	position: absolute;
	top: 20px;
	left: 0;
}

article.profile .field--name-user-picture img,
.block-author .views-field-user-picture img {
	width: 80px;
	height: 80px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
}

article.profile .field--name-field-user-name,
.node-author-name,
.block-author .views-field-field-user-name {
	margin-bottom: 20px;
}

.node-author-name {
	margin-top: 20px;
}

article.profile .field--name-field-user-name,
.node-author-name a,
.block-author .views-field-field-user-name a {
	color: #060607;
	font-family: 'Roboto Slab', serif;
	font-size: 16px;
	font-style: italic;
	font-weight: bold;
}

.content-author-info .node-created {
	color: #999;
	font-family: 'Roboto Slab', serif;
	font-size: 20px;
	font-style: italic;
	line-height: 20px;
	padding-top: 10px;
	text-align: center;
}

.create-date-day {
	font-size: 60px;
	line-height: 50px;
	padding-bottom: 10px;
}

.field--name-field-category {
	float: left;
	width: 100%;
	margin: 5px 0;
}

/* Professional Tag Styling */
.field--name-field-tags {
	margin-top: 30px;
	padding-top: 20px;
	border-top: 1px solid #eee;
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 15px;
	width: 100%;
	float: none;
	clear: both;
}

/* Label */
.field--name-field-tags .field__label {
	font-weight: 700;
	margin-right: 0;
	color: #333;
	text-transform: uppercase;
	font-size: 14px;
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
	font-family: 'Roboto Condensed', sans-serif;
}

.field--name-field-tags .field__label::before {
	content: "\f02b";
	/* FontAwesome tag icon */
	font-family: FontAwesome;
	margin-right: 8px;
	color: #795548;
	/* Theme brown accent */
	font-weight: normal;
	font-size: 14px;
}

/* Items Container */
.field--name-field-tags .field__items {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	/* Spacing between tags */
	align-items: center;
}

/* Individual Tag Item */
.field--name-field-tags .field__items .field__item {
	display: inline-flex;
	margin: 0;
}

/* Tag Links */
.field--name-field-tags .field__item a {
	display: inline-block;
	padding: 6px 14px;
	background-color: #f9f9f9;
	color: #555;
	border-radius: 4px;
	text-decoration: none;
	font-size: 13px;
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	transition: all 0.2s ease;
	border: 1px solid #e0e0e0;
	line-height: 1.4;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}

/* Hover Effect */
.field--name-field-tags .field__item a:hover {
	background-color: #795548;
	/* Theme Primary Color */
	color: #fff;
	border-color: #795548;
	box-shadow: 0 4px 8px rgba(121, 85, 72, 0.25);
	transform: translateY(-2px);
}

.node__links {
	margin: 5px 0;
	float: left;
	width: 100%;
	text-align: right;
}

.views-field-view-node a,
.node-readmore a {
	color: #795548;
	font-family: 'Roboto Slab', serif;
	font-size: 14px;
	font-style: italic;
	padding-right: 20px;
	position: relative;
}

.views-field-view-node a:before,
.node-readmore a:before {
	position: absolute;
	right: 0;
	top: 3px;
	font-family: fontawesome;
	content: "\f178";
}

li.comment-add a {
	float: right;
	background: #795548;
	color: #fff;
	padding: 5px 20px;
}

/* Comment */
.comments {
	margin-top: 30px;
}

article.comment {
	border-bottom: 1px solid #eee;
	padding: 20px;
	overflow: hidden;
}

h3.comment_title {
	margin-top: 0;
	font-size: 18px;
}

h3.comment_title a {
	color: #333;
	text-transform: uppercase;
}

.comment-author-picture {
	text-align: center;
	margin-bottom: -300px;
	padding-bottom: 300px;
	position: relative;
	z-index: 2;
	margin-top: 20px;
}

.comment-author-picture:before {
	background: #ddd none repeat scroll 0 0;
	content: "";
	height: 600px;
	left: 50%;
	margin-left: -1px;
	position: absolute;
	top: 0;
	width: 1px;
	z-index: -1;
}

.comment-author-picture .field--name-user-picture {
	margin-bottom: 10px;
	text-align: center;
}

.comment-author-picture .field--name-user-picture img {
	width: 80px;
	height: 80px;
	-webkit-border-radius: 40px;
	-moz-border-radius: 40px;
	border-radius: 40px;
}

.comment__meta {
	padding-bottom: 10px;
	color: #999;
}

.comment__permalink {
	display: none;
}

.comment__content nav {
	text-align: right;
}

h2.comment-form__title {
	padding: 0 20px;
}

form#comment-form {
	margin: 0 20px;
}

/* Comment block on Footer */
#block-views-block-comments-recent-block-1 .content {
	margin-top: 20px;
}

/* Block Author on Node detail */
.field--name-field-author,
#block-views-block-author-block-1 {
	border-top: 1px solid #333;
	border-bottom: 1px solid #333;
	padding: 20px 0 0;
	margin: 30px 0;
	float: left;
	width: 100%;
}

.field--name-field-author .views-field-user-picture,
#block-views-block-author-block-1 .views-field-user-picture {
	margin-bottom: 10px;
	text-align: center;
	float: left;
	margin-right: 20px;
}

.field--name-field-author .views-field-user-picture img,
#block-views-block-author-block-1 .views-field-user-picture img {
	width: 80px;
	height: 80px;
	-webkit-border-radius: 40px;
	-moz-border-radius: 40px;
	border-radius: 40px;
}

.field--name-field-author .views-field-field-user-name a,
#block-views-block-author-block-1 .views-field-field-user-name a {
	color: #333;
	font-family: 'Roboto Slab', serif;
	font-size: 16px;
	font-style: italic;
	font-weight: bold;
	margin-top: 5px;
}

/* --- Row base: use CSS Grid for precise placement --- */
.view-list-articles .view-content>.views-row {
	display: grid;
	grid-template-columns: 220px 1fr;
	column-gap: 20px;
	row-gap: 0;
	padding: 18px 0;
	border-bottom: 1px solid #eee;
	margin-bottom: 0;
	float: none;
	width: 100%;
	align-items: start;
}

.view-list-articles .view-content>.views-row:last-child {
	border-bottom: none;
}

/* --- Hide the old giant date column --- */
.view-list-articles .view-content>.views-row>.views-field-created-2,
.view-list-articles .view-content>.views-row>.views-field-created {
	display: none !important;
}

/* --- Image: column 1, spans all rows --- */
.view-list-articles .view-content>.views-row>.views-field-field-image,
.view-list-articles .view-content>.views-row>.views-field-field-video {
	grid-column: 1;
	grid-row: 1 / 5;
	overflow: hidden;
	border-radius: 4px;
}

.view-list-articles .view-content>.views-row>.views-field-field-image img {
	width: 100%;
	height: auto;
	display: block;
	object-fit: cover;
	aspect-ratio: 16/10;
	transition: transform 0.3s ease;
}

.view-list-articles .view-content>.views-row>.views-field-field-image:hover img {
	transform: scale(1.05);
}

/* --- Title: column 2, row 1 --- */
.view-list-articles .view-content>.views-row>.views-field-title {
	grid-column: 2;
	grid-row: 1;
	position: static;
	margin-bottom: 0;
}

.view-list-articles .view-content>.views-row>.views-field-title:after {
	display: none;
}

.view-list-articles .view-content>.views-row>.views-field-title a {
	font-size: 17px;
	font-weight: 700;
	line-height: 1.4;
	color: #1a1a1a;
	text-decoration: none;
	transition: color 0.2s;
	font-family: 'Roboto Slab', serif;
}

.view-list-articles .view-content>.views-row>.views-field-title a:hover {
	color: #795548;
}

/* --- Hide "Continue reading" link --- */
.view-list-articles .view-content>.views-row>.views-field-view-node {
	display: none;
}

/* --- Injected mo_ta: column 2, row 2 --- */
.views-field-mo-ta {
	grid-column: 2;
	grid-row: 2;
	font-size: 13px;
	line-height: 1.5;
	color: #666;
	margin-top: 6px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* --- Injected compact date: column 2, row 3 --- */
.views-field-date-compact {
	grid-column: 2;
	grid-row: 3;
	font-size: 12px;
	color: #999;
	margin-top: 4px;
}

.views-field-date-compact .fa {
	margin-right: 4px;
}

/* --- ATTACHMENT: First/Featured Article (big, side by side) --- */
.view-list-articles .attachment .view-content>.views-row {
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	padding: 0 0 25px;
	margin-bottom: 25px;
	border-bottom: 2px solid #eee;
}

/* Hide date in attachment */
.view-list-articles .attachment .views-row>.views-field-created-2,
.view-list-articles .attachment .views-row>.views-field-created {
	display: none !important;
}

/* Image: left side, ~50% */
.view-list-articles .attachment .views-field-field-image {
	flex: 0 0 50%;
	max-width: 50%;
	margin-right: 20px;
	margin-bottom: 0;
	float: none;
	overflow: hidden;
	border-radius: 4px;
}

.view-list-articles .attachment .views-field-field-image img {
	width: 100%;
	height: auto;
	display: block;
	object-fit: cover;
}

/* Title: right side */
.view-list-articles .attachment .views-field-title {
	flex: 1;
	min-width: 0;
	float: none;
	width: auto !important;
	position: static;
	margin-bottom: 0;
}

.view-list-articles .attachment .views-field-title:after {
	display: none;
}

.view-list-articles .attachment .views-field-title a {
	font-size: 24px;
	font-weight: 700;
	line-height: 1.3;
	color: #1a1a1a;
	font-family: 'Roboto Slab', serif;
}

.view-list-articles .attachment .views-field-title a:hover {
	color: #795548;
}

.view-list-articles .attachment .views-field-view-node {
	display: none;
}

/* Injected mo_ta and date in attachment - below title, right side */
.view-list-articles .attachment .views-field-mo-ta {
	width: calc(50% - 20px);
	margin-left: auto;
	margin-right: 0;
	font-size: 14px;
	line-height: 1.6;
	color: #555;
	margin-top: 10px;
}

.view-list-articles .attachment .views-field-date-compact {
	width: calc(50% - 20px);
	margin-left: auto;
	margin-right: 0;
	margin-top: 8px;
}

/* Attachment node teaser (if rendered as entity instead of fields) */
.view-list-articles .attachment .node--view-mode-teaser {
	display: flex !important;
	align-items: flex-start;
}

.view-list-articles .attachment .node--view-mode-teaser .node-image {
	flex: 0 0 50%;
	max-width: 50%;
	margin-right: 20px;
	margin-bottom: 0;
}

.view-list-articles .attachment .node--view-mode-teaser .row {
	flex: 1;
	margin: 0;
}

.view-list-articles .attachment .node--view-mode-teaser .node-header h2.node__title {
	font-size: 24px;
	line-height: 1.3;
	margin: 0 0 10px;
}

.view-list-articles .attachment .node--view-mode-teaser .node-header h2.node__title a {
	color: #1a1a1a;
	font-family: 'Roboto Slab', serif;
}

.view-list-articles .attachment .node--view-mode-teaser .field-mo-ta-summary {
	font-size: 14px;
	line-height: 1.6;
	color: #555;
}

/* --- First article BIG when no attachment (page 2+) --- */
.view-list-articles>.view-content:first-child>.views-row:first-child {
	grid-template-columns: 1fr 1fr;
	column-gap: 20px;
	padding-bottom: 25px;
	margin-bottom: 5px;
	border-bottom: 2px solid #eee;
}

.view-list-articles>.view-content:first-child>.views-row:first-child>.views-field-field-image img {
	aspect-ratio: 16/10;
}

.view-list-articles>.view-content:first-child>.views-row:first-child>.views-field-title a {
	font-size: 24px;
	font-family: 'Roboto Slab', serif;
}

.view-list-articles>.view-content:first-child>.views-row:first-child .views-field-mo-ta {
	font-size: 14px;
	line-height: 1.6;
}


/* --- Responsive mobile --- */
@media (max-width: 768px) {
	.view-list-articles .view-content>.views-row {
		grid-template-columns: 1fr;
	}

	.container .col-md-3,
	.container .col-md-8 {
		padding: 0 !important;
	}

	.block-views-blockarticle-latest-sidebar-block-1 .block-title {
		display: none;
	}

	.sidebar {
		padding: 0 !important;
	}

	/* First article big on page 2+ also stacks on mobile */
	.view-list-articles>.view-content:first-child>.views-row:first-child {
		grid-template-columns: 1fr;
	}

	.view-list-articles .view-content>.views-row>.views-field-field-image,
	.view-list-articles .view-content>.views-row>.views-field-field-video {
		grid-column: 1;
		grid-row: auto;
		max-width: 100%;
		margin-bottom: 10px;
	}

	.views-field-mo-ta,
	.views-field-date-compact {
		grid-column: 1;
		grid-row: auto;
	}

	/* Attachment also stacks on mobile */
	.view-list-articles .attachment .view-content>.views-row {
		flex-direction: column;
	}

	.view-list-articles .attachment .views-field-field-image {
		flex: none;
		max-width: 100%;
		margin-right: 0;
		margin-bottom: 12px;
	}

	.view-list-articles .attachment .views-field-mo-ta,
	.view-list-articles .attachment .views-field-date-compact {
		width: 100% !important;
		margin-left: 0 !important;
	}

	.view-list-articles .attachment .node--view-mode-teaser {
		flex-direction: column;
	}

	.view-list-articles .attachment .node--view-mode-teaser .node-image {
		flex: none;
		max-width: 100%;
		margin-right: 0;
		margin-bottom: 12px;
	}
}

/* --- node-header in node-teaser on taxonomy pages --- */
.view-list-articles .node-header h2.node__title {
	margin-bottom: 8px;
}

/* Video */
.view-list-video .views-row {
	float: left;
	width: 100%;
	border-bottom: 1px dotted #333;
	margin-bottom: 30px;
	padding-bottom: 20px;
}

@media only screen and (min-width: 996px) {
	.view-list-video .views-row {
		width: 48%;
	}

	.view-list-video .views-row:nth-child(2n+1) {
		clear: left;
	}

	.view-list-video .attachment .views-row {
		width: 100%;
		margin-right: 0;
	}
}

.view-list-video .attachment .views-row .views-field-title a {
	font-size: 36px;
	font-weight: bold;
	line-height: 36px;
	margin: 15px 0 25px;
}

.view-list-video .views-row .views-field-counter,
.view-list-video .views-row .views-field-created {
	color: #777;
	font-family: Oswald;
	text-transform: uppercase;
	font-size: 12px;
	padding-top: 10px;
}

.block-featured-video .views-row {
	border-bottom: 1px dotted #333;
	margin-bottom: 20px;
	padding-bottom: 20px;
	float: left;
	width: 100%;
}

.block-featured-video .attachment .views-row:last-child {
	border-top: 0px dotted #333;
	margin-bottom: 20px;
}

.views-row .views-field-field-video {
	margin-bottom: 10px;
	float: left;
	width: 100%;
}

.block-featured-video .attachment .views-row .views-field-field-video {
	float: left;
	margin-bottom: 20px;
	width: 100%;
}

.views-field-field-video a {
	position: relative;
	float: left;
}

.views-field-field-video a:before {
	position: absolute;
	z-index: 1;
	content: "";
	color: #fff;
	vertical-align: middle;
	float: left;
	height: 38px;
	width: 38px;
	bottom: 20px;
	right: 20px;
	margin-top: -20px;
	/* background: url(../images/play-small.png) 0 0 no-repeat; -- OLD */
	background: none;
	content: "\f04b";
	/* FontAwesome Play */
	font-family: 'FontAwesome';
	font-size: 30px;
	line-height: 38px;
	text-align: center;
}

.views-field-field-video a img {
	width: 100%;
}

.block-featured-video .attachment .views-row .views-field-field-video a:before {
	font-size: 30px;
	margin-top: -15px;
}

.block-featured-video .views-row .views-field-title {
	position: relative;
	padding-left: 30px;
}

.block-featured-video .attachment .views-row .views-field-title {
	padding-left: 0;
}

.block-featured-video .views-row .views-field-title i {
	color: #f50044;
	position: absolute;
	left: 0;
	top: 3px;
}

.block-featured-video .views-row .views-field-created {
	color: #999999;
	font-size: 10px;
	font-style: normal;
	font-weight: bold;
	text-transform: uppercase;
	margin-top: 5px;
}

/* Block Your Opinion */

.opt-inner {
	background: #00aced;
	padding: 28px 30px 20px;
	-webkit-box-shadow: 3px 4px #f4f4f4;
	-moz-box-shadow: 3px 4px #f4f4f4;
	box-shadow: 3px 4px #f4f4f4;
	position: relative;
}

.opt-inner p {
	font-family: Playfair Display;
	font-size: 18px;
	font-weight: bold;
	font-style: italic;
	color: #fff;
	line-height: 24px;
	letter-spacing: -0.2px;
	position: relative;
}

.opt-inner:after {
	content: "";
	/* background: url("../images/opt.png") no-repeat; -- OLD */
	content: "\f10e";
	/* FontAwesome Quote Right */
	font-family: 'FontAwesome';
	font-size: 24px;
	color: #fff;
	bottom: -30px;
	left: 70px;
}

.opt-inner p a {
	color: #aafcff;
}

.opt-inner em {
	color: #ffffff;
	font-family: Arial;
	font-style: normal;
	font-size: 12px;
}

.opt-inner em a {
	color: #fff;
}

.opi-inner {
	background-color: #fff;
	-webkit-box-shadow: 3px 4px #f4f4f4;
	-moz-box-shadow: 3px 4px #f4f4f4;
	box-shadow: 3px 4px #f4f4f4;
	border: solid 1px #ddd;
	padding: 30px 30px 20px;
	position: relative;
}

.opi-inner:after {
	content: "";
	/* background: url("../images/opi.png") no-repeat; -- OLD */
	content: "\f075";
	/* FontAwesome Comment */
	font-family: 'FontAwesome';
	font-size: 24px;
	color: #ddd;
	bottom: -30px;
	left: 70px;
}

.opi-inner em {
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
	color: #333;
	font-style: normal;
}

.opi-inner em span {
	font-style: italic;
	color: #656565;
	text-transform: none;
}

.opi-inner p {
	font-family: Playfair Display;
	font-size: 18px;
	font-weight: bold;
	font-style: italic;
	color: #333333;
	line-height: 24px;
	padding: 10px 0 10px;
}

.ico {
	width: 60px;
	height: 60px;
	border: 5px solid #dddddd;
	border-radius: 50%;
	margin: 20px 0 0 10px;
	display: table;
	color: #00aced;
	line-height: 50px;
	font-size: 30px;
	text-align: center;
	background: #fff;
}

/* Block Poll */
#block-pollingbox .poll-question {
	margin-top: 0;
}

.vote-form input[type=radio].form-radio {
	position: absolute;
	z-index: -1000;
	left: -1000px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	height: 1px;
	width: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
}

.vote-form input[type=radio].form-radio+label.option {
	padding-left: 30px;
	height: 15px;
	display: inline-block;
	line-height: 15px;
	background-repeat: no-repeat;
	background-position: 0 0;
	font-size: 14px;
	font-family: Arial;
	color: #333333;
	font-weight: normal;
	vertical-align: middle;
	cursor: pointer;
}

.vote-form input[type=radio].form-radio:checked+label.option {
	background-position: 0 -15px;
}

.vote-form label.option {
	background-image: url(../images/cbox.png);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

input.form-submit {
	/* background: #2980b9 none repeat scroll 0 0; -- OLD Blue */
	background: #795548;
	border: none;
	color: #fff;
	display: inline-block;
	font-weight: bold;
	height: 40px;
	line-height: 40px;
	margin: 0 5px;
	padding: 0 30px;
	text-transform: uppercase;
	transition: 0.3s;
}

input.form-submit:hover {
	background: #b00000;
}

.vote-form input#edit-result {
	background: #2c3e50;
}

.vote-form #edit-choice--wrapper .fieldset-wrapper {
	margin-top: 20px;
}

/* About us */
.view-list-members .views-row {
	padding: 20px 0;
	border-bottom: 1px solid #ddd;
	position: relative;
	padding-left: 180px;
	min-height: 200px;
}

.view-list-members .views-row .views-field-field-image {
	width: 160px;
	float: left;
	position: absolute;
	top: 20px;
	left: 0;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
}

.view-list-members .views-row .views-field-field-image img {
	width: 160px;
	float: left;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
}

.view-list-members .views-row .views-field-title {
	font-family: 'Roboto Slab', serif;
	font-size: 18px;
	font-weight: bold;
	color: #333;
	margin: 0px 0 10px;
	text-transform: none;
}

.view-list-members .views-row .views-field-field-position {
	font-size: 13px;
	font-weight: bold;
	color: #999;
	text-transform: uppercase;
	margin: -5px 0 10px;
	display: table;
}

.block-contributors .views-row {
	float: left;
	margin: 2.5%;
	width: 20%;
}

.block-contributors .view-content {
	padding-bottom: 20px;
	overflow: hidden;
}

/* User page */
body.path-user article.profile {
	background: #f4f4f4 none repeat scroll 0 0;
	padding: 30px;
	text-align: center;
}

body.path-user article.profile .label {
	color: #000;
}

body.path-user article.profile .field--name-user-picture {
	margin-bottom: 20px;
}

body.path-user article.profile .field--name-field-user-name {
	position: relative;
	margin-bottom: 30px;
}

body.path-user article.profile .field--name-field-user-name:after {
	position: absolute;
	width: 50px;
	height: 1px;
	border-bottom: 1px solid #000;
	bottom: -15px;
	left: 50%;
	margin-left: -25px;
	content: "";
}

/* Search Results */
ol.search-results {
	padding-left: 0;
}

ol.search-results li {
	border-bottom: 1px dotted #7f7f7f;
	padding-bottom: 20px;
	margin-bottom: 20px;
	margin-left: 0;
}

h3.search-result__title a {
	color: #000;
}

h3.search-result__title a:hover {
	color: #795548;
}

#search-form input.form-search {
	height: 40px;
	margin-left: 10px;
}

#search-form .search-advanced summary {
	padding: 1em;
}

/* Other style */
.sep1 {
	background: #000 none repeat scroll 0 0;
	display: table;
	height: 1px;
	margin: 15px auto 7px;
	width: 37px;
}

.quote {
	font-family: 'Roboto Slab', serif !important;
	font-size: 28px !important;
	font-weight: bold;
	font-style: italic;
	color: #333;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	padding: 10px 25px 15px;
	line-height: 35px !important;
	letter-spacing: -0.2px;
	text-align: center;
	margin-top: 25px;
	position: relative;
	margin-bottom: 15px;
}

.quote-fullwidth {
	padding: 10px 0px 15px;
}

.quote:before {
	content: "";
	height: 5px;
	width: 100%;
	background: #795548333;
	position: absolute;
	top: -9px;
	left: 0;
	right: 0;
}

.list {
	font-family: 'Roboto', sans-serif;
	color: #333;
	font-size: 14px;
	margin: 10px 0 15px;
}

.list li {
	padding-left: 27px;
	padding-top: 5px;
	padding-bottom: 2px;
	position: relative;
}

.list li:before {
	content: "";
	width: 5px;
	height: 5px;
	background: #795548333;
	position: absolute;
	left: 13px;
	top: 12px;
}

#tabwrap {
	background: #fff;
	overflow: hidden;
	width: 100%;
	min-height: 300px;
	margin: 60px auto;
	border: 1px solid #ddd;
}

#tabs {
	overflow: hidden;
	border-bottom: 1px solid #ddd;
}

#tabs li {
	list-style: none;
}

#tabs li a {
	float: left;
	display: block;
	padding: 10px;
	color: #999999;
	padding: 25px 30px;
	text-decoration: none;
	text-align: center;
	border-left: 1px solid #ddd;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 14px;
	font-weight: bold;
	font-size: 15px;
	text-transform: uppercase;
}

#tabs li:first-child a {
	border-left: none;
}

#tabs li.current a {
	color: #795548;
}



#gal-slider {
	background: #232323;
	padding: 20px;
	position: relative;
}

.gal-nav {
	background: #000000;
	padding: 20px 55px;
	margin-bottom: 30px;
	display: table;
	width: 100%;
}

.gal-nav li {
	float: left;
	width: 25%;
	padding: 0 10px;
	cursor: pointer;
}

.gal-nav li.flex-active img {
	background: #795548;
	padding: 2px;
}

.flex-prev {
	color: #999;
	font-size: 30px;
	position: absolute;
	bottom: -95px;
	z-index: 99999;
	left: 20px;
}

.flex-prev:hover,
.flex-next:hover {
	color: #fff;
}

.flex-next {
	color: #999;
	font-size: 30px;
	position: absolute;
	right: 20px;
	bottom: -95px;
	z-index: 99999;
}

/* 11. Contact */

.gmap {
	padding: 0px;
	height: 405px;
}

.gmap div {
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}

#map {
	display: block;
	width: 100%;
	height: 405px;
	margin: 0 auto;
}

#map.large {
	height: 405px;
}

#map img {
	max-width: none;
	height: auto;
}



/* 14. Footer / Fixed */
.footer-fixed {
	height: 38px;
	background: #232323;
	color: #fff;
	border-top: 3px solid #795548;
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	margin: 0 auto;
	z-index: 999;
}

@media (min-width: 1200px) {
	.footer-fixed {
		max-width: 1280px;
		/* Restored closer to original but respecting user's 1320px observation */
	}
}

@media (min-width: 1400px) {
	.footer-fixed {
		max-width: 1440px;
		/* Bootstrap XXL match */
	}
}

.footer-fixed:after {
	content: "";
	background: url(../images/fn-right.png) no-repeat;
	width: 25px;
	height: 48px;
	position: absolute;
	right: -25px;
	top: -13px;
	/* Align bottoms: 48px height - 10px top = 38px footer height */
	z-index: 1000;
}

.footer-fixed:before {
	content: "";
	background: url(../images/fn-left.png) no-repeat;
	width: 25px;
	height: 48px;
	position: absolute;
	left: -25px;
	top: -13px;
	/* Align bottoms */
	z-index: 1000;
}

#block-gazeta-footer ul.menu {
	border-right: 1px solid #333;
	border-left: 1px solid #000000;
	display: table;
}

#block-gazeta-footer ul.menu li {
	float: left;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #fff;
	text-transform: uppercase;
	border-right: 1px solid #000000;
	border-left: 1px solid #333333;
}

#block-gazeta-footer ul.menu li a {
	color: #fff;
	padding: 9px 20px;
	display: table;
}

#block-gazeta-footer ul.menu li a:hover {
	color: #795548;
}


/* 16. Responsive Styles */



@media (min-width: 768px) {

	header .block,
	header #main-menu,
	.header .block {
		margin-bottom: 0;
	}

	.block-copyright {
		padding-top: 8px;
		text-align: right;
	}
}

@media only screen and (min-width: 600px) and (max-width: 1100px) {

	header nav ul li a {
		padding: 15px 12px;
	}

}

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

	/* Header and Featured Event Hiding */
	.header {
		margin-bottom: 0px;
		border-bottom: none;
	}

	/* Hide the col-md-8 containing featured events/banner next to logo if applicable */
	/* Assuming structure: Header > Row > Col-md-4 (Logo) + Col-md-8 (Banner/Featured) */
	.header .row .col-md-8 {
		display: none !important;
	}

	/* Adjust Logo Container */
	.header .row .col-md-4 {
		width: 100%;
		text-align: center;
	}

	/* Hide Top Bar completely */
	.top-bar,
	.header .top-bar {
		display: none !important;
		height: 0;
		overflow: hidden;
		padding: 0;
		margin: 0;
	}

	/* Ensure Logo is visible and centered */
	#logo {
		display: block;
		text-align: center;
		padding: 0px 0;
	}
}

#logo {
	background: #FBF0E1;
}

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


	#logo #block-gazeta-branding img {
		width: 80%;
	}

	.sub-comment .comment-inner {
		margin-right: 10px;
		padding-top: 105px;
	}

	.tb-left {
		display: none;
	}

	.tb-right {
		display: table;
		float: none;
		margin: 0 auto;
	}

	.tb-right li {
		margin: 0 17px;
	}


	.tbr-social {
		float: left;
	}

	.tbr-login {
		display: table;
		float: right !important;
	}

	.tbr-login a {
		text-align: right;
	}

	.tbr-social span a {
		color: #FFF;
		font-size: 14px;
		margin-left: 0px;
		margin-right: 10px;
	}

	header {
		width: 100% !important;
	}

	#block-gazeta-main-menu ul li a {
		width: 100%;
	}

	#block-gazeta-main-menu ul li {
		float: left;
		font-family: Oswald;
		font-size: 14px;
		color: #000;
		text-transform: uppercase;
		width: 100%;
		border-bottom: 1px solid #ddd;
	}

	#block-gazeta-main-menu ul {
		background: #fff;
		z-index: 999999;
		position: relative;
		padding: 0;
		width: 100%;
		display: table;
	}

	#block-gazeta-main-menu li.menu-item--expanded ul li a {
		padding-left: 40px;
	}

	.search-trigger {
		position: absolute;
		top: 0;
		right: 15px;
	}

	.search {
		top: 0;
	}

	.search form input {
		padding: 5px 70px 5px 5px;
		font-size: 14px;
	}

	.search form input:focus {
		outline: none;
		border: none;
		box-shadow: none;
	}

	.footer-widget {
		padding: 30px;
		border-right: none;
		min-height: auto;
		border-bottom: 1px solid #ddd;
	}

	.footer-nav {
		border-right: 1px solid #333;
		border-left: 1px solid #000;
		display: none;
	}



	.container {
		max-width: 100%;
		margin-left: auto;
		margin-right: auto;
		width: 100%;
	}

	.footer-fixed {
		max-width: 604px;
	}

	/* ?n ti�u d? block n?u c� */
}
}

/* @end */

/* 10. Menu Linh v?c Custom Styles */
.field-menu-wrapper {
	background: #fff;
	border-bottom: 1px solid #eee;
	margin-bottom: 20px;
	/* Add some space below */
}

/* ?n ti�u d? block n?u c� */
.field-menu-wrapper h2 {
	display: none;
}

.field-menu-wrapper ul.menu {
	display: flex;
	justify-content: center;
	/* Center horizontally as requested */
	flex-wrap: wrap;
	list-style: none;
	padding: 0;
	margin: 0;
}

.field-menu-wrapper ul.menu>li {
	margin: 0;
	position: relative;
	list-style-type: none;
	/* Specific removal of marker */
}

.field-menu-wrapper ul.menu>li::marker {
	display: none;
	content: "";
}

.field-menu-wrapper ul.menu>li>a {
	display: block;
	padding: 5px 10px;
	/* Slightly reduced padding */
	color: #333;
	font-family: 'Roboto Condensed', sans-serif;
	/* Consistent font */
	text-transform: none;
	/* Normal casing as requested */
	font-size: 13px;
	/* Increase slightly for readability since it's not caps */
	font-weight: 700;
	text-decoration: none;
	transition: all 0.3s;
	position: relative;
	border-right: 1px solid rgba(0, 0, 0, 0.05);
	/* Subtle separator */
}

/* Dropdown Arrow Indicator */
.field-menu-wrapper ul.menu>li.menu-item--expanded>a {
	padding-right: 25px !important;
	/* Make room for arrow */
}

.field-menu-wrapper ul.menu>li.menu-item--expanded>a:after {
	content: "\f107";
	/* FontAwesome down arrow */
	font-family: 'FontAwesome';
	font-size: 12px;
	margin-left: 8px;
	position: absolute;
	right: 8px;
	top: 50%;
	transform: translateY(-50%);
	transition: transform 0.3s;
}

.field-menu-wrapper ul.menu>li.menu-item--expanded:hover>a:after {
	transform: translateY(-50%) rotate(180deg);
	/* Flip arrow on hover */
}

.field-menu-wrapper ul.menu>li>a:hover,
.field-menu-wrapper ul.menu>li.menu-item--active-trail>a {
	background: #795548;
	color: #fff;
}

/* Dropdown Level 2 */
.field-menu-wrapper ul.menu li ul {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	background: #fff;
	box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
	min-width: 220px;
	z-index: 999;
	border-top: 2px solid #e00000;
}

.field-menu-wrapper ul.menu li:hover>ul {
	display: block;
}

.field-menu-wrapper ul.menu li ul li {
	float: none;
	width: 100%;
	border-bottom: 1px solid #eee;
}

.field-menu-wrapper ul.menu li ul li:last-child {
	border-bottom: none;
}

.field-menu-wrapper ul.menu li ul li a {
	display: block;
	padding: 10px 15px;
	font-size: 13px;
	color: #333;
	text-transform: none;
	font-family: 'Open Sans', sans-serif;
	line-height: 1.4;
}

.field-menu-wrapper ul.menu li ul li a:hover {
	background: #f9f9f9;
	color: #795548;
	padding-left: 20px;
	/* Slight indent effect on hover */
}

/* Breadcrumb Styling */
.breadcrumb-simple-wrapper {
	padding: 5px 0;
	box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.02);
}

.breadcrumb-simple-wrapper .breadcrumb {
	padding: 0;
	margin-bottom: 0;
	list-style: none;
	background-color: transparent;
	border-radius: 0;
	font-size: 13px;
	font-family: 'Roboto', sans-serif;
	color: #666;
}

.breadcrumb-simple-wrapper .breadcrumb>li {
	display: inline-block;
}

.breadcrumb-simple-wrapper .breadcrumb>li+li:before {
	padding: 0 10px;
	color: #999;
	content: "\f105";
	/* FontAwesome Angle Right */
	font-family: 'FontAwesome';
	font-weight: normal;
	font-size: 14px;
}

.breadcrumb-simple-wrapper .breadcrumb>li>a {
	color: #333;
	text-decoration: none;
}

.breadcrumb-simple-wrapper .breadcrumb>li>a:hover {
	color: #795548;
	text-decoration: underline;
}

.breadcrumb-simple-wrapper .breadcrumb>.active {
	color: #333;
	font-weight: 600;
}

/* Hide breadcrumb on front page if needed */
.front .breadcrumb-simple-wrapper {
	display: none;
}

/* Reset Bootstrap Gutter */
:root {
	--bs-gutter-x: 0;
}

.row {
	--bs-gutter-x: 0;
}

/* News Ticker Slick Buttons Fix */
.news-ticker {
	max-height: 70px;
	overflow: hidden;
}

.news-ticker .slick-prev {
	width: 20px;
	height: 20px;
	background-color: #FBF0E1;
	display: table;
	font-size: 0px;
	position: absolute;
	right: 23px;
	top: 25px;
	border: none;
}

.news-ticker .slick-prev:after {
	content: \f106;
	font-family: 'FontAwesome';
	font-size: 12px;
	color: #000;
	width: 20px;
	height: 20px;
	text-align: center;
	line-height: 19px;
	border: solid 1px #777;
	display: table;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
}

.news-ticker .slick-next {
	width: 20px;
	height: 20px;
	background-color: #FBF0E1;
	display: table;
	font-size: 0px;
	position: absolute;
	right: 0px;
	top: 25px;
	border: none;
}

.news-ticker .slick-next:after {
	content: \f107;
	font-family: 'FontAwesome';
	font-size: 12px;
	color: #000;
	width: 20px;
	height: 20px;
	text-align: center;
	line-height: 19px;
	border: solid 1px #777;
	display: table;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
}

.news-ticker .slick-prev:hover:after,
.news-ticker .slick-next:hover:after {
	color: #795548;
	border-color: #795548;
}

/* ============================================
   11. PROFESSIONAL UI ENHANCEMENTS
   ============================================ */

/* --- 11.1 Global Typography & Base --- */
body {
	font-family: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	line-height: 1.6;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'Roboto Slab', serif;
	font-weight: 700;
	line-height: 1.3;
	color: #1a1a1a;
}

p {
	line-height: 1.7;
	color: #444;
}

a {
	transition: color 0.25s ease, background-color 0.25s ease;
}

/* --- 11.2 Wrapper & Container --- */
.wrapper {
	box-shadow: 0 0 40px rgba(0, 0, 0, 0.08);
	border-radius: 2px;
}

/* --- 11.3 Header & Navigation Enhancements --- */
.header {
	border-bottom: 1px solid #795548;
	margin-bottom: 0;
	background: #fff;
}

header {
	background: linear-gradient(to bottom, #fcfcfc, #f5f5f5);
	border-bottom: 2px solid #795548;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

header nav ul.menu li.menu-item a {
	font-weight: 600;
	letter-spacing: 0.5px;
	transition: all 0.3s ease;
}

header nav ul.menu li.menu-item a:hover {
	background: #795548;
	color: #fff !important;
}

header nav ul.menu li.menu-item a:hover:after {
	background: #5d4037;
}

header nav ul.menu .menu-item--expanded ul.menu {
	border-top: 3px solid #795548;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
	border-radius: 0 0 4px 4px;
}

header nav ul.menu .menu-item--expanded ul.menu li a {
	padding: 10px 18px;
	font-size: 13px;
	font-weight: 500;
	transition: all 0.2s ease;
	border-bottom: 1px solid #f0f0f0;
}

header nav ul.menu .menu-item--expanded ul.menu li a:hover {
	padding-left: 22px;
	background: #fafafa;
	color: #795548 !important;
}

header nav ul.menu .menu-item--expanded ul.menu li:last-child a {
	border-bottom: none;
}

/* --- 11.4 News Ticker Enhancement --- */
.block-breaking-news {
	background: #FBF0E1;
	border-left: 3px solid #795548;
	padding: 20px 25px 20px 210px;
	border-radius: 0;
	transition: box-shadow 0.3s;
}

.block-breaking-news:hover {
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

.block-breaking-news .views-field-title a {
	color: #1a1a1a;
	font-weight: 700;
	transition: color 0.2s ease;
}

.block-breaking-news .views-field-title a:hover {
	color: #795548;
}

/* --- 11.5 Content Cards & Article Styles --- */
.views-row {
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.sidebar .views-row:hover,
.panel-first .views-row:hover,
.panel-second .views-row:hover {
	transform: translateY(-1px);
}

.views-field-title a {
	color: #222;
	font-weight: 600;
	line-height: 1.4;
	transition: color 0.2s ease;
}

.views-field-title a:hover {
	color: #795548;
}

.views-field-created,
.views-field-field-category a {
	font-family: 'Open Sans', sans-serif;
	letter-spacing: 0.5px;
}

.views-field-field-category a {
	background: #795548;
	color: #fff !important;
	padding: 2px 8px;
	border-radius: 2px;
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	display: inline-block;
	transition: background 0.2s ease;
}

.views-field-field-category a:hover {
	background: #5d4037;
}




.sidebar h2.block-title {
	font-size: 16px;
	text-transform: uppercase;
	border-bottom: 3px solid #795548;
	font-weight: 700;
	padding-bottom: 10px;
	margin-bottom: 20px;
	position: relative;
	letter-spacing: 0.5px;
}

.sidebar .views-row {
	padding-bottom: 15px;
	margin-bottom: 15px;
	border-bottom: 1px solid #f0f0f0;
}

.sidebar .views-row:last-child {
	border-bottom: none;
}

.sidebar h4 {
	font-size: 14px;
	line-height: 1.5;
	margin-top: 0;
}

.sidebar h4 a {
	color: #333 !important;
}

.sidebar h4 a:hover {
	color: #e00000 !important;
}

/* --- 11.7 Field Menu (Linh Vuc) Polish --- */
.field-menu-wrapper {
	background: #fff;
	border-bottom: 1px solid #795548;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
}

.field-menu-wrapper ul.menu>li>a:hover,
.field-menu-wrapper ul.menu>li.menu-item--active-trail>a {
	background: #795548;
	color: #fff;
	box-shadow: 0 2px 8px rgba(224, 0, 0, 0.3);
}

.field-menu-wrapper ul.menu li ul {
	border-top: 3px solid #795548;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
	border-radius: 0 0 4px 4px;
}

/* --- 11.8 Breadcrumb Enhancement --- */
.breadcrumb-simple-wrapper {
	padding: 0px 0;
	font-size: 14px;
	color: #666;
}

.breadcrumb-simple-wrapper a {
	color: #555;
	text-decoration: none;
	transition: color 0.2s;
}

.breadcrumb-simple-wrapper a:hover {
	color: #795548;
}

/* --- 11.9 Node/Article Page - Professional Journalism Style --- */
.node__content {
	font-size: 20px;
	/* Standard readable size for news */
	line-height: 1.8;
	color: #222;
	font-family: 'Roboto', 'Georgia', serif;
	/* Serif for body text is classic journalism, or clean sans */
}

.node__content p {
	margin-bottom: 24px;
	text-align: justify;
	/* Newspaper style alignment */
}

.node__content strong {
	font-weight: 700;
	color: #000;
}

.node__content img {
	border-radius: 2px;
	box-shadow: none;
	width: 100%;
	height: auto;
	margin: 20px 0 10px;
}

.node__content figcaption,
.node__content .caption {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 14px;
	color: #666;
	text-align: center;
	font-style: italic;
	margin-bottom: 25px;
	display: block;
}

.node__content h2 {
	font-size: 28px;
	margin-top: 40px;
	margin-bottom: 20px;
	padding-bottom: 0;
	border-bottom: none;
	line-height: 1.3;
	font-weight: 800;
}

.node__content h3 {
	font-size: 24px;
	margin-top: 35px;
	margin-bottom: 15px;
	font-weight: 700;
}

.node__content blockquote {
	position: relative;
	border: none;
	margin: 30px 40px;
	padding: 0;
	background: transparent;
	font-style: italic;
	color: #444;
	font-size: 22px;
	line-height: 1.5;
	font-family: 'Playfair Display', serif;
	text-align: center;
}

.node__content blockquote:before {
	content: "\f10d";
	font-family: 'FontAwesome';
	display: block;
	font-size: 30px;
	color: #795548;
	margin-bottom: 10px;
}

.node__content ul,
.node__content ol {
	padding-left: 25px;
	margin-bottom: 1.2em;
}

.node__content li {
	margin-bottom: 6px;
	list-style: disc;
}

/* --- 11.10 Footer Enhancement --- */
.panel-third {
	background: linear-gradient(to bottom, #1a1a1a, #111);
	padding: 50px 0;
}

.panel-third h2.block-title {
	color: #fff;
	font-size: 16px;
	letter-spacing: 1px;
	border-bottom: 3px solid #795548;
	padding-bottom: 12px;
}

.panel-third-widget a {
	color: #bbb;
	transition: color 0.2s, padding-left 0.2s;
}

.panel-third-widget a:hover {
	color: #795548;
	padding-left: 5px;
}

.footer-fixed {
	background: linear-gradient(to right, #232323, #232323);
	border-top: 3px solid #795548;
	box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.15);
	padding: 0;
	/* Reset padding for fixed bar */
}

.footer-fixed .menu li a {
	font-weight: 600;
	letter-spacing: 0.5px;
	transition: color 0.2s;
}

.footer-fixed .menu li a:hover {
	color: #e00000 !important;
}

/* --- 11.11 Buttons & Interactive Elements --- */
.btn-btt {
	border-radius: 50%;
	width: 40px;
	height: 40px;
	line-height: 40px;
	box-shadow: 0 3px 10px rgba(224, 0, 0, 0.3);
	transition: all 0.3s ease;
	border: none;
}

.btn-btt:hover {
	background: #1a1a1a;
	transform: translateY(-3px);
	box-shadow: 0 6px 15px rgba(0, 0, 0, 0.3);
}

/* --- 11.12 Search Enhancement --- */
.search-trigger {
	transition: all 0.3s ease;
	border-left: 1px solid #eee;
}

.search-trigger:hover {
	background: #795548;
	color: #fff;
}

.search form input {
	font-family: 'Open Sans', sans-serif;
	transition: box-shadow 0.3s;
}

.search form input:focus {
	box-shadow: inset 0 0 0 2px #e00000;
	outline: none;
}

.search form .button {
	transition: all 0.3s;
	font-family: 'Oswald', sans-serif;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.search form .button:hover {
	background: #795548;
	color: #fff;
}

/* --- 11.13 Featured/Big Section --- */
.bl-featured-big h4 {
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.6);
}

.bl-featured-big h4 a:hover {
	text-decoration: underline;
}

.news-feed h4 {
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.6);
}

/* --- 11.14 Tags / Labels --- */
.popular-tags a {
	border-radius: 3px;
	font-weight: 600;
	transition: all 0.25s ease;
	border: 1px solid #e8e8e8;
	background: #fafafa;
}

.popular-tags a:hover {
	background: #795548;
	color: #fff;
	border-color: #795548;
	transform: translateY(-1px);
}

/* --- 11.15 Panels (Content Bottom Sections) --- */
.panel-first h2.block-title,
.panel-second h2.block-title {
	font-size: 16px;
	letter-spacing: 0.5px;
	border-bottom: 3px solid #795548;
	padding-bottom: 10px;
}

/* --- 11.16 Selection & Focus States --- */
::selection {
	background: #795548;
	color: #fff;
}

::-moz-selection {
	background: #795548;
	color: #fff;
}

*:focus {
	outline-color: #e00000;
}

/* --- 11.17 Image & Media Polish --- */
.views-field-field-image img {
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.views-field-field-image:hover img {
	transform: scale(1.02);
}

/* --- 11.18 Entity Reference Fields (Category/Linh Vuc on Node) --- */
.field--name-field-linh-vuc,
.field--name-field-category {
	margin-top: 20px;
	padding: 12px 15px;
	background: #fafafa;
	border-radius: 4px;
	border: 1px solid #eee;
}

.field--name-field-linh-vuc .field__label,
.field--name-field-category .field__label {
	font-weight: 700;
	font-size: 13px;
	text-transform: uppercase;
	color: #666;
	letter-spacing: 0.5px;
}

.field--name-field-linh-vuc .field__item a,
.field--name-field-category .field__item a {
	display: inline-block;
	background: #795548;
	color: #fff !important;
	padding: 3px 10px;
	border-radius: 3px;
	font-size: 12px;
	font-weight: 600;
	margin: 3px 5px 3px 0;
	transition: background 0.2s;
}

.field--name-field-linh-vuc .field__item a:hover,
.field--name-field-category .field__item a:hover {
	background: #5d4037;
}

/* --- 11.19 Form Elements --- */
input[type=text],
input[type=email],
input[type=password],
textarea,
select {
	border: 1px solid #ddd;
	border-radius: 3px;
	padding: 8px 12px;
	transition: border-color 0.3s, box-shadow 0.3s;
	font-family: 'Open Sans', sans-serif;
}

input[type=text]:focus,
input[type=email]:focus,
input[type=password]:focus,
textarea:focus,
select:focus {
	border-color: #795548;
	box-shadow: 0 0 0 3px rgba(224, 0, 0, 0.1);
	outline: none;
}

input[type=submit],
button.form-submit {
	background: #795548;
	color: #fff;
	border: none;
	padding: 10px 25px;
	border-radius: 3px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	cursor: pointer;
	transition: all 0.3s ease;
}

input[type=submit]:hover,
button.form-submit:hover {
	background: #5d4037;
	box-shadow: 0 3px 10px rgba(224, 0, 0, 0.3);
	transform: translateY(-1px);
}

/* --- 11.20 Scrollbar Styling --- */
::-webkit-scrollbar {
	width: 8px;
}

::-webkit-scrollbar-track {
	background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
	background: #ccc;
	border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
	background: #795548;
}

/* ============================================
   12. GOOGLE FONT OVERRIDE (Roboto Family)
   ============================================ */

/* Body / Default */
body,
p,
.views-field-created,
.block-simplenews input.form-text,
.sidebar .item-list ul li a,
.panel-third p,
.breadcrumb-simple-wrapper,
input,
textarea,
select,
button {
	font-family: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* Headings */
h1,
h2,
h3,
h4,
h5,
h6,
.sidebar h2.block-title,
.panel-first h2.block-title,
.panel-second h2.block-title,
.panel-third h2.block-title,
#logo .site-branding__name,
.logo h1,
.views-field-title a,
.bl-featured-big h4,
.bl-featured-big h4 a,
.news-feed h4,
.node__content h2,
.node__content h3 {
	font-family: 'Roboto Slab', 'Roboto', Georgia, serif !important;
}

/* Navigation / Menu / Category Labels */
header nav ul.menu li.menu-item,
header nav ul.menu li.menu-item a,
header nav ul.menu li.menu-item span,
.field-menu-wrapper ul.menu>li>a,
.field-menu-wrapper ul.menu li ul li a,
.block-breaking-news h2.block-title,
.sub-menu h3,
.footer-fixed .menu li a,
.search form .button,
.views-field-field-category a {
	font-family: 'Roboto Condensed', 'Roboto', Arial, sans-serif !important;
}

/* Date / Timestamp / Small labels */
.tbl-date,
.tbl-temp,
.tbr-login a,
.views-field-created span,
.bl-featured-big .views-field-created,
.bl-featured-small .views-field-created,
.sidebar .views-field-created,
.panel-first .views-field-created,
.panel-second .views-field-created,
.field--name-field-linh-vuc .field__label,
.field--name-field-category .field__label {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 500;
}

/* Logo / Site Name - Bold Slab */
#logo .site-branding__name,
#logo .site-branding__name a,
.logo h1 {
	font-family: 'Roboto Slab', serif !important;
	font-weight: 900;
	text-shadow: 1px 2px rgba(0, 0, 0, 0.08);
}

/* News Ticker Category */
.block-breaking-news .views-field-field-category a {
	font-family: 'Roboto Condensed', sans-serif !important;
	font-weight: 700;
}

/* Content body text */
.node__content,
.node__content p {
	font-family: 'Roboto', sans-serif !important;
	font-weight: 400;
}

/* Remove all underlines */
a,
a:hover,
a:focus,
a:active,
a:visited {
	text-decoration: none !important;
}

/* Fix content padding (after gutter reset) */
.main-content-inner {
	padding: 0 0px !important;
}

.main-content-inner .row .col-md-8 {
	padding-left: 0 !important;
}

.col-md-12,
.col-md-8,
.col-md-6,
.col-md-4,
.col-md-3,
.col-lg-12,
.col-lg-8,
.col-lg-6,
.col-lg-4,
.col-lg-3 {
	padding-left: 0px !important;
	padding-right: 0px !important;
}

.header .row .col-md-8 {
	background: #FBF0E1;
}

.header .row,
.header .row .col-md-4,
.top-bar .row,
.footer-fixed .row {
	padding-left: 0px !important;
	padding-right: 0px !important;
}

.region-content-wrapper {
	padding-left: 5px !important;
	padding-right: 5px !important;
}

.article-detail-wrapper .row {
	padding-left: 5px !important;
	padding-right: 5px !important;
	font-size: 150% !important;
}

.panel-third .container {
	padding-left: 15px;
	padding-right: 15px;
}


}

}

}

}

}

}

}

}

}

}

}

}

}

}

}

}

}

}

}

}

/* ================================================================== 12. MOBILE & TABLET OPTIMIZATIONS ================================================================== */

@media (max-width: 991px) {

	/* --- Tablet & Smaller --- */
	/* Header Adjustments */
	#logo .site-branding__name,
	.logo h1 {
		font-size: 42px;
		/* Reduce from 60px */
		line-height: 1.2;

	}

	#logo {
		padding: 15px 0;
		min-height: auto !important;
		/* Reset fixed height */
	}

	.search-trigger {
		width: 50px;
		height: 50px;
		line-height: 50px;
		font-size: 16px;

	}

	/* Navigation */
	.navbar-collapse {
		max-height: 340px;
		overflow-y: auto;
		border-top: 1px solid #795548;

	}

	header nav ul.menu li.menu-item {
		float: none;
		width: 100%;
		border-bottom: 1px solid #eee;

	}

	header nav ul.menu li.menu-item a {
		padding: 12px 15px;

	}

	/* Main Menu Active Highlighting for Mobile/Tablet */
	header nav#block-gazeta-main-menu ul.menu li.active>a,
	header nav#block-gazeta-main-menu ul.menu li.menu-item--active-trail>a,
	header nav#block-gazeta-main-menu ul.menu li a.is-active,
	.region-main-menu .navigation.menu--main ul.menu li.active>a,
	.region-main-menu .navigation.menu--main ul.menu li.menu-item--active-trail>a {
		background: #795548 !important;
		color: #fff !important;
	}

	/* Hide Mega Menu behavior on touch,
	rely on click/expand */
	.mega-menu {
		position: static;
		width: 100%;
		opacity: 1;
		visibility: visible;
		display: none;
		/* Hidden by default,
		toggled via JS if available or simple CSS hover doesn't work well */
		margin-top: 0;
		box-shadow: none;
		border-top: none;

	}

	/* Reset Sidebar Padding */
	.sidebar {
		padding-left: 15px;
		margin-top: 30px;

	}


}

@media (max-width: 767px) {

	/* --- Mobile Landscape & Portrait --- */
	/* Global Container Padding */
	.container {
		padding-left: 0px;
		padding-right: 0px;

	}

	/* Header Mobile */
	.header {
		margin-bottom: 0px;

	}

	#logo .site-branding__name,
	.logo h1 {
		font-size: 32px;
		/* Further reduce for mobile */

	}

	/* News Ticker Mobile */
	.news-ticker {
		height: auto;
		max-height: none;
		padding-right: 0;

	}

	.block-breaking-news {
		padding: 10px;
		border-left: none;
		border-top: 0px solid #795548;

	}

	.block-breaking-news h2.block-title {
		position: static;
		width: 100%;
		height: auto;
		margin-bottom: 10px;
		background: transparent;
		color: #795548;
		padding: 0;

	}

	.block-breaking-news h2.block-title span {
		font-size: 16px;
		padding: 0;

	}

	.news-ticker .slick-list {
		margin-left: 0;
		width: 100%;

	}

	/* Hide ticker controls on very small screens to save space */
	.news-ticker .slick-prev,
	.news-ticker .slick-next {
		display: none !important;

	}

	/* Content Area */
	.main-content {
		padding-top: 0px;

	}

	.main-content-inner .row .col-md-8 {
		padding: 0px !important;
	}

	.node__content {
		font-size: 20px;
		/* Slightly smaller for mobile reading */
		text-align: left;
		/* Justify can cause large gaps on narrow screens */

	}

	.node__content h2 {
		font-size: 24px;
		line-height: 1.3;

	}

	.node__content blockquote {
		margin: 20px 10px;
		font-size: 18px;
	}

	/* ============================================
	   Field Menu / Linh v?c - Mobile Dropdown v2
	   ============================================ */

	/* Wrapper handles positioning context */
	.field-menu-wrapper,
	.region-field-menu {
		width: 100% !important;
		max-width: 100vw !important;
		display: block !important;
		overflow-x: auto;
		/* Allow JS to override */
		overflow-y: hidden;
		/* Prevent vertical scrollbar usually */
		position: relative !important;
		/* Dropdown anchors here */
		z-index: 100;
	}

	/* When submenu is open, allow overflow so dropdown shows */
	.field-menu-wrapper.has-open-submenu,
	.region-field-menu.has-open-submenu {
		overflow: visible !important;
	}

	.region-field-menu .menu--linh-vuc,
	#block-gazeta-linhvuc {
		width: 100% !important;
		max-width: 100vw !important;
		display: block !important;
		overflow-x: auto !important;
		overflow-y: visible !important;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: thin;
		scrollbar-color: #795548 #e0e0e0;
	}

	/* Scrollbar styling */
	.field-menu-wrapper::-webkit-scrollbar,
	.region-field-menu::-webkit-scrollbar,
	.region-field-menu .menu--linh-vuc::-webkit-scrollbar {
		display: block;
		height: 4px;
	}

	.field-menu-wrapper::-webkit-scrollbar-track,
	.region-field-menu::-webkit-scrollbar-track,
	.region-field-menu .menu--linh-vuc::-webkit-scrollbar-track {
		background: #e0e0e0;
	}

	.field-menu-wrapper::-webkit-scrollbar-thumb,
	.region-field-menu::-webkit-scrollbar-thumb,
	.region-field-menu .menu--linh-vuc::-webkit-scrollbar-thumb {
		background: #795548;
		border-radius: 3px;
	}

	/* Top-level menu: horizontal row */
	.field-menu-wrapper>ul.menu,
	.region-field-menu .menu--linh-vuc>ul.menu,
	.region-field-menu>.block>ul.menu {
		display: flex !important;
		flex-wrap: nowrap !important;
		white-space: nowrap !important;
		width: max-content !important;
		min-width: 100%;
		padding: 0 !important;
		margin: 0 !important;
		list-style: none !important;
	}

	/* Top-level items: inline */
	.field-menu-wrapper>ul.menu>li,
	.region-field-menu .menu--linh-vuc>ul.menu>li,
	.region-field-menu>.block>ul.menu>li {
		display: inline-block !important;
		float: none !important;
		width: auto !important;
		margin: 0 !important;
		vertical-align: top;
		position: relative !important;
		flex-shrink: 0;
	}

	/* Top-level links */
	.field-menu-wrapper>ul.menu>li>a,
	.region-field-menu .menu--linh-vuc>ul.menu>li>a,
	.region-field-menu>.block>ul.menu>li>a {
		display: block !important;
		padding: 12px 16px !important;
		font-size: 14px !important;
		white-space: nowrap !important;
		border-right: 1px solid #eee !important;
		background: transparent !important;
		color: #333 !important;
		transition: background 0.15s ease, color 0.15s ease !important;
	}

	/* Active trail highlight */
	.field-menu-wrapper ul.menu>li.menu-item--active-trail>a {
		background: #795548 !important;
		color: #fff !important;
	}

	/* Arrow icon for items with children */
	.field-menu-wrapper ul.menu>li.menu-item--expanded>a {
		padding-right: 24px !important;
		position: relative !important;
	}

	.field-menu-wrapper ul.menu>li.menu-item--expanded>a:after,
	.region-field-menu ul.menu>li.menu-item--expanded>a:after {
		content: "\f107" !important;
		font-family: 'FontAwesome' !important;
		font-size: 11px !important;
		display: inline-block !important;
		position: absolute !important;
		right: 6px !important;
		top: 50% !important;
		transform: translateY(-50%) !important;
		transition: transform 0.2s ease !important;
	}

	/* Rotate arrow when submenu is open */
	.field-menu-wrapper ul.menu>li.menu-item--expanded.mobile-submenu-open>a:after,
	.region-field-menu ul.menu>li.menu-item--expanded.mobile-submenu-open>a:after {
		transform: translateY(-50%) rotate(180deg) !important;
	}

	/* Highlight parent when submenu is open */
	.field-menu-wrapper>ul.menu>li.mobile-submenu-open>a,
	.region-field-menu .menu--linh-vuc>ul.menu>li.mobile-submenu-open>a,
	.region-field-menu>.block>ul.menu>li.mobile-submenu-open>a {
		background: #795548 !important;
		color: #fff !important;
	}

	/* ---- SUBMENU (children) ---- */
	/* Hidden by default */
	.field-menu-wrapper ul.menu ul.menu,
	.region-field-menu .menu--linh-vuc ul.menu ul.menu,
	.region-field-menu ul.menu ul.menu {
		display: none !important;
	}

	/* Show when parent has .mobile-submenu-open */
	.field-menu-wrapper ul.menu>li.mobile-submenu-open>ul.menu,
	.region-field-menu .menu--linh-vuc ul.menu>li.mobile-submenu-open>ul.menu,
	.region-field-menu ul.menu>li.mobile-submenu-open>ul.menu {
		display: block !important;
		position: absolute !important;
		top: 100% !important;
		left: 0 !important;
		width: 100% !important;
		min-width: 100% !important;
		max-width: 100vw !important;
		max-height: 60vh !important;
		overflow-y: auto !important;
		z-index: 9999 !important;
		background: #fff !important;
		box-shadow: 0 6px 24px rgba(0, 0, 0, 0.18) !important;
		border-top: 3px solid #795548 !important;
		border-radius: 0 0 6px 6px !important;
		padding: 0 !important;
		margin: 0 !important;
		list-style: none !important;
		white-space: normal !important;
		-webkit-overflow-scrolling: touch;
		animation: mobileDropdownSlide 0.2s ease-out;
	}

	@keyframes mobileDropdownSlide {
		from {
			opacity: 0;
			transform: translateY(-8px);
		}

		to {
			opacity: 1;
			transform: translateY(0);
		}
	}

	/* Submenu items */
	.field-menu-wrapper ul.menu>li.mobile-submenu-open>ul.menu>li,
	.region-field-menu ul.menu>li.mobile-submenu-open>ul.menu>li {
		display: block !important;
		width: 100% !important;
		border-bottom: 1px solid #f0f0f0 !important;
		margin: 0 !important;
		float: none !important;
	}

	.field-menu-wrapper ul.menu>li.mobile-submenu-open>ul.menu>li:last-child,
	.region-field-menu ul.menu>li.mobile-submenu-open>ul.menu>li:last-child {
		border-bottom: none !important;
	}

	/* Submenu links */
	.field-menu-wrapper ul.menu>li.mobile-submenu-open>ul.menu>li>a,
	.region-field-menu ul.menu>li.mobile-submenu-open>ul.menu>li>a {
		display: block !important;
		padding: 12px 20px !important;
		font-size: 15px !important;
		color: #333 !important;
		background: #fff !important;
		border: none !important;
		text-align: left !important;
		white-space: normal !important;
		line-height: 1.4 !important;
		transition: background 0.15s ease, padding-left 0.15s ease !important;
	}

	.field-menu-wrapper ul.menu>li.mobile-submenu-open>ul.menu>li>a:hover,
	.field-menu-wrapper ul.menu>li.mobile-submenu-open>ul.menu>li>a:active,
	.region-field-menu ul.menu>li.mobile-submenu-open>ul.menu>li>a:hover,
	.region-field-menu ul.menu>li.mobile-submenu-open>ul.menu>li>a:active {
		background: #f5f0ed !important;
		padding-left: 28px !important;
		color: #795548 !important;
	}

	/* Disable desktop hover-based dropdown on mobile */
	.field-menu-wrapper ul.menu li:hover>ul {
		display: none !important;
	}

	/* Footer Fixed - Hide on Mobile to save screen real estate */
	.footer-fixed {
		position: static;
		height: auto;
		width: 100%;
		max-width: 100%;
		padding: 10px 0;
		background: #232323;
		text-align: center;
	}

	.footer-fixed:after,
	.footer-fixed:before {
		display: none;
		/* Hide hooks on mobile */
	}

	#block-gazeta-footer ul.menu {
		border: none;
		display: inline-block;
		margin-bottom: 10px;
	}

	#block-gazeta-footer ul.menu li {
		border: none;
		display: inline-block;
		float: none;
	}

	.block-copyright {
		text-align: center;
		padding-top: 5px;
		width: 100%;
	}

	/* Top Bar Force Hide */
	.top-bar,
	.header .top-bar,
	div.top-bar {
		display: none !important;
		height: 0 !important;
		visibility: hidden !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	/* === HEADER & HAMBURGER TRANSFORMATION === */
	/* 1. Collapse the header container to 0 size */
	header,
	header .col-md-12,
	header .navbar,
	header .container-fluid {
		height: 0 !important;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		border: none !important;
		background: transparent !important;
		overflow: visible !important;
		position: static !important;
	}

	/* 2. Hide Search & extra elements */
	header .search,
	header .search-trigger,
	header #search {
		display: none !important;
	}

	/* 3. Float Hamburger Button (Fixed on screen) */
	header .navbar-header {
		float: none !important;
		margin: 0 !important;
		padding: 0 !important;
		width: 0 !important;
		height: 0 !important;
	}

	/* Transparent Minimalist Hamburger */
	header .navbar-toggler {
		display: block !important;
		position: fixed !important;
		top: 0px !important;
		left: 5px !important;
		z-index: 9999 !important;
		background: transparent !important;
		border: none !important;
		box-shadow: none !important;
		padding: 4px !important;
		width: auto !important;
		height: auto !important;
	}

	/* Hide wrapper pseudo-element as requested */
	.wrapper:before {
		display: none !important;
		content: none !important;
	}


	/* === FIX HORIZONTAL OVERFLOW CULPRITS === */

	/* Header nav submenu - position:absolute can extend beyond viewport */
	header nav ul.menu .menu-item--expanded ul.menu {
		position: static !important;
		width: 100% !important;
		min-width: 0 !important;
	}

	/* Images, iframes, embeds, tables - constrain to viewport */
	img,
	video,
	iframe,
	embed,
	object,
	table {
		max-width: 100% !important;
	}

	/* Twitter embed widget */
	.twitter-timeline,
	.twitter-tweet {
		max-width: 100% !important;
		overflow: hidden !important;
	}

	/* Any pre/code blocks */
	pre,
	code {
		max-width: 100% !important;
		overflow-x: auto !important;
		word-wrap: break-word !important;
	}

	/* === ULTIMATE OVERFLOW LOCK === */
	html,
	body {
		overflow-x: hidden !important;
		max-width: 100vw !important;
		width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		overflow-y: auto !important;
		/* Allow vertical scroll */
	}

	/* === FIX FRONT PAGE SPECIFIC OVERFLOW === */
	/* News Ticker & Panels */
	.news-ticker,
	.block-breaking-news,
	.panel-first .row,
	.panel-second .row,
	.panel-third .row {
		max-width: 100vw !important;
		overflow-x: hidden !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
		width: 100% !important;
	}

	/* Force Field Menu Wrapper to conform */
	.row.field-menu-wrapper {
		margin-left: 0 !important;
		margin-right: 0 !important;
		width: 100% !important;
		max-width: 100vw !important;
	}

}

#block-gazeta-breadcrumbs {
	border-bottom: 1px solid #eee;
	margin-bottom: 15px;

}

/* Custom Breadcrumb for Taxonomy Pages */
.custom-breadcrumb-wrapper {
	display: flex;
	flex-direction: column;
	padding: 15px 15px 8px;
	margin-left: 10px;
	margin-bottom: 0;
	border-bottom: 1px solid #eee;
}

/* Top row: Home > Ph�p lu?t > Category */
.breadcrumb-nav-row {
	display: flex;
	margin-top: 15px;
	align-items: center;
	gap: 8px;
	margin-bottom: 8px;
}

.breadcrumb-home {
	color: #888;
	font-size: 16px;
	text-decoration: none;
	transition: color 0.2s;
}

.breadcrumb-home:hover {
	color: #795548;
}

.breadcrumb-separator {
	color: #ccc;
	font-size: 13px;
	user-select: none;
}

.breadcrumb-site-home {
	color: #666;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: color 0.2s;
}

.breadcrumb-site-home:hover {
	color: #795548;
}

/* =========================================
   Custom Breadcrumb Split Layout (Date on Right)
   ========================================= */
.breadcrumb-split-layout {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	/* Align top for multi-line siblings */
	padding: 18px 20px;
	background-color: #f7f7f7;
	/* Keep background usually on wrapper */
	border-bottom: 1px solid #e5e5e5;
	flex-wrap: wrap;
	/* Fallback */
	gap: 15px;
}

.custom-breadcrumb-wrapper {
	/* Override existing if needed, but wrapper is now flex container */
	padding: 0 !important;
	/* Move padding to inner or layout class */
	background: transparent !important;
	border-bottom: none !important;
}

/* Re-apply wrapper styles to our split layout class since we removed padding/bg from wrapper */
.breadcrumb-split-layout {
	padding: 12px 0;
	/* Adjust vertical */
	align-items: center;
	/* Generally center vertically unless content is huge */
}

/* Wait, custom-breadcrumb-wrapper might be used elsewhere. Let's scope carefully. */
.custom-breadcrumb-wrapper.breadcrumb-split-layout {
	padding: 10px 0 !important;
	background: transparent !important;
	border-bottom: 1px solid #ddd !important;
	display: flex;
	flex-wrap: nowrap;
	align-items: flex-start;
}

.breadcrumb-content-left {
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 0;
	/* Prevent flex overflow */
}

.breadcrumb-date-right {
	flex-shrink: 0;
	margin-left: 20px;
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	color: #666;
	white-space: nowrap;
	padding-top: 4px;
	/* Slight alignment with big text */
}

@media (max-width: 767px) {
	.custom-breadcrumb-wrapper.breadcrumb-split-layout {
		flex-wrap: wrap;
	}

	.breadcrumb-content-left {
		width: 100%;
		flex: 0 0 100%;
	}

	.breadcrumb-date-right {
		width: 100%;
		flex: 0 0 100%;
		margin-left: 0;
		margin-top: 5px;
		font-size: 12px;
		color: #888;
		padding-top: 0;
		border-top: 1px dashed #eee;
		padding-top: 5px;
	}
}

/* Node Author Display (Full Page) */
.node-meta-bar .node-author {
	display: inline-flex;
	align-items: center;
}

.node-meta-bar .author-avatar-img {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	margin-right: 8px;
	object-fit: cover;
	border: 1px solid #ddd;
}

.node-meta-bar .username {
	font-weight: 700 !important;
	color: #333 !important;
	font-family: 'Roboto Slab', serif;
	font-size: 14px;
	text-decoration: none;
}

.node-meta-bar .username:hover {
	color: #795548 !important;
	text-decoration: underline;
}

/* =========================================
   Hide Default Page Title on Article Detail
   ========================================= */
body.page-node-type-article .page-title,
body.page-node-type-article h1.title,
body.page-node-type-article #block-gazeta-page-title h1,
/* Fallback: try to target using node context if body class missing */
.article-detail-wrapper~.page-title {
	display: none !important;
}

/* New Clean Styles for Node Meta Header with Responsive support */
.node-meta-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-bottom: 12px;
	margin-top: 15px;
	border-bottom: 1px solid #eee;
}

.header-author-section {
	display: flex;
	align-items: center;
}

.header-avatar {
	margin-right: 12px;
}

.avatar-img {
	width: 42px;
	height: 42px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
}

.avatar-placeholder {
	width: 42px;
	height: 42px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #f0f0f0;
	color: #999;
}

.author-name-link {
	font-weight: 700;
	color: #333;
	font-size: 15px;
	text-decoration: none;
	transition: color 0.2s;
}

.author-name-link:hover {
	color: #795548;
	text-decoration: underline;
}

.header-date {
	font-size: 13px;
	color: #888;
	font-family: 'Roboto', sans-serif;
}

/* Mobile Responsive (< 768px) */
@media (max-width: 767px) {
	.node-meta-header {
		margin-bottom: 10px;
		padding-bottom: 10px;
	}

	.header-avatar {
		margin-right: 8px;
	}

	.avatar-img,
	.avatar-placeholder {
		width: 32px !important;
		height: 32px !important;
	}

	.avatar-placeholder i {
		font-size: 16px !important;
		/* For placeholder icon */
	}

	.author-name-link {
		font-size: 13px !important;
	}

	.header-date {
		font-size: 11px !important;
	}
}

.breadcrumb-parent-big {
	font-size: 22px;
	font-weight: 700;
	text-transform: uppercase;
	color: #333;
	line-height: 1.2;
}

.breadcrumb-parent-big a {
	color: #333;
	text-decoration: none;
	transition: color 0.2s;
}

.breadcrumb-parent-big a:hover {
	color: #795548;
}

.breadcrumb-parent-big a.active {
	color: #795548;
}

/* Bottom row: sibling links */
.breadcrumb-children-small {
	font-size: 13px;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	padding: 4px 15px;
}

.breadcrumb-children-small a {
	color: #555;
	text-decoration: none;
	font-weight: 400;
	padding: 3px 12px;
	border-radius: 14px;
	background: #f5f5f5;
	transition: all 0.2s ease;
	white-space: nowrap;
	margin-bottom: 15px;
}

.breadcrumb-children-small a:hover {
	color: #fff;
	background: #795548;
}

.breadcrumb-children-small a.breadcrumb-item.active {
	color: #fff;
	background: #795548;
	font-weight: 600;
}


.breadcrumb-title h1.page-title {
	display: none;
}


.breadcrumb-item-h1 {
	display: inline;
	font-size: inherit;
	font-weight: 700;
	margin: 0;
	padding: 0;
	line-height: inherit;
	color: #795548;
}

.breadcrumb-item-h1 a {
	color: inherit;
	text-decoration: none;
}

.breadcrumb-parent-big .breadcrumb-item-h1 {
	font-size: 22px;
}

.breadcrumb-children-small .breadcrumb-item-h1 {
	font-size: 13px;
}

.breadcrumb-children-small .breadcrumb-item-h1 a {
	padding: 3px 12px;
	border-radius: 14px;
	background: #795548;
	color: #fff;
}


/* Hide empty page title block */
#block-gazeta-page-title h1:empty,
#block-gazeta-page-title:empty,
#block-gazeta-page-title h1.page-title:empty {
	display: none !important;
}

/* Also hide the block wrapper if the h1 is empty using :has if supported, or safely just hide h1 */
#block-gazeta-page-title:has(h1:empty) {
	display: none !important;
}

/* =========================================
   Article Author Card - Detail Page
   ========================================= */
.article-author-card {
	margin-bottom: 24px;
	padding: 16px 20px;
	background: linear-gradient(135deg, #fafafa 0%, #f5f0ed 100%);
	border-left: 3px solid #795548;
	border-radius: 0 8px 8px 0;
	transition: all 0.3s ease;
}

.article-author-card:hover {
	background: linear-gradient(135deg, #f5f0ed 0%, #ede5df 100%);
	box-shadow: 0 2px 12px rgba(121, 85, 72, 0.12);
}

.author-card-link {
	display: flex;
	align-items: center;
	gap: 14px;
	text-decoration: none !important;
	color: inherit;
}

.author-card-link:hover {
	text-decoration: none !important;
}

.author-card-avatar {
	flex-shrink: 0;
	width: 52px;
	height: 52px;
}

.author-avatar-img {
	width: 52px;
	height: 52px;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid #fff;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.author-card-link:hover .author-avatar-img {
	transform: scale(1.08);
	box-shadow: 0 4px 16px rgba(121, 85, 72, 0.25);
}

.author-avatar-placeholder {
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: linear-gradient(135deg, #795548, #a1887f);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 22px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.author-card-info {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.author-card-name {
	font-family: 'Roboto Slab', serif;
	font-size: 15px;
	font-weight: 700;
	color: #333;
	line-height: 1.3;
	transition: color 0.2s ease;
}

.author-card-link:hover .author-card-name {
	color: #795548;
}

.author-card-date {
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: #888;
	line-height: 1.3;
}

.author-card-date i {
	margin-right: 4px;
	font-size: 12px;
}

/* Professional News List Styles (Teaser) */
.news-list-item {
	margin-bottom: 25px;
	padding-bottom: 25px;
	border-bottom: 1px solid #e5e5e5;
	display: flex;
	/* Ensure row behaves well if bootstrap flex is enabled, or fallback */
	flex-wrap: wrap;
}

.news-list-item:last-child {
	border-bottom: none;
}

.news-teaser-left .node-image img {
	width: 100%;
	height: auto;
	border-radius: 4px;
	display: block;
	object-fit: cover;
	transition: transform 0.3s ease;
}

.news-teaser-left .node-image {
	overflow: hidden;
	border-radius: 4px;
}

.news-teaser-left:hover .node-image img {
	transform: scale(1.05);
	/* Zoom effect */
}

.news-teaser-right {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

.news-title {
	font-size: 18px;
	line-height: 1.4;
	margin-top: 5px;
	margin-bottom: 8px;
	font-weight: 700;
	font-family: 'Roboto Slab', serif;
}

.news-title a {
	color: #333;
	text-decoration: none;
	transition: color 0.2s;
}

.news-title a:hover {
	color: #795548;
	/* Theme color */
}

.news-meta {
	font-size: 13px;
	color: #888;
	margin-bottom: 10px;
	font-family: 'Roboto', sans-serif;
	display: flex;
	align-items: center;
}

.news-meta i {
	margin-right: 5px;
}

.news-summary {
	font-size: 14px;
	color: #555;
	line-height: 1.6;
}

.news-summary .summary-text {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* ==========================================================================
   COMPREHENSIVE RESPONSIVE OPTIMIZATIONS
   ========================================================================== */

/* --- TABLET (768px - 991px) --- */
@media (min-width: 768px) and (max-width: 991px) {

	/* Layout: Make content area + sidebar stack or adjust proportions */
	.region-content-wrapper {
		width: 100% !important;
		flex: 0 0 100% !important;
		max-width: 100% !important;
	}

	.sidebar-first,
	.sidebar-second {
		width: 100% !important;
		flex: 0 0 100% !important;
		max-width: 100% !important;
		padding-left: 15px !important;
		margin-top: 20px;
	}

	/* Sidebar blocks: remove left border, go full-width */
	.region-sidebar-second .block {
		border-left: none;
		padding-left: 0;
	}

	.region-sidebar-second h2.block-title {
		margin-left: 0;
	}

	/* Homepage: Breaking News */
	.block-breaking-news {
		padding-left: 15px;
		border-left: none;
		border-top: 0px solid #795548;
		min-height: auto;
	}

	.block-breaking-news h2.block-title {
		position: static;
		width: 100%;
		height: auto;
		margin-bottom: 10px;
		padding: 5px 10px;
	}

	/* Homepage: Featured News - 2 columns */
	.block-featured-news .views-row {
		width: 48%;
		float: left;
	}

	.block-featured-news .views-row:nth-child(2n+1) {
		clear: left;
		margin-right: 4%;
	}

	.block-featured-news .views-field-title a {
		font-size: 18px;
		line-height: 24px;
	}

	/* Homepage: Panel thirds - stack */
	.panel-third-widget {
		width: 100% !important;
		flex: 0 0 100% !important;
		max-width: 100% !important;
		margin-bottom: 20px;
	}

	/* Slideshow */
	.block-slideshow-homepage .views-row .field-footer-info .field-title a {
		font-size: 22px;
		line-height: 26px;
	}

	/* Taxonomy page: Breadcrumb */
	.custom-breadcrumb-wrapper {
		padding: 8px 10px;
	}

	.breadcrumb-nav-row {
		gap: 6px;
	}

	.breadcrumb-nav-row .breadcrumb-site-home {
		font-size: 13px;
	}

	.breadcrumb-parent-big {
		font-size: 18px;
	}

	/* Taxonomy: Article list grid on tablet */
	.view-list-articles .view-content>.views-row {
		grid-template-columns: 180px 1fr;
		column-gap: 15px;
	}

	/* Taxonomy: Featured article on page 2+ */
	.view-list-articles>.view-content:first-child>.views-row:first-child {
		grid-template-columns: 1fr 1fr;
	}

	/* Article detail: images */
	.node__content img {
		max-width: 100%;
		height: auto;
	}

	/* Article detail: body text */
	.node__content {
		font-size: 20px;
	}

	/* Block title: scale down */
	.main-content h2.block-title {
		height: 36px;
	}

	.main-content h2.block-title span {
		height: 34px;
		line-height: 34px;
		text-wrap: nowrap;
		font-size: 13px;
		padding: 0 15px;
	}

	/* News list teasers */
	.news-list-item {
		flex-wrap: nowrap;
	}

	.news-title {
		font-size: 16px;
	}
}


/* --- MOBILE (max-width: 767px) --- ENHANCEMENTS --- */
@media (max-width: 767px) {

	/* Global spacing */
	.main-content {
		padding-bottom: 30px;
	}

	/* Sidebar: full width, clean borders */
	.region-sidebar-second .block {
		border-left: none;
		padding-left: 0;
		padding: 15px 0;
	}

	.region-sidebar-second h2.block-title {
		margin-left: 0;
		margin-top: -10px;
	}

	/* Block titles: smaller + centered */
	.main-content h2.block-title {
		height: 34px;
		margin-bottom: 20px;
	}

	.main-content h2.block-title span {
		font-size: 12px;
		text-wrap: nowrap;
		padding: 0 12px;
		height: 32px;
		line-height: 32px;
	}

	/* Homepage: Featured news - single column */
	.block-featured-news .views-row {
		width: 100% !important;
		float: none !important;
		margin-right: 0 !important;
	}

	.block-featured-news .views-field-title a {
		font-size: 18px;
		line-height: 24px;
	}

	/* Homepage: Latest news */
	.block-latest-news .view-content .views-row {
		margin-bottom: 15px;
		padding-bottom: 15px;
	}

	/* Homepage: Popular news - stack image + text full width */
	.block-popular-news .views-row .views-field-field-image {
		float: none;
		margin-right: 0;
		margin-bottom: 10px;
		width: 100%;
		max-width: 100%;
	}

	.block-popular-news .views-row .views-field-field-image img {
		width: 100%;
		height: auto;
		aspect-ratio: 16/9;
		object-fit: cover;
	}

	.block-popular-news .views-row .views-field-title {
		font-size: 18px;
		line-height: 1.4;
	}

	/* Homepage: Slideshow */
	.block-slideshow-homepage .views-row .field-footer-info {
		padding: 10px 15px;
	}

	.block-slideshow-homepage .views-row .field-footer-info .field-title a {
		font-size: 16px;
		line-height: 20px;
	}

	/* Homepage: Panel thirds - force stack */
	.panel-third-widget {
		width: 100% !important;
		flex: 0 0 100% !important;
		max-width: 100% !important;
		margin-bottom: 15px;
	}

	/* Taxonomy Breadcrumb - Mobile Optimized */
	.custom-breadcrumb-wrapper {
		padding: 8px 10px;
		border-bottom: 1px solid #eee;
	}

	/* Navigation row: compact inline */
	.breadcrumb-nav-row {
		gap: 4px;
		margin-bottom: 6px;
		flex-wrap: wrap;
	}

	.breadcrumb-nav-row .breadcrumb-home {
		font-size: 14px;
	}

	.breadcrumb-nav-row .breadcrumb-separator {
		font-size: 11px;
	}

	.breadcrumb-nav-row .breadcrumb-site-home {
		font-size: 12px;
	}

	/* Parent category: smaller */
	.breadcrumb-parent-big {
		font-size: 15px;
		flex-shrink: 0;
	}

	.breadcrumb-parent-big .breadcrumb-item-h1 {
		font-size: 15px;
	}

	/* Children/siblings: horizontal scroll row */
	.breadcrumb-children-small {
		font-size: 12px;
		overflow-x: auto;
		flex-wrap: nowrap;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: thin;
		padding: 4px 15px;
		gap: 4px;
	}

	.breadcrumb-children-small::-webkit-scrollbar {
		height: 3px;
	}

	.breadcrumb-children-small::-webkit-scrollbar-thumb {
		background: #ccc;
		border-radius: 2px;
	}

	.breadcrumb-children-small a {
		white-space: nowrap;
		flex-shrink: 0;
		padding: 4px 8px;
		border-radius: 12px;
		font-size: 12px;
		line-height: 1.2;
	}

	.breadcrumb-children-small a:hover,
	.breadcrumb-children-small a.breadcrumb-item.active {
		background: #795548;
		color: #fff !important;
	}

	.breadcrumb-children-small .breadcrumb-item-h1 {
		font-size: 12px;
	}

	.breadcrumb-children-small .breadcrumb-item-h1 a {
		padding: 4px 8px;
		border-radius: 12px;
		background: #795548;
		color: #fff !important;
		white-space: nowrap;
	}

	/* Taxonomy: Article list - image on top */
	.view-list-articles .view-content>.views-row {
		grid-template-columns: 1fr !important;
		padding: 15px 0;
	}

	.view-list-articles .view-content>.views-row>.views-field-field-image,
	.view-list-articles .view-content>.views-row>.views-field-field-video {
		grid-column: 1;
		margin-bottom: 10px;
	}

	.view-list-articles .view-content>.views-row>.views-field-field-image img {
		width: 100%;
		aspect-ratio: 16/9;
		object-fit: cover;
	}

	.view-list-articles .view-content>.views-row>.views-field-title a {
		font-size: 17px;
	}

	/* Taxonomy: Featured article (attachment) on page 1 */
	.view-list-articles .attachment .view-content>.views-row {
		flex-direction: column;
	}

	.view-list-articles .attachment .views-field-field-image,
	.view-list-articles .attachment .node--view-mode-teaser .node-image {
		flex: none;
		max-width: 100%;
		width: 100%;
		margin-right: 0;
		margin-bottom: 12px;
	}

	.view-list-articles .attachment .views-field-title a {
		font-size: 20px;
	}

	.view-list-articles .attachment .node--view-mode-teaser .node-image {
		max-width: 100% !important;
		flex: none !important;
	}

	.view-list-articles .attachment .views-field-mo-ta,
	.view-list-articles .attachment .views-field-date-compact {
		width: 100%;
		margin-left: 0;
	}

	/* Taxonomy: Page 2+ featured */
	.view-list-articles>.view-content:first-child>.views-row:first-child {
		grid-template-columns: 1fr !important;
	}

	.view-list-articles>.view-content:first-child>.views-row:first-child>.views-field-title a {
		font-size: 20px;
	}

	/* Article Detail Page */
	.node--type-article .node__title,
	.node-header h2.node__title {
		font-size: 22px !important;
		line-height: 1.3;
	}

	.node__content {
		font-size: 20px;
		line-height: 1.7;
	}

	.node__content p {
		margin-bottom: 12px;
	}

	.node__content img {
		max-width: 100% !important;
		height: auto !important;
	}

	.node__content table {
		display: block;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.node__content h2 {
		font-size: 22px;
		line-height: 1.3;
	}

	.node__content h3 {
		font-size: 20px;
	}

	/* Article: Node image */
	.node-image,
	.node-image img {
		max-width: 100%;
		height: auto;
	}

	.node-image {
		margin-bottom: 15px;
	}

	/* Article: Meta bar */
	.node-meta-bar {
		flex-wrap: wrap;
		gap: 8px;
		font-size: 13px;
	}

	/* Article: Author Card - Mobile */
	.article-author-card {
		padding: 12px 14px;
		margin-bottom: 18px;
	}

	.author-card-avatar,
	.author-avatar-img,
	.author-avatar-placeholder {
		width: 42px !important;
		height: 42px !important;
	}

	.author-avatar-placeholder {
		font-size: 18px;
	}

	.author-card-name {
		font-size: 14px;
	}

	.author-card-date {
		font-size: 12px;
	}

	/* News list teasers (homepage/listings) */
	.news-list-item {
		flex-direction: column;
	}

	.news-teaser-left {
		width: 100% !important;
		max-width: 100% !important;
		flex: none !important;
		margin-right: 0 !important;
		margin-bottom: 12px;
	}

	.news-teaser-right {
		width: 100% !important;
		max-width: 100% !important;
		flex: none !important;
	}

	.news-title {
		font-size: 17px;
		margin-top: 0;
	}

	/* Pagination */
	.pager__items {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 5px;
		padding: 0;
	}

	.pager__item {
		margin: 0;
	}

	.pager__item a {
		padding: 8px 14px;
		font-size: 14px;
	}

	/* Footer widgets: single column */
	.footer-widget {
		padding: 20px 15px;
		min-height: auto;
		border-right: none;
		border-bottom: 1px solid #444;
	}

	/* Comments */
	.comment {
		padding: 15px;
	}

	.comment .user-picture img {
		max-width: 48px;
	}

	/* Latest news by category */
	.block-latest-news-by-category .view-content .views-row {
		width: 100% !important;
		float: none !important;
		margin-right: 0 !important;
	}

	/* Content-bottom blocks */
	#content-bottom .col-lg-4,
	#content-bottom .col-md-4 {
		width: 100% !important;
		flex: 0 0 100% !important;
		max-width: 100% !important;
		margin-bottom: 20px;
	}
}

/* --- SMALL MOBILE (max-width: 480px) --- */
@media (max-width: 480px) {

	/* Even smaller logo */
	#logo .site-branding__name,
	.logo h1 {
		font-size: 26px;
	}

	/* Block titles: compact */
	.main-content h2.block-title span {
		font-size: 11px;
		text-wrap: nowrap;
		padding: 0 10px;
	}

	/* Featured news title */
	.block-featured-news .views-field-title a {
		font-size: 16px;
		line-height: 22px;
	}

	/* Article title */
	.node--type-article .node__title,
	.node-header h2.node__title {
		font-size: 20px !important;
	}

	/* Breadcrumb */
	.breadcrumb-parent-big {
		font-size: 16px;
	}

	.breadcrumb-parent-big .breadcrumb-item-h1 {
		font-size: 16px;
	}

	/* Article list title */
	.view-list-articles .view-content>.views-row>.views-field-title a {
		font-size: 16px;
	}

	/* Node content */
	.node__content {
		font-size: 20px;
		line-height: 1.65;
	}

	/* Blockquote */
	.node__content blockquote {
		margin: 15px 5px;
		font-size: 18px;
		padding: 10px 15px;
	}
}

/* =========================================
   Mobile Portal Menu Styling (Beautify)
   ========================================= */
ul.gazeta-mobile-portal-menu {
	background-color: #fff !important;
	box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15) !important;
	border-top: 3px solid #795548 !important;
	border-radius: 0 0 4px 4px !important;
	padding: 0 !important;
}

ul.gazeta-mobile-portal-menu>li {
	display: block !important;
	width: 100% !important;
	border-bottom: 1px solid #e5e5e5 !important;
	margin: 0 !important;
}

ul.gazeta-mobile-portal-menu>li:last-child {
	border-bottom: none !important;
}

ul.gazeta-mobile-portal-menu>li>a {
	display: block !important;
	padding: 14px 20px !important;
	font-size: 15px !important;
	font-weight: 500 !important;
	color: #333 !important;
	text-decoration: none !important;
	line-height: 1.4 !important;
	transition: all 0.2s ease !important;
}

ul.gazeta-mobile-portal-menu>li>a:hover,
ul.gazeta-mobile-portal-menu>li>a:focus,
ul.gazeta-mobile-portal-menu>li>a:active {
	background-color: #f4f4f4 !important;
	color: #795548 !important;
	padding-left: 28px !important;
}


/* Mobile Menu Border Fix */
ul.gazeta-mobile-portal-menu>li {
	border-bottom: 1px solid #ccc !important;
}

/* --- User / Author Profile Page --- */
.user-profile-page .profile-header-wrapper {
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
	border-radius: 8px;
	overflow: hidden;
	margin-bottom: 40px;
	background: #fff;
	border: 1px solid #eee;
}

.user-profile-page .profile-cover {
	height: 120px;
	background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
	position: relative;
	border-bottom: 1px solid #eee;
}

.user-profile-page .profile-info-container {
	padding: 0 30px 30px;
	position: relative;
	margin-top: -60px;
	text-align: center;
}

.user-profile-page .profile-avatar {
	display: inline-block;
	position: relative;
	z-index: 10;
}

.user-profile-page .profile-avatar img {
	width: 120px;
	height: 120px;
	border-radius: 50%;
	border: 4px solid #fff;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
	object-fit: cover;
	background: #fff;
}

.user-profile-page .avatar-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 120px;
	height: 120px;
	background: #fff;
	border-radius: 50%;
	color: #ccc;
	font-size: 50px;
	border: 4px solid #fff;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.user-profile-page .profile-name {
	margin: 15px 0 5px;
	font-size: 28px;
	font-weight: 700;
	color: #333;
	font-family: 'Roboto Slab', serif;
}

.user-profile-page .profile-meta {
	color: #666;
	font-size: 14px;
	margin-top: 5px;
}

.user-profile-page .profile-meta span {
	margin: 0 10px;
	display: inline-block;
}

.user-profile-page .section-title-custom {
	border-bottom: 2px solid #eee;
	padding-bottom: 10px;
	margin-bottom: 30px;
	font-size: 20px;
	font-weight: 700;
	text-transform: uppercase;
	color: #333;
	position: relative;
	display: table;
}

.user-profile-page .section-title-custom span {
	border-bottom: 3px solid #d9534f;
	padding-bottom: 10px;
	display: inline-block;
	margin-bottom: -2px;
}

.user-profile-page .view-content .views-row {
	margin-bottom: 30px;
}

/* Hide default page title on Author Profile Page to use custom header */
body.path-user .block-page-title-block,
body.path-user h1.page-title {
	display: none !important;
}

/* Hide default empty "User Posts" View Block if present */
body.path-user .block-views-blockarticles-by-user-block-1 {
	display: none !important;
}

/* Custom User Profile: First Article Big */
.user-profile-page .first-highlight {
	margin-bottom: 30px;
	border-bottom: 1px solid #eee;
	padding-bottom: 20px;
}

.user-profile-page .first-highlight .node-teaser-item .row {
	display: flex;
	flex-direction: column;
}

.user-profile-page .first-highlight .node-teaser-item .col-md-4,
.user-profile-page .first-highlight .node-teaser-item .col-md-8 {
	width: 100% !important;
	max-width: 100% !important;
	flex: 0 0 100% !important;
	float: none !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.user-profile-page .first-highlight .node-teaser-item .node-image {
	margin-bottom: 15px;
}

.user-profile-page .first-highlight .node-teaser-item .node-image img {
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 16/9;
	object-fit: cover !important;
}

.user-profile-page .first-highlight .node-teaser-item .node__title {
	font-size: 24px;
	line-height: 1.3;
	font-weight: bold;
	margin-top: 10px;
	margin-bottom: 10px;
}

.user-profile-page .first-highlight .node-teaser-item .node__title a {
	text-decoration: none;
	color: #333;
}

/* Generic First Highlight Support for All List Views (Taxonomy, Archive, etc.) */
.view-content .first-highlight {
	margin-bottom: 30px;
	border-bottom: 1px solid #eee;
	padding-bottom: 20px;
}

.view-content .first-highlight .node-teaser-item .row {
	display: flex;
	flex-direction: column;
}

.view-content .first-highlight .node-teaser-item .col-md-4,
.view-content .first-highlight .node-teaser-item .col-md-8 {
	width: 100% !important;
	max-width: 100% !important;
	flex: 0 0 100% !important;
	float: none !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.view-content .first-highlight .node-teaser-item .node-image {
	margin-bottom: 15px;
}

.view-content .first-highlight .node-teaser-item .node-image img {
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 16/9;
	object-fit: cover !important;
}

.view-content .first-highlight .node-teaser-item .node__title {
	font-size: 24px;
	font-weight: bold;
	margin-top: 10px;
}

.view-content .first-highlight .node-teaser-item .node__title a {
	text-decoration: none;
	color: #333;
}

/* Responsive Layout for First Highlight */
/* Mobile: Stack (Default) */
body .view-content .first-highlight .node-teaser-item .row {
	display: flex !important;
	flex-direction: column !important;
}

body .view-content .first-highlight .node-teaser-item .col-md-4,
body .view-content .first-highlight .node-teaser-item .col-md-8 {
	width: 100% !important;
	max-width: 100% !important;
	flex: 0 0 100% !important;
	padding: 0 !important;
}

body .view-content .first-highlight .node-teaser-item .col-md-4 {
	margin-bottom: 15px;
	/* Spacing between image and text on mobile */
}

/* Desktop/Tablet (min-width: 768px): 50/50 Split */
@media (min-width: 768px) {
	body .view-content .first-highlight .node-teaser-item .row {
		flex-direction: row !important;
	}

	body .view-content .first-highlight .node-teaser-item .col-md-4 {
		width: 50% !important;
		max-width: 50% !important;
		flex: 0 0 50% !important;
		padding-right: 15px !important;
		margin-bottom: 0;
	}

	body .view-content .first-highlight .node-teaser-item .col-md-8 {
		width: 50% !important;
		max-width: 50% !important;
		flex: 0 0 50% !important;
		padding-left: 15px !important;
	}

	/* Ensure Image fills the 50% column */
	body .view-content .first-highlight .node-teaser-item .node-image,
	body .view-content .first-highlight .node-teaser-item .node-image a,
	body .view-content .first-highlight .node-teaser-item .node-image img {
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
		display: block !important;
	}
}

/* SHOW SUMMARY for all teasers (User Request) */
.node-teaser-item .node__content,
.node-teaser-item .node__summary {
	display: block !important;
	margin-top: 5px;
	color: #666;
	font-size: 14px;
	line-height: 1.5;
}

.node-teaser-item .node__meta {
	margin-bottom: 5px;
	color: #888;
	font-size: 12px;
}

.user-profile-page .first-highlight .node-teaser-item .node__title a:hover {
	color: #0056b3;
}

.user-profile-page .first-highlight .node-teaser-item .node__content,
.user-profile-page .first-highlight .node-teaser-item .node__summary {
	font-size: 16px;
	line-height: 1.5;
	color: #555;
}

/* Hide redundant fields after article body */
.node--type-article.node--view-mode-full .field--name-field-category,
.node--type-article.node--view-mode-full .field--name-field-linh-vuc,
.node--type-article.node--view-mode-full .field--name-field-tac-gia,
.node--type-article.node--view-mode-full .field--name-field-mo-ta,

#block-views-block-author-block-block-1 {
	display: none;
}

/* Related Articles Styling - CSS Grid Layout */
#block-views-block-relate-articles-block-1 .views-row {
	display: grid;
	grid-template-columns: 260px 1fr;
	column-gap: 20px;
	margin-bottom: 25px;
	padding-bottom: 25px;
	border-bottom: 1px solid #eee;
	align-items: start;
	overflow: hidden;
}

/* Image Column - spans all rows */
#block-views-block-relate-articles-block-1 .views-field-field-image {
	grid-column: 1;
	grid-row: 1 / 20;
	width: 100%;
	margin: 0;
}

#block-views-block-relate-articles-block-1 .views-field-field-image img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 4px;
	object-fit: cover;
	aspect-ratio: 4/3;
}

/* Content Column - all items in column 2 */
#block-views-block-relate-articles-block-1 .views-field-title,
#block-views-block-relate-articles-block-1 .views-field-field-mo-ta,
#block-views-block-relate-articles-block-1 .views-field-user-picture,
#block-views-block-relate-articles-block-1 .views-field-name,
#block-views-block-relate-articles-block-1 .views-field-created,
#block-views-block-relate-articles-block-1 .views-field-created-2 {
	grid-column: 2;
	width: 100%;
}

/* ORDER: Title(1) > Author+Date(2) > Description(3) */
#block-views-block-relate-articles-block-1 .views-field-title {
	order: 1;
	margin-top: -3px;
	margin-bottom: 5px;
}

#block-views-block-relate-articles-block-1 .views-field-name {
	order: 2;
}

#block-views-block-relate-articles-block-1 .views-field-field-mo-ta {
	order: 3;
}

/* Hide suppressed fields (merged into name by PHP) */
#block-views-block-relate-articles-block-1 .views-field-user-picture,
#block-views-block-relate-articles-block-1 .views-field-created,
#block-views-block-relate-articles-block-1 .views-field-created-2,
#block-views-block-relate-articles-block-1 .views-field-view-node {
	display: none !important;
}

/* Title */
#block-views-block-relate-articles-block-1 .views-field-title a {
	font-size: 18px;
	font-weight: 700;
	color: #333;
	text-decoration: none;
	line-height: 1.35;
	display: block;
}

#block-views-block-relate-articles-block-1 .views-field-title a:hover {
	color: #c00;
}

/* Author + Date Row (2-column flex) */
#block-views-block-relate-articles-block-1 .author-date-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 6px 0 8px;
	font-size: 13px;
}

#block-views-block-relate-articles-block-1 .author-date-row .author-col {
	display: flex;
	align-items: center;
}

#block-views-block-relate-articles-block-1 .author-date-row .author-col a {
	display: flex;
	align-items: center;
	color: #444;
	font-weight: 600;
	text-decoration: none;
}

#block-views-block-relate-articles-block-1 .author-date-row .author-col a:hover {
	color: #c00;
}

#block-views-block-relate-articles-block-1 .author-date-row .author-col img {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	object-fit: cover;
	margin-right: 8px;
	flex-shrink: 0;
}

#block-views-block-relate-articles-block-1 .author-date-row .date-col {
	color: #888;
	font-size: 12px;
	white-space: nowrap;
	flex-shrink: 0;
}

/* Description */
#block-views-block-relate-articles-block-1 .views-field-field-mo-ta {
	font-size: 14px;
	color: #555;
	line-height: 1.5;
	margin-bottom: 0;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ========== MOBILE RESPONSIVE for Related Articles ========== */
@media (max-width: 767px) {
	#block-views-block-relate-articles-block-1 .views-row {
		grid-template-columns: 1fr !important;
		column-gap: 0;
		margin-bottom: 20px;
		padding-bottom: 20px;
	}

	/* Mobile order: Author+Date(1) ? Image(2) ? Title(3) ? Description(4) */
	#block-views-block-relate-articles-block-1 .views-field-name {
		order: 1;
		grid-column: 1;
	}

	#block-views-block-relate-articles-block-1 .views-field-field-image {
		order: 2;
		grid-column: 1;
		grid-row: auto;
		margin-bottom: 10px;
	}

	#block-views-block-relate-articles-block-1 .views-field-title {
		order: 3;
		grid-column: 1;
	}

	#block-views-block-relate-articles-block-1 .views-field-field-mo-ta {
		order: 4;
		grid-column: 1;
		-webkit-line-clamp: 2;
		font-size: 13px;
	}

	#block-views-block-relate-articles-block-1 .views-field-field-image img {
		width: 100%;
		aspect-ratio: 16/9;
		object-fit: cover;
	}

	#block-views-block-relate-articles-block-1 .views-field-title a {
		font-size: 16px;
	}

	/* Author-date row on mobile */
	#block-views-block-relate-articles-block-1 .author-date-row {
		flex-wrap: wrap;
		gap: 4px;
		margin: 0 0 8px;
	}
}

/* ========== TABLET RESPONSIVE for Related Articles ========== */
@media (min-width: 768px) and (max-width: 991px) {
	#block-views-block-relate-articles-block-1 .views-row {
		grid-template-columns: 180px 1fr;
		column-gap: 15px;
	}

	#block-views-block-relate-articles-block-1 .views-field-title a {
		font-size: 16px;
	}





}

/* --- FORCE IPAD MINI 2-COLUMN LAYOUT (768px - 991px) --- */
@media (min-width: 768px) and (max-width: 991px) {

	/*
	 * page--front.html.twig DOM structure:
	 * .main-content.container > .row >
	 *   div:nth-child(1) = Messages/Help (usually empty, height=0)
	 *   div:nth-child(2) = Main Content (col-lg-8)
	 *   aside:nth-child(3) = Sidebar Second (col-lg-4)
	 *
	 * Problem: Both divs have col-sm-12 = 100% width at 768px
	 * Solution: 1st div = 100% (collapses), 2nd div = 66%, aside = 33%
	 */

	/* 1. Messages/Help div (1st child) - collapse it, full width row */
	.main-content>.row>div:first-child {
		width: 100% !important;
		float: none !important;
		clear: both !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	/* 2. Main Content div (2nd child) = Left Column ~66% */
	.main-content>.row>div:nth-child(2) {
		width: 66.66666667% !important;
		max-width: 66.66666667% !important;
		float: left !important;
		clear: none !important;
		position: relative;
	}

	/* For page.html.twig (non-front pages) - content is usually 1st div */
	.main-content-inner>.row>div:first-child {
		width: 66.66666667% !important;
		max-width: 66.66666667% !important;
		float: left !important;
		clear: none !important;
		position: relative;
	}

	/* 3. Sidebar Second = Right Column ~33% */
	.main-content>.row>aside.sidebar-second,
	.main-content-inner>.row>aside.sidebar-second {
		width: 33.33333333% !important;
		max-width: 33.33333333% !important;
		float: left !important;
		clear: none !important;
		position: relative;
		margin-top: 0 !important;
	}

	/* 4. Inner wrappers must fill their parent container */
	.region-content-wrapper {
		width: 100% !important;
		float: none !important;
	}

	/* 5. Sidebar First (inside Content div) - stack it */
	.sidebar-first {
		width: 100% !important;
	}
}

/* --- RESPONSIVE HEADER (iPad/Mobile: < 992px) --- */  @media (max-width: 991px)  {
	        /* Stack Logo & Content Vertically */      .header>.row  {
		          display:  flex;
		          flex-direction:  column;
		          align-items:  center;
		          justify-content:  center;
		      
	}

	        /* 1. Logo: Center & Middle */      #logo.logo.col-md-4  {
		          width:  100%  !important;
		          max-width:  100%  !important;
		          text-align:  center  !important;
		          margin-bottom:  15px;
		          display:  flex;
		          justify-content:  center;
		          align-items:  center;
		          padding:  10px 0;
		          float:  none  !important;
		      
	}

	        #logo.logo.col-md-4 a  {
		          display:  inline-block;
		          text-align:  center;
		          width:  100%;
		      
	}

	        #logo.logo.col-md-4 img  {
		          display:  inline-block;
		          max-width:  250px;
		          /* Limit logo width */          height:  auto;
		          margin:  0 auto;
		      
	}

	        /* 2. Header Content (Events Block): Compact & Centered */      .header .col-md-8  {
		          width:  100%  !important;
		          max-width:  100%  !important;
		          padding:  0 15px;
		          float:  none  !important;
		          text-align:  center;
		      
	}

	        /* Block Style */      .header .block  {
		          margin-bottom:  10px;
		          background:  transparent;
		      
	}

	        /* Block Title "S??? KI??  N N?? I B???T"  */      .header .block h2.block-title  {
		          font-size:  16px  !important;
		          padding:  8px 15px  !important;
		          margin:  0 auto 10px auto  !important;
		          text-align:  center;
		          display:  inline-block;
		          min-width:  200px;
		          line-height:  1.2;
		          border-radius:  4px;
		      
	}

	        /* Remove potential span background */      .header .block h2.block-title span  {
		          background:  transparent  !important;
		          padding:  0  !important;
		          font-size:  inherit  !important;
		      
	}

	        /* Article Link inside Block */      .header .view-content .views-field-title,
	      .header .view-content .views-field-title a  {
		          font-size:  18px  !important;
		          line-height:  1.4;
		          font-weight:  700;
		          color:  #333;
		          text-align:  center;
		          display:  block;
		          margin-bottom:  5px;
		      
	}

	        /* Hide contextual links to clean up layout */      .header .contextual  {
		          display:  none  !important;
		      
	}

	  
}

  /* --- RESPONSIVE HEADER v2 (iPad/Mobile: < 992px) --- */  @media (max-width: 991px)  {
	        /* 1. HEADER ROW: Use Flexbox to Center & Stack */      .header>.row  {
		          display:  flex;
		          flex-direction:  column;
		          align-items:  center;
		          justify-content:  center;
		          width:  100%;
		          margin:  0  !important;
		      
	}

	        /* 2. LOGO: Force Center Alignment */      #logo.logo.col-md-4  {
		          width:  100%  !important;
		          max-width:  100%  !important;
		          flex:  0 0 auto;
		          margin:  15px 0 20px 0  !important;
		          padding:  0  !important;
		          float:  none  !important;
		          /* Flex centering */          display:  flex;
		          flex-direction:  column;
		          align-items:  center;
		          justify-content:  center;
		          text-align:  center;
		      
	}

	        #logo.logo.col-md-4 a  {
		          display:  inline-block;
		          max-width:  100%;
		      
	}

	        #logo.logo.col-md-4 img  {
		          display:  block;
		          max-width:  280px;
		          /* Logical size for iPad/Mobile */          height:  auto;
		          margin:  0 auto;
		      
	}

	        /* 3. HEADER CONTENT (Events Block) */      /* Ensure container is visible and full width */      .header .col-md-8  {
		          width:  100%  !important;
		          max-width:  100%  !important;
		          flex:  0 0 auto;
		          padding:  0 15px  !important;
		          float:  none  !important;
		          display:  block  !important;
		          overflow:  visible  !important;
		          height:  auto  !important;
		          min-height:  50px;
		      
	}

	        /* Fix Disappearing View Content */      .header .view-content,
	      .header .view-content .views-row  {
		          display:  block  !important;
		          width:  100%  !important;
		          clear:  both  !important;
		          float:  none  !important;
		          overflow:  visible  !important;
		          opacity:  1  !important;
		          visibility:  visible  !important;
		      
	}

	        /* Article Title (Inside Block) */      .header .views-field-title a  {
		          font-size:  18px  !important;
		          line-height:  1.4;
		          font-weight:  700;
		          color:  #333;
		          text-align:  center;
		          display:  block;
		          margin:  10px auto;
		          white-space:  normal  !important;
		      
	}

	        /* Block Title (S??? KI?? N N?? I B???T) */      .header .block h2.block-title  {
		          font-size:  14px  !important;
		          padding:  6px 15px  !important;
		          margin:  0 auto 15px auto  !important;
		          text-align:  center;
		          display:  table;
		          /* Shrink to fit text */          border-radius:  3px;
		          background-color:  #795548  !important;
		          color:  #fff  !important;
		      
	}

	        .header .contextual  {
		          display:  none  !important;
		      
	}

	  
}

  /* --- RESPONSIVE HEADER v4 (FINAL) --- */  @media (max-width: 991px)  {
	        /* Prevent layout breaking */      .header  {
		          overflow:  visible  !important;
		      
	}

	        .header>.row  {
		          display:  flex;
		          flex-direction:  column;
		          align-items:  center;
		          width:  100%;
		          margin:  0  !important;
		      
	}

	        /* LOGO CENTER */      #logo.logo.col-md-4  {
		          width:  100%  !important;
		          max-width:  100%  !important;
		          flex:  0 0 auto;
		          margin:  15px 0 15px 0  !important;
		          padding:  0  !important;
		          float:  none  !important;
		          display:  flex;
		          flex-direction:  column;
		          align-items:  center;
		          justify-content:  center;
		          text-align:  center;
		      
	}

	        #logo.logo.col-md-4 a  {
		          display:  inline-block;
		          max-width:  100%;
		      
	}

	        #logo.logo.col-md-4 img  {
		          display:  block;
		          max-width:  260px;
		          height:  auto;
		          margin:  0 auto;
		      
	}

	        /* HEADER CONTENT */      .header .col-md-8  {
		          width:  100%  !important;
		          max-width:  100%  !important;
		          padding:  0 10px  !important;
		          float:  none  !important;
		          display:  block  !important;
		          overflow:  visible  !important;
		          min-height:  80px;
		          height:  auto  !important;
		      
	}

	        /* FIX INVISIBLE CONTENT */      .header .block-breaking-news,
	      .header .block-views  {
		          display:  block  !important;
		          width:  100%  !important;
		          min-height:  50px;
		          height:  auto  !important;
		          overflow:  visible  !important;
		          visibility:  visible  !important;
		          opacity:  1  !important;
		          background:  transparent  !important;
		          border:  none  !important;
		          margin-bottom:  20px;
		      
	}

	        .header .block-breaking-news .content,
	      .header .block-views .content  {
		          display:  block  !important;
		          height:  auto  !important;
		      
	}

	        /* CONTENT */      .header .view-content  {
		          display:  block  !important;
		          width:  100%  !important;
		          overflow:  visible  !important;
		      
	}

	        /* LINK STYLING */      .header .views-field-title a  {
		          font-size:  18px  !important;
		          line-height:  1.4;
		          font-weight:  700;
		          color:  #333;
		          text-align:  center;
		          display:  block;
		          margin:  10px auto;
		          white-space:  normal  !important;
		      
	}

	        /* BLOCK TITLE */      .header .block h2.block-title  {
		          font-size:  14px  !important;
		          padding:  6px 15px  !important;
		          margin:  0 auto 10px auto  !important;
		          text-align:  center;
		          display:  table;
		          border-radius:  3px;
		          background-color:  #795548  !important;
		          color:  #fff  !important;
		      
	}

	        /* Clean up */      .header .contextual  {
		          display:  none  !important;
		      
	}

	  
}

  /* --- RESPONSIVE HEADER v5 (FINAL FIX SLIDER) --- */  @media (max-width: 991px)  {
	        /* 1. HEADER LAYOUT: Flex Column */      .header>.row  {
		          display:  flex;
		          flex-direction:  column;
		          align-items:  center;
		          width:  100%;
		          margin:  0  !important;
		      
	}

	        /* 2. LOGO: CENTER */      #logo.logo.col-md-4  {
		          width:  100%  !important;
		          max-width:  100%  !important;
		          flex:  0 0 auto;
		          margin:  10px 0 15px 0  !important;
		          padding:  0  !important;
		          float:  none  !important;
		          display:  flex;
		          flex-direction:  column;
		          align-items:  center;
		          justify-content:  center;
		      
	}

	        #logo.logo.col-md-4 img  {
		          display:  block;
		          max-width:  260px;
		          height:  auto;
		          margin:  0 auto;
		      
	}

	        /* 3. HEADER CONTENT CONTAINER */      .header .col-md-8  {
		          width:  100%  !important;
		          max-width:  100%  !important;
		          padding:  0 10px  !important;
		          float:  none  !important;
		          display:  block  !important;
		          min-height:  100px;
		          /* Do NOT force height:  auto here,  let content dictate or JS set it */      
	}

	        /* 4. BLOCK BREAKING NEWS (EVENT SLIDER) */      .header .block-breaking-news  {
		          width:  100%  !important;
		          max-width:  500px;
		          /* Limit width */          margin:  0 auto 10px auto  !important;
		          padding:  0  !important;
		          background:  transparent  !important;
		          border:  none  !important;
		          position:  relative  !important;
		          display:  block  !important;
		          opacity:  1  !important;
		          visibility:  visible  !important;
		          min-height:  80px;
		      
	}

	        /* TITLE: S??? KI?? N N?? I B???T */      .header .block-breaking-news h2.block-title  {
		          font-size:  14px  !important;
		          padding:  5px 15px  !important;
		          margin:  0 auto 8px auto  !important;
		          text-align:  center;
		          display:  table;
		          border-radius:  3px;
		          background-color:  #795548  !important;
		          color:  #fff  !important;
		      
	}

	        /* 5. SLIDER CONTENT RESTORATION */      /* Important: Allow JS to control height/overflow */      .header .news-ticker,
	      .header .view-content  {
		          display:  block  !important;
		          width:  100%  !important;
		          margin:  0 auto  !important;
		          /* Do NOT override height or overflow */      
	}

	        /* 6. STYLE TEXT ONLY */      .header .views-field-title a  {
		          font-size:  16px  !important;
		          line-height:  1.4;
		          font-weight:  700;
		          color:  #333;
		          text-align:  center;
		          display:  block;
		          margin:  0 auto;
		          white-space:  normal  !important;
		      
	}

	        .header .views-field-created  {
		          font-size:  12px  !important;
		          color:  #666;
		          text-align:  center;
		          margin-top:  3px;
		          display:  block;
		      
	}

	        .header .views-field-field-category  {
		          display:  none  !important;
		          /* Hide category to save space */      
	}

	        /* Remove context links */      .header .contextual  {
		          display:  none  !important;
		      
	}

	  
}

  /* --- RESPONSIVE HEADER v6 (SLIDER FIX) --- */  @media (max-width: 991px)  {
	        /* Layout Structure: Column Force */      .header>.row  {
		          display:  flex;
		          flex-direction:  column;
		          align-items:  center;
		          width:  100%;
		          margin:  0  !important;
		      
	}

	        /* LOGO */      #logo.logo.col-md-4  {
		          width:  100%  !important;
		          max-width:  100%  !important;
		          flex:  0 0 auto;
		          margin:  15px 0  !important;
		          padding:  0  !important;
		          float:  none  !important;
		          display:  flex;
		          justify-content:  center;
		          text-align:  center;
		      
	}

	        #logo.logo.col-md-4 img  {
		          display:  block;
		          max-width:  260px;
		          height:  auto;
		          margin:  0 auto;
		      
	}

	        #logo.logo.col-md-4 a  {
		          display:  block;
		          width:  100%;
		      
	}

	        /* HEADER REGION CONTAINER */      .header .col-md-8  {
		          width:  100%  !important;
		          max-width:  100%  !important;
		          padding:  0 10px  !important;
		          float:  none  !important;
		          display:  block  !important;
		          min-height:  50px;
		      
	}

	        /* BREAKING NEWS BLOCK */      .header .block-breaking-news  {
		          width:  100%  !important;
		          max-width:  600px;
		          margin:  0 auto 15px auto  !important;
		          padding:  0  !important;
		          background:  transparent  !important;
		          border:  none  !important;
		          position:  relative;
		          display:  block  !important;
		          visibility:  visible  !important;
		          opacity:  1  !important;
		      
	}

	        /* TITLE STYLE */      .header .block-breaking-news h2.block-title  {
		          font-size:  14px  !important;
		          padding:  5px 15px  !important;
		          margin:  0 auto 10px auto  !important;
		          text-align:  center;
		          display:  table;
		          background-color:  #795548  !important;
		          color:  #fff  !important;
		          border-radius:  3px;
		      
	}

	        /* SLICK SLIDER FIXES */      /* Ensure container has proper layout for slick initialization */      .header .news-ticker,
	      .header .view-content  {
		          display:  block;
		          width:  100%;
		          /* Default height needed for vertical slider? Let JS handle it but ensure block context */      
	}

	        /* Force items to show one at a time via CSS just in case JS fails */      .header .news-ticker .item  {
		          display:  block;
		          width:  100%;
		          text-align:  center;
		          padding:  5px 0;
		      
	}

	        /* Hide extra items if JS fails (optional fallback) */      /* .header .news-ticker .item:not(:first-child)  {
		 display:  none;
		 
	}

	 */      /* But since user wants slider,
	 we trust JS. */        /* TEXT STYLING */      .header .views-field-title  {
		          font-size:  16px  !important;
		          line-height:  1.4;
		          font-weight:  700;
		          color:  #333;
		          text-align:  center;
		          margin:  0 auto;
		          width:  100%;
		      
	}

	        .header .views-field-title a  {
		          color:  #333;
		          text-decoration:  none;
		          display:  inline-block;
		          white-space:  normal;
		      
	}

	        .header .views-field-created  {
		          font-size:  12px;
		          color:  #777;
		          margin-top:  4px;
		          text-align:  center;
		      
	}

	        /* Hide Category on mobile to save vertical space */      .header .views-field-field-category  {
		          display:  none  !important;
		      
	}

	        /* Remove context links */      .header .contextual  {
		          display:  none  !important;
		      
	}

	  
}

   #block-views-block-video-block-1 {
	overflow: hidden;
}

#block-views-block-video-block-1 .views-field-field-video,
#block-views-block-video-block-1 .views-field-created {
	display: none !important;
	/* ?n field m?c d?nh b? trng */
}

#block-views-block-video-block-1 .view-content .col-md-6 {
	width: 100% !important;
	padding: 0 !important;
	margin-bottom: 20px;
	clear: both;
}

#block-views-block-video-block-1 .views-field-title {
	padding: 0 !important;
}

/* Th?t k? Thumbnail v Play Icon */
.custom-video-item {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.custom-video-thumb {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
	border-radius: 8px;
	overflow: hidden;
	background: #000;
	display: block;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
	transition: transform 0.3s ease;
}

.custom-video-thumb:hover {
	transform: translateY(-2px);
}

.custom-video-thumb img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.custom-video-play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: rgba(206, 32, 39, 0.9);
	width: 48px;
	height: 48px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
	transition: background 0.3s;
}

.custom-video-thumb:hover .custom-video-play {
	background: rgba(230, 0, 10, 1);
	transform: translate(-50%, -50%) scale(1.05);
}

.custom-video-play svg {
	margin-left: 3px;
	width: 24px;
	height: 24px;
	fill: white;
}

.custom-video-info .video-title {
	margin: 0 0 6px 0;
	font-size: 16px;
	line-height: 1.4;
	font-weight: 600;
}

.custom-video-info .video-title a {
	color: #333;
	text-decoration: none;
	transition: color 0.2s;
}

.custom-video-info .video-title a:hover {
	color: #ce2027;
}

.custom-video-info .video-date {
	color: #888;
	font-size: 12px;
	text-transform: uppercase;
	font-weight: 500;
}

/* Style cho list bn du?i (khai bo class n?u mu?n d?ng list) */
.custom-video-list-item {
	display: flex;
	flex-direction: row;
	gap: 12px;
	align-items: flex-start;
}

.custom-video-list-item .custom-video-thumb {
	width: 120px;
	padding-top: 0;
	height: 68px;
	flex-shrink: 0;
	border-radius: 6px;
}

.custom-video-list-item .custom-video-play {
	width: 32px;
	height: 32px;
}

.custom-video-list-item .custom-video-play svg {
	width: 16px;
	height: 16px;
}

.custom-video-list-item .custom-video-info .video-title {
	font-size: 14px;
	margin-bottom: 4px;
}

/* Custom CSS cho Block Video Cột Phải - Mặc định Drupal Views */
#block-views-block-video-block-1 {
	overflow: hidden;
}

#block-views-block-video-block-1 .view-content .col-md-6.views-row {
	width: 100% !important;
	padding: 0 !important;
	margin: 0 0 20px 0 !important;
	float: none !important;
	clear: both;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

#block-views-block-video-block-1 .views-field-field-video {
	position: relative;
	width: 100%;
	margin: 0;
	padding: 0;
	overflow: hidden;
	border-radius: 6px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}

#block-views-block-video-block-1 .views-field-field-video:hover {
	transform: translateY(-2px);
	transition: transform 0.3s ease;
}

#block-views-block-video-block-1 .views-field-field-video img {
	width: 100%;
	height: auto;
	display: block;
	aspect-ratio: 16/9;
	object-fit: cover;
}

/* Add custom play button overlay via pseudo-element */
#block-views-block-video-block-1 .views-field-field-video .field-content a {
	position: relative;
	display: block;
}

/* Using a simple custom play button background and an empty content so we don't need svg data URI hell */
#block-views-block-video-block-1 .views-field-field-video .field-content a::after {
	content: "▶";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: rgba(206, 32, 39, 0.9);
	color: white;
	font-size: 20px;
	line-height: 48px;
	text-align: center;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	display: block;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
	transition: all 0.3s ease;
	padding-left: 2px;
	/* optical center */
}

#block-views-block-video-block-1 .views-field-field-video:hover .field-content a::after {
	background-color: rgba(230, 0, 10, 1);
	transform: translate(-50%, -50%) scale(1.1);
}

#block-views-block-video-block-1 .views-field-title {
	margin: 0 0 4px 0;
	padding: 0 !important;
}

#block-views-block-video-block-1 .views-field-title a {
	font-size: 16px;
	line-height: 1.4;
	font-weight: 600;
	color: #333;
	text-decoration: none;
	transition: color 0.2s;
	display: block;
}

#block-views-block-video-block-1 .views-field-title a:hover {
	color: #ce2027;
}

#block-views-block-video-block-1 .views-field-created {
	color: #888;
	font-size: 12px;
	text-transform: uppercase;
	font-weight: 500;
}

/* Custom CSS cho TRANG Video List (/phap-luat/vi/video) */
.view-list-video {
	margin-top: 20px;
}

.view-list-video .view-content {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}

/* Remove bootstrap clearfix interference from flex layout */
.view-list-video .view-content::before,
.view-list-video .view-content::after {
	display: none !important;
}

.view-list-video .views-row {
	display: flex;
	flex-direction: column;
	width: calc(33.333% - 14px) !important;
	/* 3 columns layout */
	margin-bottom: 20px !important;
	padding: 0 !important;
	clear: none !important;
	float: none !important;
}

/* Responsive grid cho trang danh sách video */
@media (max-width: 991px) {
	.view-list-video .views-row {
		width: calc(50% - 10px) !important;
	}
}

@media (max-width: 767px) {
	.view-list-video .views-row {
		width: 100% !important;
	}
}

/* Ẩn các trường gốc không cần thiết (field_video gốc, div created gốc) do đã có block rewrite trong views-field-title */
.view-list-video .views-field-field-video,
.view-list-video .views-field-created {
	display: none !important;
}

/* Tinh chỉnh phần custom-video-item bị lồng bên trong field-title */
.view-list-video .views-field-title {
	width: 100%;
	padding: 0 !important;
}

.view-list-video .custom-video-item {
	display: block;
	width: 100%;
}

/* ============================================
   FOOTER COLUMNS 2 & 3 STYLING
   ============================================ */

/* --- Footer Section Titles --- */
.panel-third .footer-section-title {
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	margin: 0 0 15px 0;
	padding-bottom: 10px;
	border-bottom: 2px solid #795548;
	font-family: 'Roboto Condensed', 'Roboto', sans-serif !important;
}

.panel-third .footer-section-title i {
	margin-right: 8px;
	color: #795548;
}

/* --- Footer Link Lists --- */
.panel-third .footer-link-list {
	list-style: none;
	padding: 0;
	margin: 0 0 10px 0;
}

.panel-third .footer-link-list li {
	margin-bottom: 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.panel-third .footer-link-list li:last-child {
	border-bottom: none;
}

.panel-third .footer-link-list li a {
	display: block;
	color: #aaa;
	font-size: 13px;
	padding: 8px 0 8px 2px;
	transition: color 0.2s ease, padding-left 0.25s ease, background 0.2s ease;
	line-height: 1.5;
	font-family: 'Roboto', sans-serif !important;
}

.panel-third .footer-link-list li a:hover {
	color: #fff;
	padding-left: 8px;
	background: rgba(121, 85, 72, 0.15);
	border-radius: 3px;
}

.panel-third .footer-link-list li a i.fa-angle-right {
	color: #795548;
	margin-right: 6px;
	transition: transform 0.2s ease;
}

.panel-third .footer-link-list li a:hover i.fa-angle-right {
	transform: translateX(3px);
	color: #a1887f;
}

/* --- Footer Văn bản list --- */
.panel-third .footer-vanban-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.panel-third .footer-vanban-list li {
	margin-bottom: 0;
	padding: 7px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.panel-third .footer-vanban-list li:last-child {
	border-bottom: none;
}

.panel-third .footer-vanban-list li a {
	display: block;
	color: #aaa;
	font-size: 13px;
	line-height: 1.5;
	transition: color 0.2s ease, padding-left 0.25s ease;
	font-family: 'Roboto', sans-serif !important;
}

.panel-third .footer-vanban-list li a:hover {
	color: #fff;
	padding-left: 6px;
}

.panel-third .footer-vanban-list li a i.fa-angle-right {
	color: #795548;
	margin-right: 5px;
}

.panel-third .footer-vb-sohieu {
	display: inline-block;
	background: rgba(121, 85, 72, 0.25);
	color: #a1887f;
	font-size: 11px;
	font-weight: 600;
	padding: 1px 8px;
	border-radius: 3px;
	margin-top: 3px;
	font-family: 'Roboto Condensed', sans-serif !important;
	letter-spacing: 0.3px;
}

/* --- Footer "Xem tất cả" link --- */
.panel-third .footer-vanban-more {
	margin-top: 15px;
	padding-top: 12px;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.panel-third .footer-vanban-more a {
	color: #795548;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	transition: color 0.2s ease, letter-spacing 0.2s ease;
	font-family: 'Roboto Condensed', sans-serif !important;
}

.panel-third .footer-vanban-more a:hover {
	color: #a1887f;
	letter-spacing: 1px;
}

.panel-third .footer-vanban-more a i {
	margin-right: 6px;
}

/* --- Footer Nav Links wrapper --- */
.panel-third .footer-nav-links {
	padding: 0 10px;
}

/* --- Footer Nav Two Columns Layout --- */
.panel-third .footer-nav-two-cols {
	display: flex;
	gap: 20px;
}

.panel-third .footer-nav-col {
	flex: 1;
	min-width: 0;
}

/* --- Footer Văn bản mới wrapper with scroll --- */
.panel-third .footer-vanban-moi {
	padding: 0 10px;
}

.panel-third .footer-vanban-list {
	max-height: 320px;
	overflow-y: auto;
	padding-right: 5px;
}

/* Custom scrollbar for footer vanban list */
.panel-third .footer-vanban-list::-webkit-scrollbar {
	width: 4px;
}

.panel-third .footer-vanban-list::-webkit-scrollbar-track {
	background: rgba(255, 255, 255, 0.05);
	border-radius: 2px;
}

.panel-third .footer-vanban-list::-webkit-scrollbar-thumb {
	background: #795548;
	border-radius: 2px;
}

.panel-third .footer-vanban-list::-webkit-scrollbar-thumb:hover {
	background: #a1887f;
}

.panel-third .footer-vb-ngay {
	display: inline-block;
	background: rgba(255, 255, 255, 0.05);
	color: #999;
	padding: 2px 6px;
	border-radius: 3px;
	font-size: 10px;
	margin-top: 5px;
	margin-left: 5px;
	border: 1px solid rgba(255, 255, 255, 0.1);
	font-weight: normal;
}