@font-face {
	font-family: "font-main";
	src: url('/programa-de-exposicoes/fonts/swz721l.ttf');
}

* {
	margin: 0;
}

:root {

	-webkit-text-size-adjust: 100%;
	--font-family: 'font-main', 'Segoe UI', 'Arial';

	/* Era usado no loading */
	--stroke-dasharray-loading: 1457px;
	--stroke-dasharray-progress: calc(1 * var(--stroke-dasharray-loading));

	
	
	
	--color-bg-ed1: #18140f;
	--color-main-ed1: #c9b18f;
	--color-main-hover-ed1: #dfc7a6;
	--color-disabled-ed1: #685942;
	--color-alert-ed1: #ff5100;
	--color-alternative-ed1: white;
	--color-alert-ed1: #ff5100;

	/* azul #6699ac */
	--color-bg-ed2: #e08072;
	--color-main-ed2: #ffffff;
	--color-main-hover-ed2: #86e66e;
	--color-disabled-ed2: #96b0da;
	--color-alternative-ed2: white;
	--color-alert-ed2: #000000;
	--color-highlight-ed2: rgba(0,0,0,.1);
}

body[data-edition="2"] {
	--color-bg: var(--color-bg-ed2);
	--color-main: var(--color-main-ed2);
	--color-main-hover: var(--color-main-hover-ed2);
	--color-content: var(--color-main-ed2);
	--color-disabled: var(--color-disabled-ed2);
	--color-alert: var(--color-alert-ed2);
	--color-alternative: var(--color-alternative-ed2);
	--color-text-selection: #6699ac;

	--color-item-label-regulamento: rgba(255,255,255,.2);
}

body {
	--color-bg: var(--color-bg-ed1);
	--color-main: var(--color-main-ed1);
	--color-main-hover: var(--color-main-hover-ed1);
	--color-content: var(--color-main-ed1);
	--color-disabled: var(--color-disabled-ed1);
	--color-alert: var(--color-alert-ed1);
	--color-text-selection: var(--color-alert);

	--color-alternative: var(--color-alternative-ed1);

	--transition-darkmode-bg: background-color 1s ease;
	--transition-darkmode-color: color 1s ease;

}

/* First Styling */
@media screen and (min-width:0px) {
	:root {
		--main-width: 320px;

		--width-loading-img: var(--main-width);
		--proportional-height-loading-img: calc(var(--main-width) * 0.1796);

		--img-width: var(--main-width);

		--margin: 8px;
		--margin-large: 16px;


		--font-size-p: 16px;
		--margin-top-p: -7px;
		--margin-bottom-p: -4px;
		
		--font-size-h2: 20px;
		--margin-top-h2: -9px;
		--margin-bottom-h2: -5px;

		--font-size-h3: 16px;
		--margin-top-h3: -7px;
		--margin-bottom-h3: -4px;

		--font-size-h6: 12px;
		--margin-top-h6: 0px;
		--margin-bottom-h6: 0px;
	}

	body {
		font-family: var(--font-family);
		background-color: var(--color-bg);
		color: var(--color-content);

		/* For darkmode on/off */
		/* transition: var(--transition-darkmode-bg); */
	}


	#menu,
	#main {
		opacity: 0;
		transition: opacity .5s ease;
	}

	main {
		/* display: none; */
		transition: opacity 1s ease; 
	}

	::selection {
		color: var(--darkmodeOn-bg-color);
		background: var(--color-text-selection);
	}
	::-moz-selection {
		color: var(--darkmodeOn-bg-color);
		background: var(--color-text-selection);
	}

	.alert-color {
		color: var(--color-alert);
	}

	#svgMainLogo {
		width: 100vw;
		width: var(--main-width);
		max-width: 1024px;
		height: calc(100vw * 0.43);
		max-height: calc(1024px * 0.43);

		margin-left: auto;
		margin-right: auto;
	}
	/*
	header,
	#header-title {
		display: flex;
		flex-direction: row;
	}*/

	#title-programa-de-exposicoes {
		margin-left: auto;
		margin-right: auto;

		width: 100vw;
		width: var(--main-width);
		max-width: 1024px;
		height: calc(100vw * 0.1171);
		max-height: calc(1024px * 0.1171);
	}

	#header-image,
	#header-name {
		display: flex;
	}

	#svgMainLogo .str0 {
		fill: none;
		stroke: var(--color-content);
		stroke-width: 6;
	}
	header .fil1 {
		fill: var(--color-alternative);
	}
	header .fil2 {
		fill: var(--color-content);
	}
	.fil3 {
		fill: var(--color-content);
	}

	/* first loading <div>*/
	#first-loading-container {
		margin-top: calc(.3 * 100vh);
		margin-bottom: auto;

		display: flex;
		flex-direction: column;
	}
	#loading-text {
		color: var(--color-alternative);
		text-align: center;

		animation: loadingblinking .5s ease-out alternate-reverse infinite;
	}
	@keyframes loadingblinking {
		from {
			color: var(--color-alternative);
		}
		to {
			color: var(--color-bg);
		}
	}

	#first-loading-animation,
	#loading-transition {
		width: var(--main-width);
		height: 100%;
		margin: 0 auto;
		
		fill: none;
		stroke-width: 15;

		/* margin-bottom: -13px; */
	}

	#loading-container {
		/* margin-top: 40px; */
		/* margin-bottom: 100px; */

		margin-bottom: calc((40px + var(--proportional-height-loading-img)) * -1);
		padding-top: 40px;

		display: flex;
		flex-direction: column;


		display: none;
	}
	/* between pages loading */
	.progress-polyline {
		stroke-dasharray: var(--stroke-dasharray-loading);
		stroke-dashoffset: var(--stroke-dasharray-progress);
		transition: 2s stroke-dashoffset ease;
	}
	.grey-polyline {
		stroke: var(--color-disabled);
	}
	.progress-polyline {
		stroke: var(--color-alternative);
	}

	#loading-space-bottom {
		display: none;
		width: 100%;
		height: 1080px;
	}

	/* MENU */
	#menu {
		width: var(--main-width);
		margin-left: auto;
		margin-right: auto;

		/* margin-bottom: var(--margin); */

	}

	.main-menu-button.highlight-m1 { background-color: var(--highlight-m1)}
	.main-menu-button.highlight-m2 { background-color: var(--highlight-m2)}
	.main-menu-button.highlight-m3 { background-color: var(--highlight-m3)}
	.main-menu-button.highlight-m4 { background-color: var(--highlight-m4)}
	.main-menu-button.highlight-m5 { background-color: var(--highlight-m5)}
	.main-menu-button.highlight-m6 { background-color: var(--highlight-m6)}
	.main-menu-button.highlight-m7 { background-color: var(--highlight-m7)}
	.main-menu-button.highlight-m8 { background-color: var(--highlight-m8)}


	/* #menu.items-quantity2 { grid-template-columns: 1fr 1fr; }
	#menu.items-quantity3 { grid-template-columns: 1fr 1fr 1fr; }
	#menu.items-quantity4 { grid-template-columns: 1fr 1fr 1fr 1fr; }
	#menu.items-quantity5 { grid-template-columns: 1fr 1fr 1fr 1fr 1fr; }
	#menu.items-quantity6 { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; } */




	#menu div {
		/* margin-right: var(--margin); */
		margin-bottom: var(--margin);

		margin-left: calc(var(--margin)/2);
		margin-right: calc(var(--margin)/2);
	}

	.main-menu-button {
		cursor: pointer;
		
		font-size: 16px;
		font-family: var(--font-family);
		color: var(--color-content);
		
		width: 100%;
		height: 100%;
		
		padding-top: 10px;
		padding-bottom: 10px;
		
		background-color: var(--color-bg);
		border: 2px solid var(--color-content);
	}
	.disabled {
		border: 2px solid var(--color-disabled);
		color: var(--color-disabled);

		cursor: default;
	}

	.square-button {
		cursor: pointer;
		font-size: 16px;
		font-family: var(--font-family);

		color: var(--color-content);

		height: 100%;

		padding-top: 10px;
		padding-bottom: 10px;
		background-color: var(--color-bg);
		border: 2px solid var(--color-content);
	}




	#slideshow-controls button {
		cursor: pointer;
		font-size: 16px;
		color: var(--color-content);

		padding-left: 20px;
		padding-right: 20px;
		padding-top: 10px;
		padding-bottom: 10px;

		background-color: var(--color-bg);
		border: 2px solid var(--color-content);
		
		transition: var(--transition-darkmode-bg);
	}
	.regulamento-menu-button {
		cursor: pointer;
		font-size: var(--font-size-h3);
		font-family: var(--font-family);
		color: var(--color-content);

		font-weight: 900;

		width: 100%;
		height: 100%;

		padding-left: 20px;
		padding-right: 20px;
		padding-top: 10px;
		padding-bottom: 10px;

		background-color: var(--color-bg);
		border: 2px solid var(--color-content);
		
		transition: var(--transition-darkmode-bg);

		text-align: left;
	}


	.svg-bandeira-a,
	.svg-bandeira-b,
	.svg-bandeira-c {
		fill: var(--color-content);
		opacity: 0;
	}
	.svg-bandeira-a {
		animation: bandeiraA 2s steps(1) infinite;
	}
	@keyframes bandeiraA {
		0%  { opacity: 1; }
		25% { opacity: 0; }
		50% { opacity: 0; }
		75% { opacity: 0; }
	}
	.svg-bandeira-b {
		animation: bandeiraB 2s steps(1) infinite;
	}
	@keyframes bandeiraB {
		0% { opacity: 0; }
		25% { opacity: 1; }
		50% { opacity: 0; }
		75% { opacity: 1; }
	}
	.svg-bandeira-c {
		animation: bandeiraC 2s steps(1) infinite;
	}
	@keyframes bandeiraC {
		0% { opacity: 0; }
		25% { opacity: 0; }
		50%  { opacity: 1; }
		75% { opacity: 0; }
	}


	.horizontal-division {
		height: 2px;
		width:100%;

		background-color: var(--color-content);

		margin-bottom: var(--margin);
	}

	a {
		color: var(--color-main);
		text-decoration: underline;
	}

	.pdf-link {
		display: flex;
		flex-direction: row;
	}

	.pdf-link a {
		color: var(--color-alternative);

		font-size: 12px;
		font-weight: 900;

		margin-top: var(--margin);
		margin-left: auto;
		margin-right: var(--margin);
	}

	#link-salao {
		color: var(--color-content);
	}
	


	section {
		/* display: none; */

		width: var(--main-width);
		margin-left: auto;
		margin-right: auto;

		margin-bottom: calc(var(--margin) * 4);
	}
	h2 {
		font-size: var(--font-size-h2);
		margin-top: calc((var(--margin)*2) + var(--margin) + var(--margin-top-h2));
		margin-bottom: calc((var(--margin)*2) + var(--margin) + var(--margin-bottom-h2));
	}
	.center-title {
		text-align: center;
	}

	.exposition-name-alone {
		text-align: center;
		padding: 6px;
		margin-top: 0px;
	}

	.space-on-top {
		margin-top: calc(var(--margin) * 4);
	}
	h3 {
		font-size: var(--font-size-h3);
		margin-top: calc((var(--margin)*2) + var(--margin) + var(--margin-top-h3));
		margin-bottom: calc((var(--margin)*2) + var(--margin) + var(--margin-bottom-h3));
	}
	.evento-nome {
		font-size: var(--font-size-h3);
		margin-top: var(--margin-top-h3);
		margin-bottom: var(--margin-bottom-h3);
	}
	.evento-data {
		font-size: 12px;
	}

	section p {
		margin-bottom: var(--margin);

		font-size: var(--font-size-p);
	}

	.inscricoes-habilitadas-container {
		height: 300px;
		overflow-y: scroll;

		border-bottom: 1px solid var(--color-content);
	}
	.inscricoes-inabilitadas-container {
		height: auto;
	}
	.inscricoes-habilitadas-container table,
	.inscricoes-inabilitadas-container table {
		width: 100%;

		border-collapse: collapse;

		border-top: 1px solid var(--color-content);
		border-bottom: 1px solid var(--color-content);

		/* margin-bottom: var(--margin); */
	}
	#table-habilitadas-regional td,
	#table-habilitadas-nacional td,
	#table-inabilitadas-regional td,
	#table-inabilitadas-nacional td {
		border-bottom: .5px solid var(--color-content);
		padding-top: var(--margin);
		padding-bottom: var(--margin);
	}
	#table-habilitadas-regional td:first-of-type,
	#table-habilitadas-nacional td:first-of-type,
	#table-inabilitadas-regional td:first-of-type,
	#table-inabilitadas-nacional td:first-of-type {
		width: 40px;

		border-right: none;
	}
	#table-habilitadas-regional td p,
	#table-habilitadas-nacional td p,
	#table-inabilitadas-regional td p,
	#table-inabilitadas-nacional td p {
		margin-top: var(--margin-top-p);
		margin-bottom: var(--margin-bottom-p);

		font-size: calc(var(--font-size-p) * .8);
	}
	#table-habilitadas-regional td:first-of-type p,
	#table-habilitadas-nacional td:first-of-type p,
	#table-inabilitadas-regional td:first-of-type p,
	#table-inabilitadas-nacional td:first-of-type p {
		font-size: 10px;
		
		/* Reset layout */
		margin-top: 0px;
		margin-bottom: 0px;
	}
	#table-habilitadas-regional td:nth-of-type(3),
	#table-habilitadas-nacional td:nth-of-type(3) {
		max-width: 50px;
	}
	.inscricoes-habilitadas-container tr td:nth-of-type(3) p {
		text-align: right;

		font-size: 10px;
	}


	.inscricoes-habilitadas-container .title,
	.inscricoes-inabilitadas-container .title {
		position: sticky;
		top: 0px;

		margin-top: calc(2 * var(--margin));
		font-weight: 900;
		padding-bottom: 4px;

		background-color: var(--color-bg);
		transition: var(--transition-darkmode-bg);
	}


	.slideshow-legendas p {
		margin-top: var(--margin);
	}

	.slideshow-legendas {
		font-size: var(--font-size-h6);
	}

	#slideshow-img-1,
	#slideshow-img-2,
	#slideshow-img-3,
	#slideshow-img-4,
	#slideshow-img-5,
	#slideshow-img-6,
	#slideshow-img-7 {
		width: calc(var(--img-width) - 4px);
		/* width: var(--img-width); */
		height: calc((var(--img-width) * 0.6656) - 4px);

		border: 2px solid var(--color-content);
		
		position: relative;
		display: block;

		transition: .15s opacity ease-out;
	}
	/* All except last */
	#slideshow-img-1,
	#slideshow-img-2,
	#slideshow-img-3,
	#slideshow-img-4,
	#slideshow-img-5,
	#slideshow-img-6 {
		margin-bottom: calc(var(--img-width) * -0.6656);
	}

	#slideshow-leg-1,
	#slideshow-leg-2,
	#slideshow-leg-3,
	#slideshow-leg-4,
	#slideshow-leg-5,
	#slideshow-leg-6,
	#slideshow-leg-7 {
		display: none;
	}

	#slideshow-controls {
		margin-top: var(--margin);

		float: right;
	}

	.regulamento-controls {
		display: none;
	}
	.regulamento {
		height: 300px;
		overflow-y: scroll;
	}
	.title {
		text-align: center;
		font-weight: 900;
	}

	.x {
		position: sticky;
		top: 0px;

		margin-top: calc(4 * var(--margin));
		margin-left: calc(1 * var(--margin));
		font-weight: 900;
		margin-right: var(--margin);
		padding-bottom: 4px;

		background-color: var(--color-bg);
		transition: var(--transition-darkmode-bg);
	}
	.xx {
		margin-left: calc(3 * var(--margin));
		margin-right: var(--margin);
	}
	.xxx {
		margin-left: calc(6 * var(--margin));
		margin-right: var(--margin);
	}
	#regulamento-item-12 {
	}
	#regulamento-item-12 .evento-nome,
	#regulamento-item-12 .evento-data {
		margin-left: calc(6 * var(--margin));
		margin-right: calc(6 * var(--margin));
	}
	.evento-nome {
		margin-top: var(--margin);
	}
	.evento-data {
		margin-top: var(--margin);
		margin-bottom: 20px;
	}

	#sidepanel-info {
		padding: calc(var(--margin) * 4);
		outline: 2px solid var(--color-bg);
		animation: animatesidepanel 1s ease infinite alternate;
	}
	@keyframes animatesidepanel {
		from {
			outline: 2px solid var(--color-bg);
		}
		to {
			outline: 2px solid var(--color-content);
		}
	}
	.sidepanel-info {
		display: flex;
		flex-direction: column;

		margin-top: calc(4 * var(--margin));
		margin-bottom: calc(4* var(--margin));
	}
	#sidepanel-info {
		display: flex;
		flex-direction: column;
		margin-top: auto;
		margin-bottom: auto;
		margin-left: var(--margin);
		margin-right: var(--margin);
	}
	#sidepanel-info div {
		margin: auto;
	}

	#numero-de-inscricoes {
		font-size: 60px;

		font-weight: 900;
	}

	#sidepanel-info p {
		text-align: center;
		margin: 0;
	}

	.small {
		font-size: 10px;
		text-align: right;
	}

	.section-credit-dev {
		margin-top: calc(var(--margin)*4);
	}

	.phone-number {
		color: var(--color-content);
	}

	/* footer */

	.pFooter,
	.pFooterTermo {
		font-size: calc(var(--font-size-p) * 0.8);
		text-align: center;
	}
	.pFooter {
		margin: 0;
		color: black;
	}
	.pFooterTermo {
		margin: var(--margin) var(--margin) 0 var(--margin);
		color: black;
	}
	.footer-container {
		max-width: 800px;
		margin: 0 auto;
	}
	footer .logos img {
		height: 40px;
	}
	/* Logos realizacao width > 300px. Fixing for mobiles */
	#imgRealizacao {
		max-width: 280px;
	}

	/* flow change */
	footer .logos {
		display: flex;
		flex-direction: column;
	}
	/* alignment */
	.logos div {
		display: flex;
		flex-direction: column;
		margin: 0 auto 1rem auto;
	}

	/* spaces */
	footer {
		padding-top: 1rem;
		background-color: white;
		/* margin-top: 2rem; */
	}

	footer .realizacao {
		margin: 1rem 0;
	}

	.apresentacao div {
		margin: 0 0 1rem 0;
	}

	footer .realizacao img,
	footer .apresentacao img {
		margin: 0 auto;
	}

	.p-Footer {
		margin-bottom: 1rem;
		text-align: center;

		color: #000;
	}

	/* Space last element on body content */
	.pFooterTermo {
		padding-bottom: 1rem;
	}

}

.extra-img,
.avatar-img {
	--width: 240px;
	width: var(--width);
	height: var(--width);

	margin: var(--margin) auto var(--margin) auto;
}
.extra-img-center,
.avatar-img-center {
	display: flex;
}
@media screen and (min-width:1024px) {
	.avatar-img,
	.extra-img {
		--width: 320px;
		width: var(--width);
		height: var(--width); 
	}
	.avatar-img-center,
	.extra-img-center {
		display: block;
	}
}


.main-menu-button:hover {
	background-color: rgba(255,255,255,.1);
}

/* MOBILE  */

#banners-carrousel-control_L,
#banners-carrousel-control_R {
	position: absolute;
	z-index: 49;
	width: 48px;
	height: 48px;
	padding: 0px;
	background-color: rgba(255,255,255,0.3);
	background-size: contain;
	border: 2px solid var(--color-bg);

	margin-top: 132px;

	color: var(--color-bg);
	box-shadow: 0px 0px 5px rgba(0,0,0,.5);

	cursor: pointer;
}
#banners-carrousel-control_L {
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAACxIAAAsSAdLdfvwAAAAhdEVYdENyZWF0aW9uIFRpbWUAMjAyMToxMToyNiAxNDowMzowMPTMwQIAAAE3SURBVGhD7Vk5DsIwEIxp4Q0p+AcvoU/HP2jp+BY9LT+AljBGDgIURbJ2ZqNIi7RK44znSLx2SH3fN0v+rZZMPnMPAXMnGAlEAkYH4hEyGmi+PRIwW2gEiASMBppvd00gpbQ2M/4DcBMA8gfMfcG1ZYpwEVDIn0B8i9oxBTT5PKAskM3OP0t17LkWTf59GGM7MuCpnf/MoxDgRV6SgCd5ugBv8lQBc5CnCQD5DeqGyt9o6Evl1Hvq0siojUuxlYBDd+AeSwJndN5OSfoHm7mMzvEe0BuZtwi6gPKtVbr/+X5qJAI8RcgEeImQCvAQIRcwImJPXfmYYFNYZXW64toy50ye/9DkQz3mezCbnKsAJvEBK/ZCCldrMCOBGrcUYyMBhas1mJFAjVuKsZGAwtUazEigxi3F2BdRDHy3FrVdhwAAAABJRU5ErkJggg==")
}
#banners-carrousel-control_R {
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAACxIAAAsSAdLdfvwAAAAhdEVYdENyZWF0aW9uIFRpbWUAMjAyMToxMToyNiAxNDowMzowMPTMwQIAAAE9SURBVGhD7ZkxDsIwDEUJK5yBgXtwEna23oOVjWuxs3IDWCk/qJUqgYRb/29UyUgWA4nzn3+b1LS0bbuY82c5Z/FVewL828F0IB1wViAvIWcB3dPTAXcJnQnSAWcB3dPpDpRSVm5VIxJQASB+g7Uv+G5GaHANpQJAyQ6xRZzCIGo/wAyIPyCeXTTM3N9yUcX3C0RCSAC6Li/ECRlAFIQUIAJCDqCGCAFQQoQBDCDq/zg3xJqxxbIPMtepOmVyGABO5rqtnhHVgSOqf58i+GMOw8ZfOZQHm/weUIp/31e/quf5XS1eChAhXgYQJV4CECmeDgDx+8heQAFQW8orQt7I9JtLYb+hqU09cj4oh5QhCR3AsCZ1SNijBFX1IFkCqCprzZsOWCulGpcOqCprzZsOWCulGpcOqCprzTt7B16L2ny36ci61QAAAABJRU5ErkJggg==")
}

#banners-carrousel-control_L:hover,
#banners-carrousel-control_R:hover {
	background-color: rgba(255,255,255,.5);
}

#banners-carrousel-control_L { margin-left: 20px; }
#banners-carrousel-control_R { margin-left: 252px; }

#banner-img-0,
#banner-img-1,
#banner-img-2,
#banner-img-3,
#banner-img-4,
#banner-img-5,
#banner-img-6,
#banner-img-7,
#banner-img-8,
#banner-img-9,
#banner-img-10 {
	position: absolute;
	opacity: 0;
	/* display: none; */
	transition: opacity .5s ease;
}

.container-banners-carrousel,
#banner-img-0,
#banner-img-1,
#banner-img-2,
#banner-img-3,
#banner-img-4,
#banner-img-5,
#banner-img-6,
#banner-img-7,
#banner-img-8,
#banner-img-9,
#banner-img-10 {
	width: var(--main-width);

	height: 200px;
}

@media screen and (min-width:520px) {
	.container-banners-carrousel,
	#banner-img-0,
	#banner-img-1,
	#banner-img-2,
	#banner-img-3,
	#banner-img-4,
	#banner-img-5,
	#banner-img-6,
	#banner-img-7,
	#banner-img-8,
	#banner-img-9,
	#banner-img-10 {
		height: 300px;
	}


	#banners-carrousel-control_L,
	#banners-carrousel-control_R {

		margin-top: 232px;
	}
	#banners-carrousel-control_L { margin-left: 20px; }
	#banners-carrousel-control_R { margin-left: 412px; }

}

/* Era 1080px */
@media screen and (min-width:1024px) {
	.container-banners-carrousel,
	#banner-img-0,
	#banner-img-1,
	#banner-img-2,
	#banner-img-3,
	#banner-img-4,
	#banner-img-5,
	#banner-img-6,
	#banner-img-7,
	#banner-img-8,
	#banner-img-9,
	#banner-img-10 {
		height: 640px;
	}


	#banners-carrousel-control_L,
	#banners-carrousel-control_R {

		margin-top: 572px;
	}
	#banners-carrousel-control_L { margin-left: 20px; }
	#banners-carrousel-control_R { margin-left: 956px; }
}

.texto-apresentacao {
	margin-top: calc(4 * var(--margin));
}


#page-inicio .container-banners-carrousel {
	cursor: pointer;
}

/* Style to 520px < wide screens */
@media screen and (min-width: 520px) {
	:root {
		--main-width: 480px;
		
		--proportional-height-loading-img: calc(var(--main-width) * 0.1796);
	}

	#menu {
		grid-template-columns: 1fr 1fr 1fr;
	}

	.regulamento {
		height: 600px;
	}

	h2 {
		margin-top: calc(var(--margin) * 4);
	}

	#page-idilio .texto-apresentacao,
	#page-fogo .texto-apresentacao,
	#page-fereza .texto-apresentacao
	
	{
		margin-top: calc(var(--margin) * 4);
	}
	

}


.section-wrap {
	width: var(--main-width);
	margin: 0 auto;
}




/* Style to desktop environment */
/* Era 1080px */
@media screen and (min-width:1024px) {
	:root {
		--main-width: 1024px;

		--width-loading-img: 600px;
		--proportional-height-loading-img: 107.76px;

		--img-width: 512px;
	}

	#first-loading-animation,
	#loading-transition {
		width: 600px;
	}

	p {
		font-size: 18px;
	}

	header {
		display: flex;
		flex-direction: column;
	}
	#svgMainLogo {
		margin-left: auto;
		margin-right: auto;

		width: var(--main-width);
		height: calc(var(--main-width) * 0.43);
	}
	#header-name {
		display: flex;
	}
	#header-name svg {
		margin-left: auto;
		margin-right: auto;

		width: var(--main-width);
		height: calc(var(--main-width) * 0.1171);
	}

	#menu {
		display: grid;
	}

	#menu.items-quantity1 { grid-template-columns: 1fr; }
	#menu.items-quantity2 { grid-template-columns: 1fr 1fr; }
	#menu.items-quantity3 { grid-template-columns: 1fr 1fr 1fr; }
	#menu.items-quantity4 { grid-template-columns: 1fr 1fr 1fr 1fr; }
	#menu.items-quantity5 { grid-template-columns: 1fr 1fr 1fr 1fr 1fr; }
	#menu.items-quantity6 { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; }
	#menu.items-quantity7 { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr; }
	#menu.items-quantity8 { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; }

	.sidepanel-info {
		margin-top: 0px;
	}

	.section-wrap {
		display: grid;

		grid-template-columns: 0.33fr 0.66fr;
	}
	.texto-apresentacao p {
		margin-left: var(--margin);
	}

	.texto-apresentacao {
		margin-top: var(--margin);
	}

	#page-a-galeria .sobre-a-galeria {
		width: var(--img-width);
	}
	.sobre-a-galeria-wrap {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}

	#page-a-galeria p {
		margin-right: calc(4 * var(--margin));
	}

	.slideshow-imgs {
		padding-top: calc(-1 * var(--margin-top-p));
	}

	.regulamento-controls {
		display: flex;
		flex-direction: column;

		height: 600px;
		justify-content: space-between;
	}
	.regulamento-wrap {
		display: grid;
		grid-template-columns: 0.33fr 0.66fr;
	}
	.regulamento {
		margin-left: var(--margin);
	}

	.svg-bandeira-a,
	.svg-bandeira-b,
	.svg-bandeira-c {
		/* fill: var(--color-bg); */
		opacity: 1;
	}
	.svg-bandeira-a {
		animation: bandeiraAA 2s steps(1) infinite;
	}
	@keyframes bandeiraAA {
		0%  { fill: var(--color-content); }
		25% { fill: none; }
		50% { fill: none; }
		75% { fill: none; }
	}
	.svg-bandeira-b {
		animation: bandeiraBB 2s steps(1) infinite;
	}
	@keyframes bandeiraBB {
		0% { fill: none; }
		25% { fill: var(--color-content); }
		50% { fill: none; }
		75% { fill: var(--color-content); }
	}
	.svg-bandeira-c {
		animation: bandeiraCC 2s steps(1) infinite;
	}
	@keyframes bandeiraCC {
		0% { fill: none; }
		25% { fill: none; }
		50%  { fill: var(--color-content); }
		75% { fill: none; }
	}

	.small {
		text-align: left;
	}
	/* Align this section on bottom of contact section */
	.section-compatibilidade-site,
	.section-credit-dev {
		display: flex;
		flex-direction: column;
	}
	.section-compatibilidade-site :nth-child(1),
	.section-credit-dev > * {
		margin-top: auto;
	}

	/* Inscricoes */
	.inscricoes-habilitadas-container {
		height: 600px;
	}
	.inscricoes-habilitadas-container tr td:first-of-type,
	.inscricoes-inabilitadas-container tr td:first-of-type {
		padding-left: 170.667px;
	}
	.inscricoes-habilitadas-container tr td:nth-of-type(3) {
		padding-right: 170.667px;
	}

	/* footer */

}



#banners-carrousel-transition-bar-bg,
#banners-carrousel-transition-bar-top {
	height: 4px;
}
#banners-carrousel-transition-bar-bg {
	width: 100%;
	background-color: var(--color-disabled);
}
#banners-carrousel-transition-bar-top {
	background-color: var(--color-main);
	margin-top: -4px;

	transition: var(--transition);
}


#obras .photo-credit-artwork {
	text-align: right;
	margin-top: 8px;
	font-size: 10px;
}

/* OBRAS */
#artwork-container-1,
#artwork-container-2,
#artwork-container-3,
#artwork-container-4,
#artwork-container-5,
#artwork-container-6,
#artwork-container-7,
#artwork-container-8,
#artwork-container-9,
#artwork-container-10,
#artwork-container-11,
#artwork-container-12,
#artwork-container-13,
#artwork-container-14,
#artwork-container-15,
#artwork-container-16,
#artwork-container-17 {
	display: flex;
	flex-direction: column;
	background-color: white;
}
#artwork-container-1 img,
#artwork-container-2 img,
#artwork-container-3 img,
#artwork-container-4 img,
#artwork-container-5 img,
#artwork-container-6 img,
#artwork-container-7 img,
#artwork-container-8 img,
#artwork-container-9 img,
#artwork-container-10 img,
#artwork-container-11 img,
#artwork-container-12 img,
#artwork-container-13 img,
#artwork-container-14 img,
#artwork-container-15 img,
#artwork-container-16 img,
#artwork-container-17 img {
	margin-left: auto;
}

#view-container-1 img,
#view-container-2 img,
#view-container-3 img,
#view-container-4 img,
#view-container-5 img,
#view-container-6 img,
#view-container-7 img,
#view-container-8 img,
#view-container-9 img,
#view-container-10 img,
#view-container-11 img,
#view-container-12 img,
#view-container-13 img,
#view-container-14 img,
#view-container-15 img,
#view-container-16 img,
#view-container-17 img {
	width: var(--mobile-width);
	height: var(--mobile-height);
}
@media screen and (min-width:520px) {

	#view-container-1 img,
	#view-container-2 img,
	#view-container-3 img,
	#view-container-4 img,
	#view-container-5 img,
	#view-container-6 img,
	#view-container-7 img,
	#view-container-8 img,
	#view-container-9 img,
	#view-container-10 img,
	#view-container-11 img,
	#view-container-12 img,
	#view-container-13 img,
	#view-container-14 img,
	#view-container-15 img,
	#view-container-16 img,
	#view-container-17 img {
		width: var(--tablet-width);
		height: var(--tablet-height);
	}
}
@media screen and (min-width:1024px) {

	#view-container-1 img,
	#view-container-2 img,
	#view-container-3 img,
	#view-container-4 img,
	#view-container-5 img,
	#view-container-6 img,
	#view-container-7 img,
	#view-container-8 img,
	#view-container-9 img,
	#view-container-10 img,
	#view-container-11 img,
	#view-container-12 img,
	#view-container-13 img,
	#view-container-14 img,
	#view-container-15 img,
	#view-container-16 img,
	#view-container-17 img {
		width: var(--desktop-width);
		height: var(--desktop-height);
	}
}
/* Space below */
#view-container-1,
#view-container-2,
#view-container-3,
#view-container-4,
#view-container-5,
#view-container-6,
#view-container-7,
#view-container-8,
#view-container-9,
#view-container-10,
#view-container-11,
#view-container-12,
#view-container-13,
#view-container-14,
#view-container-15,
#view-container-16,
#view-container-17 {
	margin-bottom: 64px;
}
#obras p {
	margin-top: var(--margin-large);
}

.regulamento .item-label {
	padding: 4px;
	background-color: var(--color-item-label-regulamento);
	border-radius: 4px;
	margin-right: 4px;
}


/* VISITA VIRTUAL */
iframe#visita-virtual {
	width: var(--main-width);
	height: calc(var(--main-width) * 2);
}

@media screen and (min-width: 520px) {
	iframe#visita-virtual {
		width: var(--main-width);
		height: calc(var(--main-width) * 1);
	}
}
@media screen and (min-width: 1024px) {
	iframe#visita-virtual {
		width: var(--main-width);
		height: calc(var(--main-width) * .5);
	}
}