*, *::before, *::after	{ box-sizing: border-box; font-family: 'Chivo', sans-serif; }
:root 					{		--size: 75px;	--clr-bg: #003278;	--clr1: #bbbb88;	--clr2: #ccc68d;	--clr3: #eedd99;	--clr4: #eec290;	--clr5: #eeaa88;	}
.container-fluid		{ z-index:1; position: fixed; background: url('../img/cena-entrada.jpg?v=1') no-repeat; background-position: top center; background-size: cover; bottom:0; top:0; }
.container-fluid.sala	{ z-index:1; position: fixed; background: url('../img/cena-sala.jpg?v=1') no-repeat; background-position: top center; background-size: cover; bottom:0; top:0; }
img						{ max-width: 100%; max-height:100%; }
.loading-page			{ background: #003278; width: 100vw; height: 100vh;  }
.no-gutters 			{ margin-right: 0; margin-left: 0; > .col, > [class*="col-"] { padding-right: 0; padding-left: 0; } }
.people .row			{ width: 100%; }
.zidx15					{ position: relative; z-index: 15; }
.zidx30					{ position: relative; z-index: 30; }
.loader 				{ position: fixed; top:0; left:0; right:0; bottom:0; display: block;  z-index:1000;  background-color: var(--clr-bg); display: grid; place-items: center; }
.spinner 				{ --animation-duration: 650ms; position: relative; width: var(--size); height: var(--size); } 
.spinner .spinner-item 	{ 
							position: absolute; width: var(--item-size); height: var(--item-size); top: calc(50% - var(--item-size) / 2); left: calc(50% - var(--item-size) / 2); 
							border: 4px solid transparent; border-left: 4px solid var(--clr-spinner); border-right: 4px solid var(--clr-spinner); border-radius: 50%;
							animation: spinner2 var(--animation-duration) linear infinite;
						}
.spinner .spinner-item:nth-of-type(1) { --item-size: var(--size); --clr-spinner: var(--clr1); border-top: 4px solid var(--clr1); }
.spinner .spinner-item:nth-of-type(2) { --item-size: calc(var(--size) - 15px); --clr-spinner: var(--clr5); border-bottom: 4px solid var(--clr5); }
.spinner .spinner-item:nth-of-type(3) { --item-size: calc(var(--size) - 30px); --clr-spinner: var(--clr3); border-top: 4px solid var(--clr3); }


@media (orientation:landscape) and (min-width: 1601px) { /* PC = 1920 x 1080px */ 
	img					{ zoom: 70%; }
	.logo				{ width: 100%; height:235px; }
	.superior-row 		{ margin-top: 150px; }
	.superior-row-c		{ margin-top: 115px; }
	.people				{ width: auto; height: 200px; position: absolute; left: 0; right: 0; z-index: 10; display: block; top: 460px;  }
	.displays			{ position: relative; margin-top: 200px; z-index:15; }
	.displays-c			{ position: relative; margin-top: 100px; z-index:15; }
	.displays img		{ zoom: 60%; }
}

@media (orientation:landscape) and (max-width: 1600px) {  /* PC = 1600 x 770px | 1440 x 900px | 1536 x 864px */ 
	img					{ zoom: 60%; }
	.logo				{ width: 100%; height:235px; }
	.superior-row 		{ margin-top:45px; }
	.people				{ width: auto; height: 200px; position: absolute; left: 0; right: 0; z-index: 10; display: block; top: 350px; }
	.displays			{  position: relative; z-index:15; margin-top: 150px; }
	.displays img		{ zoom: 50%; }
}

@media (orientation:landscape) and (max-height: 770px) and (max-width: 1370px) { /* PC = 1366 x 768px */ 
	img					{ zoom: 60%; }
	.logo				{ width: 100%; height:190px; margin-top:15px; }
	.superior-row 		{ margin-top: 40px; }
	.people				{ width: auto; height: 200px; position: absolute; left: 0; right: 0; z-index: 10; display: block; top: 300px; }
	.displays			{  position: relative; z-index:15; margin-top: 100px; }
}

@media (orientation:landscape) and (max-height: 670px) and (max-width: 1300px) { /* PC = 1270 x 670px */
	img					{ zoom: 96%; }
	.superior-row 		{ margin-top:130px; }
	.people				{ display: none; }
	.displays			{ margin-top: -20px; }
}

@media (orientation:portrait) and (max-width: 719px) {  /* MOBILE 2 */
	img					{ zoom: 50%; }
	.logo				{ width: 100%; height:160px; margin-top: 10px; }
	.superior-row 		{ margin-top: 35px; }
	.superior-row-c		{ margin-top: 210px; }
	.superior-row img	{ zoom: 40%; }
	.small-people		{ width: auto; height: auto; position: absolute; left: 0; right: 0; z-index: 10; margin-top: 45px; }	
	.small-people img 	{ zoom: 50%; }
	.displays			{ height: auto; position: relative; z-index:20; margin-top: 135px; }
	.displays-c			{ height: auto; position: relative; z-index:20; margin-top: 40px; }
	.displays .col		{ padding: 5px; }
	.displays img		{ zoom: 55%; }
}

@media (orientation:portrait) and (min-width: 720px ) and (max-width: 900px) { /* MOBILE 1 */
	img					{ zoom: 100%; }
	.superior-row 		{ margin-top:150px; }
	.small-people		{ top: 630px; z-index:20; }	
	.displays			{ position: absolute; top: 670px; left:0; right: 0; width: 100%; height: auto; z-index:20; }
}


@keyframes spinner2 { to { transform: rotate(360deg); } }

@keyframes neon {
  from 					{ box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #228DFF, 0 0 35px #228DFF, 0 0 40px #228DFF, 0 0 50px #228DFF, 0 0 75px #228DFF; }
  to 					{ box-shadow: 0 0 0px #fff, 0 0 5px #fff, 0 0 8px #fff, 0 0 10px #228DFF, 0 0 19px #228DFF, 0 0 20px #228DFF, 0 0 25px #228DFF, 0 0 40px #228DFF; }
} /* glow */

@-moz-keyframes neon {
  from 					{ box-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #228DFF, 0 0 70px #228DFF, 0 0 80px #228DFF, 0 0 100px #228DFF, 0 0 150px #228DFF; }
  to 					{ box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #228DFF, 0 0 35px #228DFF, 0 0 40px #228DFF, 0 0 50px #228DFF, 0 0 75px #228DFF; }
} /* glow for mozilla */

@-webkit-keyframes neon {
  from 					{ box-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #228DFF, 0 0 70px #228DFF, 0 0 80px #228DFF, 0 0 100px #228DFF, 0 0 150px #228DFF; }
  to 					{ box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #228DFF, 0 0 35px #228DFF, 0 0 40px #228DFF, 0 0 50px #228DFF, 0 0 75px #228DFF; }
} /* glow for webkit */