/* ==========================================================
   Gemeinde Grüsch – Infoscreen
   Seite 274
   ========================================================== */


/* ==========================================================
   GRUNDLAYOUT
   ========================================================== */

body.infoscreen {
	position: fixed;
	inset: 0;

	width: 100vw;
	height: 100vh;

	margin: 0;
	padding: 0;

	overflow: hidden;

	background: #fff;

	font-family: "Nunito Sans", Arial, Geneva, sans-serif;
}


/* ==========================================================
   NORMALE WEBSITE-ELEMENTE AUSBLENDEN
   ========================================================== */

body.infoscreen .mobilenav,
body.infoscreen .mobilenav__bg,
body.infoscreen [data-template-name="skiplinks"],
body.infoscreen [data-template-name="search"],
body.infoscreen [data-template-name="mandanten-switch"],
body.infoscreen .mainnav,
body.infoscreen .header__img,
body.infoscreen .subnav,
body.infoscreen [data-template-name="maintitle"],
body.infoscreen [data-template-name="eGov"],
body.infoscreen [data-template-name="tracking"],
body.infoscreen .search,
body.infoscreen form[role="search"],
body.infoscreen input[type="search"],
body.infoscreen .main__title,
body.infoscreen h1#main__title,
body.infoscreen footer,
body.infoscreen .footer,
body.infoscreen .footer__content,
body.infoscreen .footer-service-links,
body.infoscreen .social-bar,
body.infoscreen [data-template-name^="footer"],
body.infoscreen #cc-main {
	display: none !important;
}


/* ==========================================================
   HEADER
   ========================================================== */

body.infoscreen .header {
	position: relative;
	z-index: 10;

	width: 100%;
	height: 130px;

	margin: 0;
	padding: 0;

	background: #fff;

	box-shadow: 0 3px 12px rgba(6, 50, 102, 0.08);
}


/* Blauer Bereich über der News-Spalte */
body.infoscreen .header::after {
	content: "";

	position: absolute;
	inset: 0 400px 0 0;

	z-index: 0;

	background: #3E7186;
}


/* alten statischen Titel ausschalten */
body.infoscreen .header::before {
	content: none !important;
	display: none !important;
}


/* ==========================================================
   HEADER-INHALT
   ========================================================== */

body.infoscreen .wrapper--header {
	position: relative;
	z-index: 2;

	box-sizing: border-box;

	width: 100%;
	max-width: none;
	height: 111px;

	margin: 0;
	padding: 0;

	display: block;
}


/* ==========================================================
   LOGO RECHTS ÜBER DER AGENDA
   ========================================================== */

body.infoscreen .logo {
	position: absolute !important;

	top: 0;
	right: 0;

	z-index: 10;

	box-sizing: border-box;

	width: 400px !important;
	height: 111px !important;

	margin: 0 !important;
	padding: 10px 28px !important;

	display: flex !important;
	align-items: center !important;
	justify-content: center !important;

	background: #fff;
}


body.infoscreen .logo a {
	display: flex !important;

	width: 100%;
	height: 100%;

	align-items: center;
	justify-content: center;

	text-decoration: none;
}


body.infoscreen .logo img,
body.infoscreen .logo svg {
	display: block !important;

	width: auto !important;
	height: auto !important;

	max-width: 100% !important;
	max-height: 88px !important;

	margin: 0 auto;
}


/* ==========================================================
   AKTUELLER NEWS-TITEL IM HEADER

   Wird durch infoscreen.js erzeugt.
   ========================================================== */

body.infoscreen #infoscreen-current-news-title {
	position: absolute !important;

	top: 0 !important;
	left: 70px !important;
	right: 440px !important;

	z-index: 50 !important;

	box-sizing: border-box !important;

	height: 130px !important;

	margin: 0 !important;
	padding: 0 !important;

	display: flex !important;
	align-items: center !important;
	justify-content: flex-start !important;

	overflow: hidden !important;

	color: #fff !important;

	background: transparent !important;

	font-size: 40px !important;
	line-height: 1.08 !important;
	font-weight: 700 !important;
	font-style: normal !important;

	text-align: left !important;

	pointer-events: none !important;
}


/* ==========================================================
   HAUPTBEREICH
   ========================================================== */

body.infoscreen #wrapper {
	width: 100%;
	max-width: none;

	height: calc(100vh - 111px);

	margin: 0 !important;
	padding: 0;

	overflow: hidden !important;
}


body.infoscreen .container,
body.infoscreen .container--content,
body.infoscreen .main,
body.infoscreen .main--content {
	position: relative;

	width: 100%;
	max-width: none;

	height: 100%;
	min-height: 0;

	margin: 0 !important;
	padding: 0;

	overflow: hidden !important;
}


/* ==========================================================
   NEWS-BEREICH
   ========================================================== */

body.infoscreen .mod-news--listview {
	position: absolute !important;

	top: 0;
	left: 0;
	bottom: 0;

	width: calc(100% - 400px) !important;
	height: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	overflow: hidden !important;

	background: #fff;

	border: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;
}


body.infoscreen .mod-news-lst {
	width: 100%;
	height: 100%;

	margin: 0 !important;
	padding: 0 !important;

	list-style: none;

	overflow: hidden !important;

	border: 0 !important;
	outline: 0 !important;
}


/* ==========================================================
   NEWS-SLIDE
   ========================================================== */

body.infoscreen .mod-news--listview .mod-entry {
	box-sizing: border-box;

	width: 100%;
	height: 100%;

	margin: 0 !important;
	padding: 42px 45px 55px 70px;

	display: grid;

	grid-template-columns: 1fr;
	grid-template-areas: "text";

	column-gap: 45px;

	border: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;

	background: #fff;

	overflow: hidden !important;
}


/* News mit Bild */
body.infoscreen .mod-news--listview .mod-entry.has-image {
	grid-template-columns:
		minmax(0, 1.5fr)
		minmax(300px, 0.8fr);

	grid-template-areas: "text asset";
}


/* ==========================================================
   NEWS-TEXTBEREICH
   ========================================================== */

body.infoscreen .mod-news--listview .mod-entry-txt {
	grid-area: text;

	min-width: 0;

	width: 100%;
	height: 100%;

	margin: 0;
	padding: 0;

	overflow: hidden !important;

	border: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;
}


/* Titel im Inhalt ausblenden */
body.infoscreen .mod-news--listview .mod-entry-title {
	display: none !important;
}


/* ==========================================================
   NEWS-DETAILTEXT
   ========================================================== */

body.infoscreen .mod-news--listview .mod-entry-desc {
	max-width: 100%;
	max-height: 100%;

	margin: 0;

	overflow: hidden !important;

	color: #263442;

	font-size: 38px !important;
	line-height: 52px !important;
	font-weight: 400 !important;
	font-style: normal !important;

	border: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;
}


body.infoscreen .mod-news--listview .mod-entry-desc p {
	margin: 0 0 30px;

	font-size: inherit !important;
	line-height: inherit !important;
	font-weight: inherit !important;
}


body.infoscreen .mod-news--listview .mod-entry-desc p:last-child {
	margin-bottom: 0;
}


body.infoscreen .mod-news--listview .mod-entry-desc ul,
body.infoscreen .mod-news--listview .mod-entry-desc ol {
	margin: 18px 0 26px;
	padding-left: 1.4em;

	font-size: inherit !important;
	line-height: inherit !important;
	font-weight: inherit !important;
}


body.infoscreen .mod-news--listview .mod-entry-desc li {
	margin-bottom: 10px;
}


body.infoscreen .mod-news--listview .mod-entry-desc strong,
body.infoscreen .mod-news--listview .mod-entry-desc b {
	font-weight: 700 !important;
}


body.infoscreen .mod-news--listview .mod-entry-desc em,
body.infoscreen .mod-news--listview .mod-entry-desc i {
	font-style: italic !important;
}


/* Links im Detailtext neutralisieren */
body.infoscreen .mod-news--listview .mod-entry-desc a,
body.infoscreen .mod-news--listview .mod-entry-desc a:hover,
body.infoscreen .mod-news--listview .mod-entry-desc a:focus,
body.infoscreen .mod-news--listview .mod-entry-desc a:active {
	color: inherit !important;

	font-size: inherit !important;
	line-height: inherit !important;
	font-weight: inherit !important;

	text-decoration: none !important;

	border: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;

	background: transparent !important;
}


/* ==========================================================
   NEWS-PSEUDOELEMENTE NEUTRALISIEREN

   Entfernt geerbte GOViS-Hover-Balken.
   ========================================================== */

body.infoscreen .mod-news--listview::before,
body.infoscreen .mod-news--listview::after,
body.infoscreen .mod-news-lst::before,
body.infoscreen .mod-news-lst::after,
body.infoscreen .mod-news--listview .mod-entry::before,
body.infoscreen .mod-news--listview .mod-entry::after,
body.infoscreen .mod-news--listview .mod-entry-txt::before,
body.infoscreen .mod-news--listview .mod-entry-txt::after,
body.infoscreen .mod-news--listview .mod-entry-desc::before,
body.infoscreen .mod-news--listview .mod-entry-desc::after {
	content: none !important;

	display: none !important;

	width: 0 !important;
	height: 0 !important;

	background: none !important;

	border: 0 !important;
	box-shadow: none !important;
}


/* ==========================================================
   NEWS-HOVER / FOCUS NEUTRALISIEREN
   ========================================================== */

body.infoscreen .mod-news--listview:hover,
body.infoscreen .mod-news--listview:focus,
body.infoscreen .mod-news--listview .mod-entry:hover,
body.infoscreen .mod-news--listview .mod-entry:focus,
body.infoscreen .mod-news--listview .mod-entry-txt:hover,
body.infoscreen .mod-news--listview .mod-entry-txt:focus,
body.infoscreen .mod-news--listview .mod-entry-desc:hover,
body.infoscreen .mod-news--listview .mod-entry-desc:focus {
	border: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;
}


/* ==========================================================
   SCROLLBARS IM NEWS-BEREICH KOMPLETT AUSBLENDEN

   Firefox / alte Browser
   ========================================================== */

body.infoscreen .mod-news--listview,
body.infoscreen .mod-news-lst,
body.infoscreen .mod-news--listview .mod-entry,
body.infoscreen .mod-news--listview .mod-entry-txt,
body.infoscreen .mod-news--listview .mod-entry-desc,
body.infoscreen .infoscreen-column-content {
	scrollbar-width: none !important;
	-ms-overflow-style: none !important;
}


/* Chrome / Samsung / WebKit */
body.infoscreen .mod-news--listview::-webkit-scrollbar,
body.infoscreen .mod-news-lst::-webkit-scrollbar,
body.infoscreen .mod-news--listview .mod-entry::-webkit-scrollbar,
body.infoscreen .mod-news--listview .mod-entry-txt::-webkit-scrollbar,
body.infoscreen .mod-news--listview .mod-entry-desc::-webkit-scrollbar,
body.infoscreen .infoscreen-column-content::-webkit-scrollbar {
	width: 0 !important;
	height: 0 !important;

	display: none !important;

	background: transparent !important;
}


body.infoscreen .mod-news--listview::-webkit-scrollbar-thumb,
body.infoscreen .mod-news-lst::-webkit-scrollbar-thumb,
body.infoscreen .mod-news--listview .mod-entry::-webkit-scrollbar-thumb,
body.infoscreen .mod-news--listview .mod-entry-txt::-webkit-scrollbar-thumb,
body.infoscreen .mod-news--listview .mod-entry-desc::-webkit-scrollbar-thumb,
body.infoscreen .infoscreen-column-content::-webkit-scrollbar-thumb {
	background: transparent !important;
	border: 0 !important;
}


/* ==========================================================
   NEWS-BILD
   ========================================================== */

body.infoscreen .mod-news--listview .mod-entry-asset {
	grid-area: asset;

	min-width: 0;
	height: 100%;

	display: flex;
	align-items: center;
	justify-content: center;

	overflow: hidden;

	border: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;
}


body.infoscreen .mod-news--listview .mod-entry-asset img {
	display: block;

	width: 100%;
	height: 100%;

	max-width: 100%;
	max-height: 100%;

	object-fit: contain;

	border: 0 !important;
}


/* ==========================================================
   AGENDA
   ========================================================== */

body.infoscreen .infoscreen-events {
	position: absolute !important;

	top: 0;
	right: 0;
	bottom: 0;

	z-index: 20;

	box-sizing: border-box;

	width: 400px;
	height: 100%;

	margin: 0 !important;
	padding: 28px 26px 28px 30px !important;

	overflow: hidden;

	background: #f5f7f9 !important;

	border: 0 !important;
	box-shadow: none !important;
}


/* ==========================================================
   AGENDA-TITEL
   ========================================================== */

body.infoscreen .infoscreen-events__title {
	display: block !important;

	margin: 0 0 22px !important;
	padding: 0 0 12px !important;

	color: #063266 !important;

	font-size: 31px !important;
	line-height: 1 !important;
	font-weight: 700 !important;

	border: 0 !important;
}


/* ==========================================================
   EVENT-LISTE
   ========================================================== */

body.infoscreen .infoscreen-event-lst {
	display: block !important;

	width: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	list-style: none !important;
}


/* ==========================================================
   EVENT
   ========================================================== */

body.infoscreen .infoscreen-event-item {
	display: block !important;

	box-sizing: border-box !important;

	width: 100% !important;

	margin: 0 !important;
	padding: 0 0 18px !important;

	background: transparent !important;

	border: 0 !important;
	border-bottom: 1px solid #d4dce4 !important;
}


body.infoscreen .infoscreen-event-item:last-child {
	border-bottom: 0 !important;
}


body.infoscreen .infoscreen-event-item +
.infoscreen-event-item {
	margin-top: 18px !important;
}


/* ==========================================================
   EVENT-DATUMSFELD
   ========================================================== */

body.infoscreen .infoscreen-event-datebox {
	display: block !important;

	box-sizing: border-box !important;

	width: 100% !important;
	min-height: 82px !important;

	margin: 0 !important;
	padding: 11px 16px 12px !important;

	overflow: visible !important;

	background: #3E7186 !important;

	border: 0 !important;
	border-radius: 0 !important;
}


/* Tageszahl */
body.infoscreen .infoscreen-event-day {
	display: block !important;

	margin: 0 !important;
	padding: 0 !important;

	color: #ffd600 !important;

	font-size: 46px !important;
	line-height: 0.95 !important;
	font-weight: 700 !important;

	letter-spacing: -0.03em !important;

	text-align: left !important;
}


/* Monat / Jahr */
body.infoscreen .infoscreen-event-date-rest {
	display: block !important;

	margin: 6px 0 0 !important;
	padding: 0 !important;

	color: #ffd600 !important;

	font-size: 20px !important;
	line-height: 1.15 !important;
	font-weight: 600 !important;

	text-align: left !important;
}


/* ==========================================================
   EVENT-TITEL
   ========================================================== */

body.infoscreen .infoscreen-event-content {
	display: block !important;

	margin: 0 !important;
	padding: 13px 8px 0 !important;
}


body.infoscreen .infoscreen-event-title {
	display: block !important;

	margin: 0 !important;
	padding: 0 !important;

	font-size: 22px !important;
	line-height: 1.2 !important;
	font-weight: 700 !important;
}


body.infoscreen .infoscreen-event-title a {
	color: #263442 !important;

	font: inherit !important;

	text-decoration: none !important;
}


/* ==========================================================
   GOVIS EVENT-WRAPPER NEUTRALISIEREN
   ========================================================== */

body.infoscreen .mod-event,
body.infoscreen .mod-event--listview {
	position: static !important;

	width: auto !important;
	height: auto !important;

	margin: 0 !important;
	padding: 0 !important;

	background: transparent !important;

	border: 0 !important;
	box-shadow: none !important;
}


/* ==========================================================
   NICHT BENÖTIGTE ELEMENTE
   ========================================================== */

body.infoscreen .mod-entry-show-more,
body.infoscreen .qr-code,
body.infoscreen .asset-meta {
	display: none !important;
}


/* ==========================================================
   SWIPER-BEDIENELEMENTE AUSBLENDEN
   ========================================================== */

body.infoscreen .swiper-scrollbar,
body.infoscreen .swiper-scrollbar-drag,
body.infoscreen .swiper-pagination,
body.infoscreen .swiper-pagination-progressbar,
body.infoscreen .swiper-pagination-progressbar-fill,
body.infoscreen .swiper-button-prev,
body.infoscreen .swiper-button-next {
	display: none !important;

	visibility: hidden !important;

	opacity: 0 !important;

	width: 0 !important;
	height: 0 !important;
}


/* ==========================================================
   RESTABSTÄNDE
   ========================================================== */

body.infoscreen #wrapper,
body.infoscreen .container,
body.infoscreen .main,
body.infoscreen .mod-wrapper,
body.infoscreen .mod-news-lst,
body.infoscreen .event-lst {
	margin-bottom: 0 !important;
}