/**
 * Cassiopeia Biodanza - grafica del vecchio sito Biodanza Verona (ex JSN Epic Free, Joomla 3)
 * Child template di Cassiopeia (Joomla 6). I colori principali sono variabili impostate
 * da index.php a partire dai parametri dello stile template.
 */

:root {
	--bz-page-width: 80%;
	--bz-body-bg: #df4665;
	--bz-menu-bg: #dfc42f;
	--bz-menu-active-bg: #7e8ebe;
	--bz-link: #009aca;
	--bz-bottom-bg: #c7561f;
	--bz-dark: #404040;
	--bz-font-body: Arial, Helvetica, sans-serif;
	--bz-font-head: Verdana, Geneva, Arial, Helvetica, sans-serif;
}

/* ============================== BASE ============================== */
body#jsn-master {
	margin: 0;
	padding: 0;
	font-family: var(--bz-font-body);
	font-size: 14px;
	line-height: 1.5;
	color: #333;
	background: var(--bz-body-bg);
	background-attachment: fixed;
}

#jsn-master a {
	color: var(--bz-link);
	text-decoration: none;
	outline: none;
}

#jsn-master a:hover {
	color: #444;
	text-decoration: none;
}

#jsn-master h1,
#jsn-master h2,
#jsn-master h3,
#jsn-master h4,
#jsn-master h5,
#jsn-master h6 {
	font-family: var(--bz-font-head);
	font-weight: normal;
	margin: 0.5em 0;
	line-height: 1.5;
}

#jsn-master h1 { font-size: 1.6em; color: #000; }
#jsn-master h2 { font-size: 1.4em; color: #000; }
#jsn-master h3 { font-size: 1.3em; color: #cc0000; }
#jsn-master h4 { font-size: 1.2em; color: #d59500; }
#jsn-master h5 { font-size: 1.1em; color: #5a8406; font-weight: bold; }
#jsn-master h6 { font-size: 1.1em; color: #663300; font-weight: bold; }

#jsn-master p,
#jsn-master pre,
#jsn-master blockquote,
#jsn-master dl,
#jsn-master ul,
#jsn-master ol,
#jsn-master address {
	margin: 10px 0;
}

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

#jsn-master blockquote {
	color: var(--bz-dark);
	font-style: italic;
	padding-left: 20px;
	border-left: 5px solid var(--bz-dark);
}

/* ============================== PAGINA ============================== */
#jsn-page {
	width: var(--bz-page-width);
	min-width: var(--bz-page-width);
	margin: 0 auto;
	color: #000;
	background-color: #fff;
	border-left: 2px solid #000;
	border-right: 2px solid #000;
}

#jsn-page-inner {
	background-color: #fff;
}

/* ============================== HEADER ============================== */
/* Logo (338px) a sinistra e banner foto (810px) a destra sulla stessa riga: se manca spazio si riducono in proporzione */
#jsn-header {
	display: flex;
	flex-wrap: nowrap;
	align-items: flex-start;
	justify-content: space-between;
	overflow: hidden;
}

#jsn-logo {
	flex: 0 1 338px;
	min-width: 0;
}

#jsn-headerright {
	flex: 0 1 810px;
	min-width: 0;
}

#jsn-pos-logo .jsn-modulecontainer,
#jsn-pos-top .jsn-modulecontainer {
	margin: 0;
}

#jsn-pos-logo h1,
#jsn-pos-logo p {
	margin: 0;
	font-size: inherit;
	line-height: 1;
}

#jsn-pos-logo img,
#jsn-pos-top img {
	display: block;
	width: 100%;
	height: auto;
}

#jsn-pos-top p {
	margin: 0;
	line-height: 0;
}

/* ============================== MENU ============================== */
#jsn-menu {
	position: relative;
	z-index: 999;
	color: #f2f2f2;
	background-color: var(--bz-menu-bg);
}

#jsn-menu::after {
	content: "";
	display: block;
	clear: both;
}

#jsn-pos-toolbar {
	float: right;
}

#jsn-pos-mainmenu .jsn-modulecontainer,
#jsn-pos-mainmenu .jsn-modulecontainer_inner,
#jsn-pos-mainmenu .jsn-modulecontent {
	margin: 0;
	padding: 0;
}

#jsn-menu ul.menu-mainmenu,
#jsn-menu ul.menu-mainmenu ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#jsn-menu ul.menu-mainmenu {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: stretch;
}

#jsn-menu ul.menu-mainmenu li {
	position: relative;
	margin: 0;
	padding: 0;
	list-style-type: none;
}

#jsn-menu ul.menu-mainmenu > li {
	border-right: 1px solid var(--bz-dark);
}

#jsn-menu ul.menu-mainmenu li > a,
#jsn-menu ul.menu-mainmenu li > span {
	display: block;
	padding: 8px 12px;
	color: #fff;
	cursor: pointer;
	font-family: var(--bz-font-head);
	font-size: 14px;
	line-height: 20px;
	text-decoration: none;
}

#jsn-menu ul.menu-mainmenu > li > a,
#jsn-menu ul.menu-mainmenu > li > span {
	padding: 10px 12px;
	font-size: 1.2em;
	border-right: 1px solid #000;
}

/* Hover e voce attiva */
#jsn-menu ul.menu-mainmenu li:hover > a,
#jsn-menu ul.menu-mainmenu li:hover > span,
#jsn-menu ul.menu-mainmenu li:focus-within > a,
#jsn-menu ul.menu-mainmenu li:focus-within > span,
#jsn-menu ul.menu-mainmenu li.active > a,
#jsn-menu ul.menu-mainmenu li.active > span,
#jsn-menu ul.menu-mainmenu li.current > a {
	color: #fff;
	text-decoration: none;
	background-color: var(--bz-menu-active-bg);
}

/* Sottomenu a tendina (solo CSS) */
#jsn-menu ul.menu-mainmenu ul {
	position: absolute;
	left: -999em;
	top: 100%;
	z-index: 1000;
	display: block;
	width: 200px;
	background-color: rgba(233, 196, 47, 0.9);
}

#jsn-menu ul.menu-mainmenu ul li {
	width: 200px;
	border: 0;
}

#jsn-menu ul.menu-mainmenu ul li > a,
#jsn-menu ul.menu-mainmenu ul li > span {
	font-size: 14px;
	border-top: 1px solid #366999;
	border-bottom: 1px solid #162c40;
	border-left: 1px solid #162c40;
	border-right: 0;
}

#jsn-menu ul.menu-mainmenu ul ul {
	top: 0;
	margin-left: 199px;
}

#jsn-menu ul.menu-mainmenu li:hover > ul,
#jsn-menu ul.menu-mainmenu li:focus-within > ul {
	left: auto;
	right: auto;
}

#jsn-menu ul.menu-mainmenu ul li.parent > a {
	padding-right: 16px;
	background: url("../images/icons/icon-arrow-white.png") 98% center no-repeat;
}

/* ============================== PROMO (slider) ============================== */
#jsn-content-top {
	position: relative;
	z-index: 88;
	color: #d4d4d4;
	border-bottom: 5px solid var(--bz-dark);
	background: #595959 url("../images/bg/bg-promo.jpg") left top repeat-x;
}

#jsn-content-top .jsn-modulecontainer {
	margin: 0;
}

#jsn-content-top h3.jsn-moduletitle {
	color: #fff;
}

/* ============================== CONTENUTO ============================== */
#jsn-content {
	position: relative;
	overflow: hidden;
}

#jsn-content-inner {
	display: flex;
	align-items: stretch;
}

#jsn-maincontent {
	flex: 1 1 0;
	min-width: 0;
	background: #fff;
}

#jsn-leftsidecontent,
#jsn-rightsidecontent {
	flex: 0 0 23.4%;
	max-width: 23.4%;
	z-index: 87;
}

#jsn-leftsidecontent {
	background: #e5e5e5 url("../images/bg/bg-leftside.png") right top repeat-y;
}

#jsn-rightsidecontent {
	background: #e5e5e5 url("../images/bg/bg-rightside.png") left top repeat-y;
}

#jsn-leftsidecontent_inner,
#jsn-rightsidecontent_inner {
	padding: 15px;
}

#jsn-leftsidecontent .jsn-modulecontainer,
#jsn-rightsidecontent .jsn-modulecontainer {
	margin-top: 20px;
}

#jsn-leftsidecontent .jsn-modulecontainer:first-child,
#jsn-rightsidecontent .jsn-modulecontainer:first-child {
	margin-top: 0;
}

#jsn-master h3.jsn-moduletitle {
	margin: 0;
	padding-bottom: 5px;
	color: #000;
	font-size: 1.7em;
}

h3.jsn-moduletitle span {
	display: block;
	line-height: 16px;
}

/* Liste nei moduli laterali (categorie, piu letti, archivio) */
#jsn-leftsidecontent ul,
#jsn-rightsidecontent ul {
	margin: 5px 0 10px;
	padding: 0 0 0 14px;
	list-style: disc outside;
}

#jsn-leftsidecontent li,
#jsn-rightsidecontent li {
	padding: 0;
	line-height: 20px;
	list-style: disc outside;
}

#jsn-leftsidecontent li a,
#jsn-rightsidecontent li a {
	font-size: 1em;
	line-height: 20px;
}

/* Solo l'elenco categorie del blog e' grande (Verdana 1.4em), come nel vecchio sito */
#jsn-leftsidecontent .mod-articles-categories li a,
#jsn-rightsidecontent .mod-articles-categories li a,
#jsn-leftsidecontent .mod-articlescategories li a {
	font-family: var(--bz-font-head);
	font-size: 1.4em;
	line-height: 40px;
}

#jsn-leftsidecontent li h4,
#jsn-rightsidecontent li h4 {
	display: inline;
	margin: 0;
	font-size: inherit;
	color: inherit;
}

/* Breadcrumbs */
#jsn-pos-breadcrumbs {
	padding: 10px 15px;
	background: url("../images/dot.png") left bottom repeat-x;
}

#jsn-pos-breadcrumbs nav,
#jsn-pos-breadcrumbs .mod-breadcrumbs {
	margin: 0;
	padding: 0;
	list-style: none;
	background: none;
	font-size: 0.9em;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

#jsn-pos-breadcrumbs .mod-breadcrumbs__here {
	float: none;
	font-size: 0;
	padding: 0 5px 0 0;
}

#jsn-pos-breadcrumbs .mod-breadcrumbs__here::before {
	content: "\f3c5";
	font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", sans-serif;
	font-weight: 900;
	font-size: 12px;
	color: var(--bz-dark);
}

#jsn-pos-breadcrumbs .breadcrumb-item,
#jsn-pos-breadcrumbs .mod-breadcrumbs__item {
	display: inline-block;
	padding: 0 25px 0 0;
	text-shadow: 0 1px 0 #fff;
	background: url("../images/icons/icon-arrow-black.png") 95% center no-repeat;
}

#jsn-pos-breadcrumbs .breadcrumb-item + .breadcrumb-item {
	padding-left: 0;
}

#jsn-pos-breadcrumbs .breadcrumb-item::before {
	content: none;
	display: none;
}

#jsn-pos-breadcrumbs .breadcrumb-item a,
#jsn-pos-breadcrumbs .breadcrumb-item span {
	color: var(--bz-dark);
}

#jsn-pos-breadcrumbs .breadcrumb-item.active {
	font-weight: bold;
	background: none;
	padding-right: 0;
}

#jsn-pos-mainbody-top,
#jsn-pos-mainbody-bottom {
	padding: 15px;
	background: url("../images/dot.png") left bottom repeat-x;
}

#jsn-pos-mainbody-bottom {
	background-position: left top;
}

#jsn-mainbody {
	padding: 1.2em;
}

/* ============================== COM_CONTENT ============================== */
#jsn-mainbody .page-header {
	border-bottom: none;
	margin-bottom: 0;
	padding-bottom: 0;
}

#jsn-mainbody .page-header h1,
#jsn-mainbody .page-header h2 {
	margin: 0 0 0.5em;
	font-size: 1.4em;
	color: #000;
}

#jsn-mainbody .page-header h2 a {
	color: var(--bz-link);
}

/* Blog (classe di pagina .blog-notitle sulla voce di menu): il titolo e' gia' nel testo introduttivo, come nel vecchio sito */
.blog-notitle #jsn-mainbody .blog-items .page-header {
	display: none;
}

/* Elenchi articoli (home, stage, eventi...): titolo centrato come nel vecchio modulo News Show Pro */
#jsn-mainbody .blog-items .item-title,
#jsn-mainbody .blog-featured .item-title {
	margin: 0.4em 0;
	font-family: var(--bz-font-head);
	font-size: clamp(1.4rem, 2.6vw, 2.25rem);
	line-height: 1.2;
	text-align: center;
}

.blog-notitle #jsn-mainbody .blog-items .item-title {
	display: none;
}

#jsn-mainbody .blog-items .item-title a,
#jsn-mainbody .blog-featured .item-title a {
	color: var(--bz-link);
}

#jsn-mainbody .blog-items .blog-item,
#jsn-mainbody .blog-featured .blog-item,
#jsn-mainbody .items-leading > div {
	margin-bottom: 1.5em;
}

#jsn-mainbody .blog-items .item-image,
#jsn-mainbody .blog-item .item-image {
	margin: 0 0 10px;
}

#jsn-mainbody .item-image img,
#jsn-mainbody figure.item-image img {
	max-width: 100%;
	height: auto;
}

#jsn-mainbody .readmore .btn,
#jsn-mainbody .readmore a {
	display: inline-block;
	padding: 4px 12px;
	font-size: 14px;
	line-height: 20px;
	color: #333;
	text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
	background: #f5f5f5 linear-gradient(#fff, #e6e6e6) repeat-x;
	border: 1px solid #ccc;
	border-bottom-color: #b3b3b3;
	border-radius: 4px;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
}

#jsn-mainbody .readmore .btn:hover,
#jsn-mainbody .readmore a:hover {
	color: #333;
	background-position: 0 -15px;
}

#jsn-mainbody .article-info,
#jsn-mainbody .article-info .article-info-term {
	font-size: 0.9em;
	color: #666;
}

#jsn-mainbody table {
	max-width: 100%;
}

/* ============================== FASCIA CONTATTI (content-bottom) ============================== */
#jsn-content-bottom {
	position: relative;
	z-index: 85;
	border-top: 1px solid #fff;
	border-bottom: 6px solid var(--bz-dark);
	background: var(--bz-bottom-bg);
	box-shadow: inset 0 1px #fff;
}

#jsn-usermodules3 {
	display: flex;
	flex-wrap: wrap;
	gap: 2.127%;
	padding: 15px;
	box-sizing: border-box;
}

#jsn-usermodules3 .jsn-userpos {
	flex: 1 1 0;
	min-width: 0;
}

#jsn-pos-content-bottom {
	padding: 15px;
}

#jsn-content-bottom,
#jsn-content-bottom a {
	color: #000;
}

#jsn-content-bottom a:hover {
	color: #fff;
}

#jsn-content-bottom h3.jsn-moduletitle {
	color: #000;
	font-size: 1.7em;
}

/* ============================== FOOTER ============================== */
#jsn-footer {
	color: #595959;
	font-size: 0.9em;
	background-color: #fff;
	border-top: 1px solid #b3b3b3;
}

#jsn-footermodules {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 2.127%;
	padding: 15px;
	box-sizing: border-box;
}

#jsn-pos-footer,
#jsn-pos-bottom {
	flex: 1 1 0;
	min-width: 0;
}

#jsn-pos-bottom {
	text-align: right;
}

#jsn-footer p {
	margin: 0;
}

#jsn-footer a {
	text-decoration: none;
}

#jsn-footer a:hover {
	text-decoration: underline;
}

/* ============================== MESSAGGI ============================== */
#jsn-master .alert {
	margin: 0 0 1em;
}

/* ============================== RESPONSIVE ============================== */
@media (max-width: 991.98px) {
	#jsn-page {
		width: 100%;
		min-width: 0;
		border-left: 0;
		border-right: 0;
	}
}

@media (max-width: 767.98px) {
	#jsn-content-inner {
		flex-direction: column;
	}

	#jsn-leftsidecontent,
	#jsn-rightsidecontent {
		flex: 0 0 auto;
		max-width: none;
		background-image: none;
	}

	#jsn-menu ul.menu-mainmenu {
		flex-direction: column;
	}

	#jsn-menu ul.menu-mainmenu > li {
		border-right: 0;
		border-bottom: 1px solid var(--bz-dark);
	}

	#jsn-menu ul.menu-mainmenu > li > a {
		border-right: 0;
	}

	#jsn-menu ul.menu-mainmenu ul {
		position: static;
		left: auto;
		width: auto;
		display: none;
	}

	#jsn-menu ul.menu-mainmenu li:hover > ul,
	#jsn-menu ul.menu-mainmenu li:focus-within > ul {
		display: block;
	}

	#jsn-menu ul.menu-mainmenu ul li {
		width: auto;
	}

	#jsn-usermodules3,
	#jsn-footermodules {
		flex-direction: column;
	}

	#jsn-pos-bottom {
		text-align: left;
	}
}

/* ============================== MODULO mod_biodanza_news (ex News Show Pro) ============================== */
#jsn-master .bz-news h4.bz-news-title {
	margin: 0.4em 0;
	font-size: clamp(1.4rem, 2.6vw, 2.25rem);
	line-height: 1.2;
	color: var(--bz-link);
	text-align: center;
}

#jsn-master .bz-news h4.bz-news-title a {
	color: var(--bz-link);
}

#jsn-master .bz-news p.bz-news-text {
	font-size: 18px;
	line-height: 1.5;
	color: #036;
}

#jsn-master .bz-news p.bz-news-more {
	text-align: right;
}

#jsn-master .bz-news a.readon {
	padding: 5px 12px;
	font-size: 15.4px;
	color: #000;
	background: #f4f4f4;
	border: 1px solid #999;
}

/* ============================== ARTICOLI EX K2 (body.k2-item) ============================== */
/* Impaginazione del vecchio K2: titolo, immagine centrata (600px) e testo senza giustificazione forzata */
.k2-item #jsn-mainbody .com-content-article .page-header h1 {
	margin: 0 0 1em;
	padding: 0;
	font-size: 1.4em;
	line-height: 1.5;
}

.k2-item #jsn-mainbody .com-content-article > figure.item-image {
	float: none;
	display: block;
	margin: 0 0 16px;
	padding: 8px 0;
	text-align: center;
}

.k2-item #jsn-mainbody .com-content-article > figure.item-image img {
	max-width: 96%;
	height: auto;
	background: #f3f3f3;
}

.k2-item #jsn-mainbody .com-content-article .page-header {
	padding-bottom: 8px;
}

.k2-item #jsn-mainbody .com-content-article__body {
	padding: 0 0 8px;
}

.k2-item #jsn-mainbody .com-content-article__body h3 {
	margin: 0;
	padding: 16px 0 4px;
}

/* ============================== ELENCHI EX K2 "latest" (Gli Stage, Eventi, Progetti...) ============================== */
#jsn-mainbody .blog-items .blog-item:has(.latestItemView) {
	margin-bottom: 0;
}

.latestItemView {
	padding: 0;
}

#jsn-mainbody h2.latestItemTitle {
	margin: 9.8px 0 19.6px;
	font-size: 1.4em;
	line-height: 1.5;
	color: #000;
}

#jsn-mainbody h2.latestItemTitle a {
	color: var(--bz-link);
}

.latestItemBody {
	padding: 8px 0;
}

.latestItemImageBlock {
	padding: 8px 0;
	margin: 0 0 16px;
}

.latestItemImage {
	display: block;
	margin: 0 0 8px;
	text-align: center;
}

.latestItemImage img {
	width: 400px;
	max-width: 96%;
	height: auto;
}

.latestItemIntroText {
	padding: 4px 0 12px;
	font-size: 1em;
	font-weight: normal;
	line-height: 1.5;
}

.latestItemReadMore a.k2ReadMore {
	color: var(--bz-link);
}

/* Titolo della categoria (menu con "Mostra titolo categoria"): come l'h2 di K2 */
#jsn-mainbody .category-desc h1,
#jsn-mainbody .com-content-category-blog > h2,
#jsn-mainbody .com-content-category-blog > h1 {
	margin: 0 0 24px;
	padding: 17.8px 8px 31px 0;
	font-size: 1.4em;
	font-weight: normal;
	line-height: 1.5;
	color: var(--bz-link);
}

/* ============================== ARTICOLI DEL BLOG (ex Joomla 3) ============================== */
/* Barra grigia "Dettagli" con categoria principale e categoria (jsn-article-toolbar del vecchio sito) */
body:not(.k2-item) #jsn-mainbody .com-content-article dl.article-info {
	margin: 0 0 15px;
	padding: 10px;
	background: #f4f4f4;
	color: #999;
	font-size: 11.34px;
	line-height: 17px;
}

body:not(.k2-item) #jsn-mainbody .com-content-article dl.article-info dd {
	margin: 2px 0 0;
	color: #999;
	font-size: 11.34px;
}

body:not(.k2-item) #jsn-mainbody .com-content-article dl.article-info dd [class^="icon-"] {
	display: none;
}

body:not(.k2-item) #jsn-mainbody .com-content-article dl.article-info .article-info-term {
	display: none;
}

/* Immagine dell'articolo a sinistra con i margini del vecchio sito */
body:not(.k2-item) #jsn-mainbody .com-content-article > figure.item-image.left {
	float: left;
	margin: 0 10px 10px 0;
}

/* Breadcrumbs: 12.6px (0.9em una sola volta, non sulle singole voci) */
#jsn-pos-breadcrumbs .breadcrumb-item,
#jsn-pos-breadcrumbs .mod-breadcrumbs__item,
#jsn-pos-breadcrumbs .breadcrumb-item a,
#jsn-pos-breadcrumbs .breadcrumb-item span {
	font-size: 1em;
}

#jsn-pos-breadcrumbs ol.mod-breadcrumbs {
	font-size: 1em;
}
