/* @import "colors.scss"; */

/* @import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap'); */

/* body {
	font-family: 'Lato', sans-serif !important;

	font-weight: normal;

	
} */

.komunikatplayera {
	font-family: 'Lato', sans-serif !important;
	font-weight: 300;
	color: black;
	text-align: center;
	/* padding: 50px;
	margin: 20px; */
}

.respo {
	background-color: null;

	/* border: solid 0.3px red;
	background-color: aquamarine; */
}

.font-size_8 {
	font-size: 1rem;
}
.font-size_13 {
	font-size: 1rem;
}
.font-size_10 {
	font-size: 0.9rem;
	margin-top: 1rem;
}

.font_player {
	font-size: 1rem;
}
.font_player-tytul {
	font-size: 1.2rem;
}

.font_300 {
	font-weight: 300;
}

.top-margin {
	margin-top: 3rem;
}

.font-player-tytul {
	font-weight: 300;
	font-size: 1rem;
}

.font-player-tytul-multi {
	font-weight: 300;
	font-size: 1.9rem;

	/* top: 35%; */
	bottom: 8%;
	left: 5%;
	line-height: 1.8rem;
	width: 90%;
	text-align: left;
	color: white;
	position: absolute;
	overflow: hidden;
	transition-duration: 0.2s ease-out;
	-webkit-transition-duration: 0.2s;
}

.font-player-tytul-multi-small {
	font-weight: 300;
	font-size: 0.8rem;
	margin-right: 5%;
	margin-bottom: 0.9rem;
	margin-top: 0.1rem;
	left: 5%;
	line-height: 1rem;
	cursor: pointer;
}

.font-player-tytul-multi-small-OPIS {
	font-weight: 300;
	font-size: 0.8rem;
	/* margin-bottom: 0.2rem; */
	margin-top: 1.2rem;
	left: 5%;
	/* line-height: 1rem; */
	cursor: pointer;
}
.button-player-left {
	color: white;
	background-color: none;
	border-color: white;
	border-style: solid;

	width: 30%;
	height: 14%;
	border-width: 0.5px;
	position: absolute;
	left: 5%;
	bottom: 8%;
	visibility: hidden;

	transition-duration: 0.1s ease-out;
	-webkit-transition-duration: 0.1s;
}
.button-player-right {
	color: white;
	background-color: none;
	border-color: white;
	border-width: 1px;
	border-style: solid;
	width: 25%;
	height: 14%;
	border-width: 0.5px;
	position: absolute;
	right: 5%;
	bottom: 8%;
}

.font-player-multi-button {
	font-weight: 300;
	font-size: 0.7rem;
	display: flex;
	justify-content: center;
	align-items: center;
}

/* #overlay {
	position: fixed;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgb(0, 0, 0, 0.7);

	display: none;
	
	z-index: 3;
} */

#overlay {
	position: absolute;
	/* position: -webkit-sticky; */

	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgb(0, 0, 0, 0.2);
	display: none;
	/* opacity: 50%; */
	z-index: 3;
}

#overlay-tlo {
	position: absolute;
	height: 500vh;
	width: 100%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgb(0, 0, 0, 0.5);
	display: none;
	/* opacity: 50%; */
	z-index: 2;
}

.sticky {
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	background-color: none;
	padding: 1px;
	font-size: 20px;
	z-index: 10;
}

.player-pasek {
	/* background-color: black;
	color: white; */
	height: 60px;
	z-index: 5;
}

.sticky-top {
	position: relative;
}

.pod-tytul-multi {
	height: 14%;
	/* background-color: red; */
}
@media (max-height: 360px) {
	.top-margin {
		margin-top: 0.5rem;
	}

	.font-size_10 {
		font-size: 1rem;
		margin-top: 1rem;
	}
}

@media (min-width: 576px) {
	.font-size_13 {
		font-size: 1.4rem;
	}

	.font-size_10 {
		font-size: 1.2rem;
		margin-top: 1rem;
	}

	.top-margin {
		margin-top: 5rem;
	}

	.font-player-tytul {
		font-weight: 300;
		font-size: 2rem;
	}

	.player-pasek {
		/* background-color: black;
		color: white; */
		height: 120px;
		z-index: 5;
		/* width: 100%; */
		/* max-height: 50px; */
		/* height: auto; */
		/* margin: 0px; */
	}

	.font-player-tytul-multi {
		font-weight: 300;
		/* font-size: 1.4rem; */
		font-size: 3vw;
		bottom: 8%;
		left: 5%;
		/* line-height: 1.2rem; */
		line-height: 2.4vw;
		width: 90%;
		text-align: left;
		color: white;
		position: absolute;
		overflow: hidden;
		transition-duration: 0.2s ease-out;
		-webkit-transition-duration: 0.2s;
	}
	.font-player-tytul-multi-small {
		font-weight: 300;
		font-size: 0.7rem;
		margin-right: 5%;
		margin-bottom: 0.1rem;
		margin-top: 0.3rem;
		left: 5%;
		line-height: 0.8rem;
		cursor: pointer;
	}

	.font-player-tytul-multi-small-OPIS {
		font-weight: 300;
		font-size: 0.7rem;
		/* margin-bottom: 0.2rem; */
		margin-top: 0.4rem;
		left: 5%;
		line-height: 1rem;
		cursor: pointer;
	}

	.button-player-left {
		color: white;
		background-color: none;
		border-color: white;
		border-style: solid;
		border-width: 0.5px;
		width: 20%;
		height: 24%;

		position: absolute;
		left: 5%;
		bottom: 8%;
		visibility: hidden;

		/* transition-duration: 0.1s ease-out; */
		/* -webkit-transition-duration: 0.1s; */
	}
	.button-player-right {
		color: white;
		background-color: none;
		border-color: white;
		border-width: 0.5px;
		border-style: solid;
		width: 20%;
		height: 24%;
		position: absolute;
		right: 5%;
		bottom: 8%;
	}

	.font-player-multi-button {
		font-weight: 300;
		font-size: 0.8rem;
		display: flex;
		justify-content: center;
		align-items: center;
	}
}

@media (min-width: 640px) {
	.pod-tytul-multi {
		height: 50%;
		/* background-color: brown; */
	}

	.font-size_13 {
		font-size: 1.4rem;
	}

	.font-size_10 {
		font-size: 1.2rem;
		margin-top: 1rem;
	}

	.top-margin {
		margin-top: 5rem;
	}

	.font-player-tytul {
		font-weight: 300;
		font-size: 2rem;
	}
	.font-player-tytul-multi {
		font-weight: 300;
		/* font-size: 1.5rem; */
		bottom: 8%;
		left: 5%;
		/* line-height: 1.2rem; */
		width: 90%;
		text-align: left;
		color: white;
		position: absolute;
		overflow: hidden;
		transition-duration: 0.2s ease-out;
		-webkit-transition-duration: 0.2s;
	}

	.font-player-tytul-multi-small {
		font-weight: 300;
		font-size: 0.8rem;
		margin-right: 5%;
		/* margin-bottom: 0.2rem; */
		/* margin-top: 0.1rem; */
		left: 5%;
		line-height: 1rem;
		cursor: pointer;
	}
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
	.sticky-top {
		position: sticky;
		position: webkit-sticky;
	}

	.font-size_13 {
		font-size: 1.5rem;
	}
	.font-size_10 {
		font-size: 1.3rem;
		margin-top: 1rem;
	}

	.top-margin {
		margin-top: 10rem;
	}

	.font-player-tytul-multi-small {
		margin-bottom: 1rem;
	}

	.font-player-tytul-multi {
		font-weight: 300;
		/* font-size: 1.6rem; */
		bottom: 8%;
		left: 5%;
		/* line-height: 1.3rem; */
		width: 90%;
		text-align: left;
		color: white;
		position: absolute;
		overflow: hidden;
		transition-duration: 0.2s ease-out;
		-webkit-transition-duration: 0.2s;
	}
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
	.font-size_13 {
		font-size: 1.8rem;
	}
	.font-size_10 {
		font-size: 1.3rem;
		margin-top: 1rem;
	}

	.top-margin {
		margin-top: 12rem;
	}
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
	.font-size_13 {
		font-size: 2rem;
	}
	.font-size_10 {
		font-size: 1.5rem;
		margin-top: 1rem;
	}

	.top-margin {
		margin-top: 14rem;
	}

	.font-player-tytul-multi {
		font-weight: 300;
		/* font-size: 2rem; */
		bottom: 8%;
		left: 5%;
		/* line-height: 2rem; */
		width: 90%;
		text-align: left;
		color: white;
		position: absolute;
		overflow: hidden;
		transition-duration: 0.2s ease-out;
		-webkit-transition-duration: 0.2s;
	}
	.font-player-tytul-multi-small {
		font-weight: 300;
		font-size: 0.8rem;
		margin-right: 5%;
		/* margin-bottom: 0.2rem; */
		margin-top: 0.3rem;
		left: 5%;
		line-height: 1rem;
		cursor: pointer;
	}

	.font-player-tytul-multi-small-OPIS {
		font-weight: 300;
		font-size: 0.8rem;
		/* margin-bottom: 0.2rem; */
		margin-top: 0.8rem;
		left: 5%;
		/* line-height: 1rem; */
		cursor: pointer;
	}

	.button-player-left {
		color: white;
		background-color: none;
		border-color: white;
		border-style: solid;
		border-width: 0.5px;
		width: 20%;
		height: 24%;

		position: absolute;
		left: 5%;
		bottom: 8%;
		visibility: hidden;

		/* transition-duration: 0.1s ease-out; */
		/* -webkit-transition-duration: 0.1s; */
	}
	.button-player-right {
		color: white;
		background-color: none;
		border-color: white;
		border-width: 0.5px;
		border-style: solid;
		width: 20%;
		height: 24%;
		position: absolute;
		right: 5%;
		bottom: 8%;
	}

	.font-player-multi-button {
		font-weight: 300;
		font-size: 1rem;
		display: flex;
		justify-content: center;
		align-items: center;
	}
}

@media (min-width: 1600px) {
	.font-player-tytul-multi {
		font-size: 3rem;
	}
}

/* 
@media (min-width: 1400px) {
	.font-size_13 {
		font-size: 2rem;
	}
	.font-size_10 {
		font-size: 1.6rem;
		margin-top: 1rem;
	}

	.top-margin {
		margin-top: 16rem;
	}

	.font-player-tytul-multi {
		font-weight: 300;
		font-size: 2.6rem;
		bottom: 8%;
		left: 5%;
		line-height: 2rem;
		width: 90%;
		text-align: left;
		color: white;
		position: absolute;
		overflow: hidden;
		transition-duration: 0.2s ease-out;
		-webkit-transition-duration: 0.2s;
	}
	.font-player-tytul-multi-small {
		font-weight: 300;
		font-size: 1rem;
		margin-right: 5%;
		
		margin-top: 1.3rem;
		left: 5%;
		line-height: 1.2rem;
		cursor: pointer;
	}

	.font-player-tytul-multi-small-OPIS {
		font-weight: 300;
		font-size: 0.8rem;

		margin-top: 2.8rem;
		left: 5%;
		line-height: 1.3rem;
		cursor: pointer;
	}
}

@media (min-width: 1600px) {
	.font-size_13 {
		font-size: 2rem;
	}
	.font-size_10 {
		font-size: 1.6rem;
		margin-top: 1rem;
	}

	.top-margin {
		margin-top: 16rem;
	}

	.font-player-tytul-multi {
		font-weight: 300;
		font-size: 3rem;
		bottom: 8%;
		left: 5%;
		line-height: 2rem;
		width: 90%;
		text-align: left;
		color: white;
		position: absolute;
		overflow: hidden;
		transition-duration: 0.2s ease-out;
		-webkit-transition-duration: 0.2s;
	}
	.font-player-tytul-multi-small {
		font-weight: 300;
		font-size: 1rem;
		margin-right: 5%;

		margin-top: 1.8rem;
		left: 5%;
		line-height: 1.2rem;
		cursor: pointer;
	}

	.font-player-tytul-multi-small-OPIS {
		font-weight: 300;
		font-size: 0.8rem;
		margin-top: 3.8rem;
		left: 5%;
		line-height: 3.3rem;
		cursor: pointer;
	}
} */

.login {
	background-color: white;
	border-radius: 0;
	border-width: 2px;
	border-color: black;
}

#logo_player {
	height: 85%;
	width: auto;
	max-width: 100%;
	max-height: 90%;
	overflow: hidden;
	/* border: gray solid 1px; */
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	display: block;
}

.playerObject {
	background-color: white; /* rgb(27, 27, 127); */
	color: silver;
	font-size: xx-large;
	/* margin: 5px; */
	display: flex;
	justify-content: center;
	align-items: center;
}

.playerObjectKino {
	background-color: white; /* rgb(27, 27, 127); */
	/* border: solid 1px gray; */
	color: silver;
	font-size: xx-large;
	/* margin: 1px; */
	display: flex;
	justify-content: center;
	align-items: center;
}

.modal-dialog {
	height: auto;
}

.smalltext {
	font-size: 8px;
}

.list-group-item.active {
	z-index: 2;
	color: black;

	background-color: #76bb74;
	border-color: #012b00;
}

/* .list-group-item-klient.active {
	z-index: 2;
	color: black;
	background-color: #fd9d0d;
	border-color: #0d6efd;
	
} */

.tekst-listy {
	font-size: medium;
}

input.ng-invalid {
	border-color: red;
}

.input_bold {
	font-weight: 700;
}

.form-control:focus {
	/* border-color: #5cb85c; */
	box-shadow: none;
	-webkit-box-shadow: none;
}

.has-error .form-control:focus {
	border-color: red;
	/* box-shadow: none; */
	/* -webkit-box-shadow: none; */
}
/*  */
.list-group-item-film {
	color: rgb(0, 51, 0);
	background-color: rgb(238, 251, 249);
}
/* .list-group-item-film.list-group-item-action:hover {
	background-color: rgb(191, 255, 229);
} */

.list-group-item-zwiastun {
	color: #130f51;
	background-color: rgb(248, 254, 242);
}
/* .list-group-item-zwiastun.list-group-item-action:hover {
	background-color: rgb(238, 251, 207);
} */
.list-group-item-reklama {
	color: rgb(0, 0, 0);
	background-color: rgb(255, 245, 254);
}
/* .list-group-item-reklama.list-group-item-action:hover {
	background-color: rgb(249, 219, 253);
} */
.list-group-item-zapowiedz {
	color: #130f51;
	background-color: #ffffcc;
}
/* .list-group-item-zapowiedz.list-group-item-action:hover {
	background-color: #ffff99;
} */
.list-group-item-spotkanie {
	color: #130f51;
	background-color: rgb(255, 249, 246);
}
/* .list-group-item-spotkanie.list-group-item-action:hover {
	background-color: rgb(253, 199, 190);
} */

/*  */
.list-group-item-success-roboczy {
	background-color: rgb(180, 202, 179);
}

.list-group-item-warning-roboczy {
	background-color: rgb(228, 226, 208);
}
/* .list-group-item-success-kolekcja {
	background-color: rgb(85, 255, 136);
} */
/* .list-group-item-success-kolekcja.list-group-item-action:hover {
	color: #130f51;
	background-color: #2b6e3c;
} */

.list-group-item-klient {
	color: #130f51;
	background-color: rgb(248, 254, 242);
}

.list-group-item-log {
	/* color: #130f51; */
	background-color: rgb(230, 246, 255);
	/* width: 100%; */
	/* height: 100%; */
	/* border: 1px black solid; */
	margin: 0px;
	padding: 0px;
}
/* .list-group-item-klient.list-group-item-action:hover {
	background-color: rgb(238, 251, 207);
} */

.list-group-item-kod {
	color: #130f51;
	background-color: rgb(242, 249, 254);
}
.list-group-item-kod.list-group-item-action:hover {
	background-color: rgb(196, 229, 252);
	/* ; */
}

.geoblokada {
	background-color: rgb(255, 92, 113);
	font-weight: 700;
}
.ramkaTB {
	margin-bottom: 5px;
	margin-top: 5px;
}
/* input.ng-touched.ng-invalid {
	background-color: green;
} */

/* .autoModal.modal.modal-body {
	max-height: 100%;
} */

/* .imgbutton {
	width: 100%;
	height: auto;
	margin-top: 3%;
	margin-bottom: 3%;
} */

/* .textbutton {
	width: 40%;
	height: 100%;
	margin: 4px;
	margin-left: 6px;
	border: black solid 1px;

	display: inline-block;
} */

.imgbutton {
	/* background: url("./images/GF/filmy/SZARLATAN/button.jpg") no-repeat; */
	width: 100%;
	height: auto;
	background-size: auto;

	display: flex;
	flex-direction: column-reverse;
}

.bottom {
	/* background-color: rgba(255, 255, 0, 0.6); */
	/* background: url('./images/icons/play-circle.svg'); */
	display: flex;
	justify-content: center;
	margin: auto;
	width: 100%;
	height: 100%;

	/* font-size: 100px; */
}

.btnnn {
	background: url('./images/icons/play-circle.svg') center;
	background-repeat: no-repeat;
	background-size: 70%;
	padding: 5px, 7px;
	text-align: center;
	/* background-color: green; */
	/* border-radius: 5px; */
	border: none;
	display: inline-block;
	width: 100%;
	height: 100%;
	/* font-size: 100px; */
}

.kontener {
	position: relative; /* obrazek będzie się zmieniał rozmiar wraz ze stroną */
	text-align: center; /* wyśrodkowanie obrazka */
	color: black; /* kolor tekstu */
}

.guzik {
	position: absolute;
	top: 50%; /* położenie względem kontenera, ale też wynikające z ilości tekstu. nad tym należy mieć kontrolę. przycisk będzie na środku, ale tylko w pionie. w poziomie będzie schodził poniżej tekstu */
	left: 50%;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	width: 50%;
	height: 50%;
	opacity: 50%;
	transition: opacity .3s;
	cursor: pointer;
}
.guzik:hover {
	cursor: pointer;
	opacity: 100%;
	transition: opacity .3s;
}

.collapse-guzik {
	position: relative;
	top: 5%; /* położenie względem kontenera, ale też wynikające z ilości tekstu. nad tym należy mieć kontrolę. przycisk będzie na środku, ale tylko w pionie. w poziomie będzie schodził poniżej tekstu */
	left: 95%;
}
.collapse-guzik:hover {
	cursor: pointer;
	/* opacity: 100%; */
	/* transition: opacity .3s; */
}

.accordion-button {
	margin: 0px;
	padding: 0px;
	border: none;
	/* background-color: green; */
}

.footer {
	background-color: white;
}

#helpIcon:hover {
	cursor: pointer;
}
#help {
	display: none;
	margin: 20px;
	background-color: white;
	color: black;
	border-color: black;
	border-radius: 0px;
}
#help2 {
	display: none;
}

.oknokody-0 {
	border: solid 1px silver;
	background-color: rgb(199, 255, 199);
	margin-top: 5px;
	margin-bottom: 20px;
	padding: 10px;
}

.oknokody-2 {
	border: solid 1px silver;
	background-color: rgb(172, 172, 172);
	margin-top: 5px;
	margin-bottom: 20px;
	padding: 10px;
}
.oknokody-1 {
	border: solid 1px silver;
	background-color: rgb(255, 237, 157);
	margin-top: 5px;
	margin-bottom: 20px;
	padding: 10px;
}
.oknokody-x {
	/* border: solid 1px silver; */
	background-color: rgb(255, 255, 255);
	margin-top: 5px;
	margin-bottom: 20px;
	padding: 10px;
}

/* .oknokody-color-0 {
	background-color: rgb(199, 255, 199);
}

.oknokody-color-2 {
	background-color: rgb(172, 172, 172);
}
.oknokody-color-1 {
	background-color: rgb(255, 237, 157);
} */

/* .pomoc {
	border-bottom: solid black 1px;
} */
.pomoc:hover {
	color: rgb(76, 192, 165);
	cursor: pointer;
	font-weight: 400;
}

a:link {
	color: rgb(0, 51, 0);
}

a:visited {
	color: rgb(0, 51, 0);
}

a:hover {
	color: rgb(76, 192, 165);
}

a:active {
	color: rgb(76, 192, 165);
}

.my-alert {
	background-color: #ffafaf;
	border: solid 1px #381c1c;
	color: #381c1c;
	margin-top: 1rem;
	padding: 10px;
}

/* 
nowy player!
*/

.accordion {
	background-color: #eee;
	color: #444;
	/* cursor: pointer; */
	/* padding: 18px; */
	width: 100%;
	/* text-align: left; */
	border: none;
	/* outline: none; */
	transition: 0.4s;
}

/* .active,
.accordion:hover {
	background-color: #ccc;
} */

/* .panel {
	padding: 0 18px;
	background-color: white;
	display: none;
	overflow: hidden;
} */

.panel {
	padding: 0 18px;
	background-color: white;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
}

.tytul {
	/* padding: 0 18px; */
	text-align: left;
	color: white;
	width: 50%;
	/* height: 3rem; */
	/* margin: 10px; */
	position: absolute;
	left: 50px;
	top: 5%;

	overflow: hidden;
	/* transition: max-height 0.2s ease-out; */
	transition-duration: 0.2s ease-out;
	-webkit-transition-duration: 0.2s;
}

.button-player-right:hover {
	border-width: 0.5px;
	cursor: pointer;
	background-color: rgb(255, 255, 255);
	color: black;
	border-color: gray;
}

.button-player-left:hover {
	border-width: 0.5px;
	cursor: pointer;
	/* background-color: rgb(255, 255, 255, 0.2); */
	background-color: rgb(255, 255, 255);
	color: black;
	border-color: gray;
}

.harmonijka {
	margin: 0px;
}
/* .tytul:hover {
	width: 80%;
	top: 30%;
	background-color: red;
} */
.log-element-prec {
	margin-top: 3px;
	margin-left: 3%;
}

.table-rozliczenie {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid black;

	table-layout: fixed;
}
.table-rozliczenie td {
	border: 1px solid gray;
	border-collapse: collapse;
}
