@charset "utf-8";
/* CSS Document */

.formMessage label{
    float: left;

}
.formMessage input{
    width: auto;
		margin: 5px 5px 0 20px;
}

* {
	margin: 0px;
	padding: 0px;
	-webkit-tap-highlight-color: transparent;
}
*:focus {
    outline: none;
}
:root {
	--color-seda1: #dcdcdd;
	--color-seda2: #999999;
	--color-seda3: #303233;
	--color-blue: #ba0020;
	--color-orange: #ba0020;
	--color-green: #ba0020;
	--color-red: #ba0020;
	--color-white: #ffffff;
	--color-green-true: #05a74e;
}

@font-face {
	font-family: 'MADE TOMMY';
	src: url('webfonts/MADETOMMY.eot');
	src: url('webfonts/MADETOMMY.eot?#iefix') format('embedded-opentype'),
	url('webfonts/MADETOMMY.woff2') format('woff2'),
	url('webfonts/MADETOMMY.woff') format('woff'),
	url('webfonts/MADETOMMY.ttf') format('truetype'),
	url('webfonts/MADETOMMY.svg#MADETOMMY') format('svg');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'MADE TOMMY';
	src: url('webfonts/MADETOMMY-Medium.eot');
	src: url('webfonts/MADETOMMY-Medium.eot?#iefix') format('embedded-opentype'),
	url('webfonts/MADETOMMY-Medium.woff2') format('woff2'),
	url('webfonts/MADETOMMY-Medium.woff') format('woff'),
	url('webfonts/MADETOMMY-Medium.ttf') format('truetype'),
	url('webfonts/MADETOMMY-Medium.svg#MADETOMMY-Medium') format('svg');
	font-weight: bold;
	font-style: bold;
	font-display: swap;
}

@font-face {
    font-family: 'Prometo';
    src: url('webfonts/subset-Prometo-Bold.eot');
    src: url('webfonts/subset-Prometo-Bold.eot?#iefix') format('embedded-opentype'),
        url('webfonts/subset-Prometo-Bold.woff2') format('woff2'),
        url('webfonts/subset-Prometo-Bold.woff') format('woff'),
        url('webfonts/subset-Prometo-Bold.ttf') format('truetype'),
        url('webfonts/subset-Prometo-Bold.svg#Prometo-Bold') format('svg');
    font-weight: bold;
    font-style: bold;
    font-display: swap;
}

@font-face {
    font-family: 'Prometo';
    src: url('webfonts/subset-Prometo.eot');
    src: url('webfonts/subset-Prometo.eot?#iefix') format('embedded-opentype'),
        url('webfonts/subset-Prometo.woff2') format('woff2'),
        url('webfonts/subset-Prometo.woff') format('woff'),
        url('webfonts/subset-Prometo.ttf') format('truetype'),
        url('webfonts/subset-Prometo.svg#Prometo') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'OCRAExtended';
    src: url('webfonts/subset-OCRAExtended.eot');
    src: url('webfonts/subset-OCRAExtended.eot?#iefix') format('embedded-opentype'),
        url('webfonts/subset-OCRAExtended.woff2') format('woff2'),
        url('webfonts/subset-OCRAExtended.woff') format('woff'),
        url('webfonts/subset-OCRAExtended.ttf') format('truetype'),
        url('webfonts/subset-OCRAExtended.svg#OCRAExtended') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

body
{
	background: #f4f4f5;
	font-size: 15px;
	font-family: 'Prometo', sans-serif;
	color: var(--color-seda3);
}

a {
	text-decoration: none;
	transition: 0.4s;
	font-weight:bold;
	color: var(--color-orange);
}
a:hover {
	color: var(--color-green);
}

a img {
	border: none;
}

h1
{
	font-size: 35px;
	line-height: 3.8em;
	font-weight: normal;
	color: var(--color-seda3);
}
h2
{
	font-size: 25px;
	line-height: 2.8em;
	font-weight: normal;
	color: var(--color-seda3);
	padding: 0 30px;
	width: 95%;
	float: left;
}
h2#swal2-title {
	width: auto;
}

.h2v2
{
	line-height: 1.8em;
	padding: 0;
	margin: 0 0 20px 0;
	width: 100%;
}


h4 {
	margin-bottom: 10px;
}

hr { 
  display: block;
  margin-top: 20px;
  margin-bottom: 20px;
  margin-left: auto;
  margin-right: auto;
  border-style: inset;
  border-width: 1px;
	width: 100%;
	float: left;

} 

.mgb-30 {
	margin-bottom: 30px !important;
}


.loginbox
{
	width: 420px;
	height: auto;
	position: absolute;
	top: 50%;
	left:50%;
	transform: translate(-50%,-50%);
	/*background: #fff;*/
	/*border-radius: 20px;*/
	padding: 50px;
}
.loginbox h1
{
	text-align: center;
	margin: 25px 0;
}
.loginbox img
{
	margin: auto;
	display: block;
}
.loginbox p
{
	color: var(--color-seda2);
	float: left;
	display: block;
	margin: 10px 0;
	width: 100%;
}
.loginbox a
{
	color: var(--color-seda2);
	font-weight: normal;
	text-decoration: underline;
}
.loginbox a:hover
{
	color: var(--color-green);
	text-decoration: none;
}
.loginbox form
{
	margin: 50px 0 0 0;
	float: left;
	width: 100%;
}
.loginbox-logo
{
	width: 200px;
	height: auto;
}
.regbox
{
	position: relative;
	margin: auto;
	top: auto;
	left: auto;
	transform: none;
}
.input-container {
	position:relative;
	float:left;
	width: 100%;

}
.input50{
	width: 50%;

}
.input-info {
	display: none;
	height: 20px;
	width: 350px;
	text-align:left;
	font-size: 12px;
}
.input-info-visible {
	height: 20px;
	width: 350px;
	text-align:left;
	font-size: 12px;
	margin-bottom: 10px;
	display: block !important;
	position:absolute;
	top:-17px;
	left: 0;
	z-index: 999;
	color: #ba0020;
}
.show-label .input-info {
	display: block;
}
.show-label .input-container {
	margin-bottom: 10px;
}
input {
	padding: 15px 15px 15px 15px;
	color: var(--color-seda2);
	width: calc(100% - 30px);
	font-family: 'Prometo', sans-serif;
	font-size: 15px;
	float:left;
	display:block;
	position:relative;
	border-bottom: solid 1px #787878;
	border-top: none;border-left: none;border-right: none;
	margin-bottom: 20px;
	background: #ededed;
}
.select-style + .input-info {
	display: block !important;
	position:absolute;
	top:-17px;
	left: 0;
	z-index: 999;
	color: #ba0020;
}
.collection-input-container .input-info {
	display: block !important;
	position:absolute;
	top:-17px;
	left: 0;
	z-index: 999;
	color: #ba0020;
}
input:focus {
	border-bottom: solid 1px #ba0020;
	color: var(--color-seda3);
}

input:not([type='checkbox']):focus + span {
	display: block;
	position:absolute;
	top:-17px;
	left: 0;
	z-index: 999;
	color: #ba0020;
}

.checkbox-mrgn{
	margin: 3px 10px 30px 10px !important;
}

.radio-input{
	width: auto;
	margin: 4px 0px 0 0;
	width: 40px;
}

.radio-label{
	width: calc(100% - 40px);
	margin: 0 0 30px 10px;
}
.radio-label img{
	float:right;
	margin: 20px 5px 50px 20px;
}
.cards-left img{
	float:left !important;
	margin: 10px 3px;
}


.help-text {
	color: var(--color-seda2);
	font-family: 'Prometo', sans-serif;
	font-size: 13px;
	font-style: italic;
}

button {
	/*border-radius: 10px;*/
	text-transform: uppercase;
	font-family: 'Prometo', sans-serif;
	border: none;
}

.gradient-btn {
	width: 70%;
	height: 46px;
	float: right;
	border: double 1px transparent;
	/*border-radius: 10px;*/
	background-image: linear-gradient(#f4f4f5, #f4f4f5), radial-gradient(circle at top left, #ba0020,#ba0020);
	background-origin: border-box;
	background-clip: content-box, border-box;
	margin: 30px 0 0 0;
	color: var(--color-red);
	font-size: 15px;
}
.gradient-btn:hover {
	border: none;
	background-image:  radial-gradient(circle at top left, #ba0020,#ba0020);
	background-origin: border-box;
	background-clip: content-box, border-box;
	color: #fff;
	cursor: pointer;
}

.grey-btn-reg {
	border: solid 1px var(--color-seda1);
	width: 25%;
	height: 44px;
	background: #f4f4f5;
	float: left;
	margin: 30px 0 0 0;
	text-transform: uppercase;
	/*border-radius: 10px;*/
	line-height: 44px;
	text-align: center;
	color: var(--color-seda3);
}
.grey-btn-reg:hover {
	background: var(--color-seda1);
	color: var(--color-seda3);
}
.error {
	/*border-radius: 10px;*/
	color: #fff;
	padding: 25px;
	margin: 10px 0px;
	width: calc(100% - 50px);
	max-width: 550px;
	/*float: left;*/
	max-height: 30px;
}
.error img{
	float: left;
	margin: 4px 20px 0 0;
}
.error a{
	color: #fff !important;
	text-decoration: none !important;
	font-weight: bold;
	line-height: 50px;
}
.green-bg {
	background: var(--color-green);
}
.orange-bg {
	background: var(--color-orange);
}

.save-pass {
	float: right;
	color: var(--color-seda2);
	text-align: right;
}
.save-pass input{
	float: left;
	margin: 3px 10px;
	padding: 0;
	width: 20px;
}
.user-stats {
	float: right;
	min-width: 500px;
	padding: 0 60px 0 0;
}
.user-stat {
	float: right;
	border-right: solid 1px var(--color-seda1);
	padding: 0 30px 0 0;
	margin: 56px 30px 56px 0 ;

}
.user-stat p{
	font-size: 12px;
	color: var(--color-seda2);

}
.user-stat span{
	font-size: 17px;
	color: var(--color-seda3);
}
/*.exp::before {
	content: "Expirácia ";
}*/




ul#menu {
	float:right;

}

ul#menu > li{
	float:left;
	list-style-type:none;
	position:relative;

}

#menu p{
	font-size: 12px;
	color: var(--color-seda2);
	width: 100%;

}
#menu span{
	font-size: 17px;
	color: var(--color-seda3);
}

#menu label{
	position:relative;
	display:block;
	transition:background 0.3s;
	cursor:pointer;
	padding: 56px 30px 56px 0 ;
}

#menu label:after{
	content:"";
	position:absolute;
	display:block;
	top:50%;
	right:-15px;
	width:0;
	height:0;
	border-top:10px solid var(--color-green);
	border-bottom:0 solid var(--color-green);
	border-left:10px solid transparent;
	border-right:10px solid transparent;
	transition:border-bottom .1s, border-top .1s .1s;
	padding: 56px 0;
}

#menu label:hover,
input:checked ~ label{/*background:rgba(0,0,0,.3);*/}

input:checked ~ label:after{

}


#menu input{display:none}


#menu input:checked ~ ul.submenu{
	max-height:600px;
	transition:max-height 0.5s ease-in;
}


ul.submenu{
	/*max-height:0;*/
	padding:0;
	overflow:hidden;
	list-style-type:none;
	background:#fff;
	transition:max-height 0.5s ease-out;
	/*position:absolute;*/
	float: right;
	right: -17px;
	top: 130px;
	min-width:100%;
	/*border-radius: 10px;*/
	/*box-shadow: 0px 0px 15px -5px rgba(0,0,0,0.35);*/

}

ul.submenu li a{
	display:block;
	padding:10px 30px;
	color: var(--color-seda3);
	text-decoration:none;
	white-space:nowrap;
	font-size: 13px;
	font-weight: bold;
	transition: 0.4s;
}

ul.submenu li:first-child{
	padding: 20px 0 0 0;
}


ul.submenu li a:hover{
	color: var(--color-orange);
}

.submenu p{
	border-top: solid 1px var(--color-seda1);
	font-size: 12px;
	color: var(--color-seda2);
	padding: 20px 30px;
	float: left;
	margin: 20px 0 5px 0;
	width: calc(100% - 60px);
}


.header {
	background-color: #fff;
	position: fixed;
	width: 100%;
	height: 150px;
	z-index: 9999;
	border-bottom: 2px solid var(--color-red);
}
.header img{
	width: 180px;
	height: 93px;
	padding: 20px 0 0 0;
}

.header .menu {
	margin: 0;
	padding: 0;
	list-style: none;
	background-color: #fff;
	clear: none;
	float: left;
	max-height: none;
}

.header .menu-btn:hover {

}

.header .logo {
	display: block;
	float: left;
	font-size: 2em;
	padding: 10px 20px;
	text-decoration: none;
}

.header .menu-icon {
	display: none;
}

.header .menu-icon .navicon {
	background: var(--color-seda3);
	display: block;
	height: 2px;
	position: relative;
	transition: background .2s ease-out;
	width: 18px;
}

.header .menu-icon .navicon:before,
.header .menu-icon .navicon:after {
	background: var(--color-seda3);
	content: '';
	display: block;
	height: 100%;
	position: absolute;
	transition: all .2s ease-out;
	width: 100%;
}

.header .menu-icon .navicon:before {
	top: 5px;
}

.header .menu-icon .navicon:after {
	top: -5px;
}

.header .menu-btn {
	display: none;
}

.header .menu-btn:checked ~ .menu {
	max-height: 800px;
}

.header .menu-btn:checked ~ .menu-icon .navicon {
	background: transparent;
}

.header .menu-btn:checked ~ .menu-icon .navicon:before {
	transform: rotate(-45deg);
}

.header .menu-btn:checked ~ .menu-icon .navicon:after {
	transform: rotate(45deg);
}

.header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before,
.header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {
	top: 0;
}

nav ul {
	background: #ddd;
	font-size: 0;
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: center;
	width: 100%;
}
nav li {
	margin: 0;
	padding: 0;
	position: relative;
	float:left;
}
nav a {
	display: block;
	color: var(--color-seda2);
	font: bold 15px/50px 'Prometo', sans-serif; 
	padding: 50px 20px;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-ms-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
nav a:after{
	content: '';
	position: relative;
	display: block;
	height: 0px;
	width: 100%;
	bottom: 0.5em;
	z-index: 9;
	background: transparent;
	transition: 0.4s;
}
nav a:hover:after{
	content: '';
	position: relative;
	display: block;
	height: 5px;
	width: 100%;
	bottom: 0.5em;
	z-index: 9;
	background: var(--color-green);
	color: var(--color-red);
}



nav .dropdown:after {
	content: ' \25bc';
}
nav li:hover a {
	color: var(--color-red);
	padding: 45px 20px;
}
nav li ul {
	left: 0;
	opacity: 0;
	position: absolute;
	top: 35px;
	visibility: hidden;
	z-index: 999;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-ms-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
nav li:hover ul {
	opacity: 1;
	top: 50px;
	visibility: visible;
	z-index: 999;
}
nav li ul li {
	width: 100%;
}
nav li ul a:hover {
	background: #bbb;
}
nav span {
	background: var(--color-red);
	position: absolute;
	right: 4px;
	margin: 7px 0 0 0;
	padding: 1px 6px;
	border-radius: 20px;
	color: var(--color-white);
	line-height: 17px;
	font-size: 13px;
}
#dropmenu {
	width: 300px;
	margin: 20px 0 0 0;
}
#dropmenu a{
	text-align:left;
}






main {
	margin:auto;
	width: 70%;
	padding: 170px 0 0 0;
}
.grey-btn, .green-btn, .blue-btn, .orange-btn{
	background: var(--color-seda2);
	float: left;
	text-transform: uppercase;
	/*border-radius: 8px;*/
	line-height: 36px;
	text-align: center;
	color: #fff;
	font-size: 13px;
	padding: 0 20px;
	transition: 0.4s;
	margin: 2px;
}
.grey-btn {
	background: var(--color-seda2);
}
.grey-btn:hover {
	opacity: 0.8;
}
.grey-btn img {
	width: 10px;
	height: 10px;
	margin: 0 10px 0 0;
}
.green-btn {
	background: var(--color-green);
}
.green-btn:hover {
	opacity: 0.8;
}
.blue-btn {
	background: var(--color-blue);
}
.blue-btn:hover {
	opacity: 0.8;
}
.orange-btn {
	background: var(--color-orange);
}
.orange-btn:hover {
	opacity: 0.8;
}

.fl-rg {
	float: right !important;
}

.fl-lf {
	float: left !important;
}

table.main-table {
	background-color: #fff;
	width: 100%;
	text-align: left;
	border-collapse: collapse;
	/*border-radius: 20px;*/
	margin: 30px 0;
	float: left;

}
table.main-table td, table.main-table th {
	padding: 10px 30px;
}

table.main-table tbody td {
	font-size: 12px;
}
table.main-table tr:nth-child(even) {
	background: #fff1f1;
}
table.main-table thead {
	border-bottom: 1px solid var(--color-seda1);
}
table.main-table thead th {
	font-size: 15px;
	font-weight: normal;
	color: var(--color-seda2);
	text-align: left;
	padding: 30px;
}

table.small-table {
	background-color: #fff;
	width: 100%;
	text-align: left;
	border-collapse: collapse;
	float: left;
	border-top: 1px solid var(--color-seda1);
	margin: 10px 0 0 0;

}
table.small-table td, table.main-table th {
	padding: 10px 30px;
}

table.small-table tbody td {
	font-size: 12px;
	text-align: center;
}
table.small-table thead {

}
table.small-table thead th {
	font-size: 15px;
	font-weight: normal;
	color: var(--color-seda2);
	padding: 30px;
	text-align: center;

}
table.small-table tfoot {
	border-top: 1px solid var(--color-seda1);
}

.paging {
	width: 100%;
	text-align: center;
	float: left;
	margin: 5px 0 15px 0;
}
.paging a{
	color: var(--color-seda2);
	padding: 10px;
	margin: 0 3px;
	transition: 0.4s;
}
.paging a:first-child, .paging a:last-child {
	font-size: 20px;
}
.paging a:hover{
	color: var(--color-seda3);
}
.pag-actv {
	color: var(--color-seda3) !important;
}

.w40{
	float:left;
	width: 38%;
	margin: 0 2% 0 0;
}
.w50{
	float:left;
	width: 48%;
	margin: 0 2% 0 0;
}
.w50raw{
	float:left;
	width: 50%;
}
.w60{
	float:left;
	width: 58%;
	margin: 0 0 0 2%;
}
.w100{
	float:left;
	width: 100%;
}
.w100mr{
	float:left;
	width: 98%;
	margin: 0 2% 0 0;
}
.w100mr30pxall{
	float:left;
	width: calc(100% - 60px);
	margin: 30px;
}
.wh-bg-rc{
	background: #fff;
	/*border-radius: 20px;*/
	padding: 15px 0;
	margin-bottom: 15px;
}
.padding-30 {
	padding: 30px;
}


.search {
	width: 30%;
	margin: 12px 25px 0 0;
	height: 42px;
	float: right;
}

.searchTerm {
	width: 48%;
	border: 1px solid var(--color-seda1);
	border-right: none;
	padding: 10px;
	height: 20px;
	/*border-radius: 8px 0 0 8px;*/
	outline: none;
	color: var(--color-seda2);
	float: right;
	display: inline-block;
}

.searchTerm:focus{
	color: var(--color-seda3);
	border: 1px solid var(--color-seda1);
	border-right: none;
}
.searchButton {
	width: 40px;
	height: 42px;
	border: 1px solid var(--color-seda1);
	border-left: none;
	background: #fff;
	text-align: center;
	color: #fff;
	/*border-radius: 0 8px 8px 0;*/
	cursor: pointer;
	float: right;
	display: inline-block;

}
.searchButton img{
	width: 12px;
	height: 12px;
	padding: 14px;
}

.accordion {
}

.toggle {
	display: none;
}

.option {
	position: relative;
	border-bottom: solid 1px var(--color-seda1);
}

.title,
.content {
	backface-visibility: hidden;
	transform: translateZ(0);
	transition: all 0.2s;
}

.title {
	padding: 30px 30px 10px 50px;
	display: block;
	color: var(--color-green);
	font-weight: bold;
	font-size: 19px;
}

.title:after, .title:before {
	content: "";
	position: absolute;
	left: 20px;
	top: 34px;
	width: 2px;
	height: 0.75em;
	background-color: var(--color-green);
	transition: all 0.2s;
}

.title:after {
	transform: rotate(90deg);
}
.title:hover {
	cursor: pointer;
}

.content {
	max-height: 0;
	overflow: hidden;
	margin: 0 0 20px 0;
}
.content p {
	margin: 0;
	padding: 0.5em 1em 1em;
	font-size: 13px;
	line-height: 1.5;
}

.toggle:checked + .title, .toggle:checked + .title + .content {
	/*box-shadow: 3px 3px 6px #ddd, -3px 3px 6px #ddd;*/
}
.toggle:checked + .title + .content {
	max-height: 900px;
}
.toggle:checked + .title:before {
	transform: rotate(90deg) !important;
}

.select-style {
	position: relative;
	display: inline-block;
	margin-bottom: 35px;
}
.select-style:before {
	content: "";
	display: inline-block;
	position: absolute;
	top: 50%;
	margin-top: -1.5px;
	right: 10px;
	width: 0;
	height: 0;
	border: 5px solid transparent;
	border-top-color: var(--color-green);
}
.select-style select {
	color: var(--color-seda3);
	display: inline-block;
	position: relative;
	box-shadow: none;
	appearance: none;
	-webkit-appearance: none;
	padding: 7px 30px 7px 13px;
	border: 1px solid var(--color-seda1);
	/*border-radius: 8px;*/
	background: transparent;
	font-family: 'Prometo', sans-serif;
}
.select-style select:hover {
	cursor: pointer;
}
.select-style select:focus {
	outline: transparent;
}
.select-style select:-moz-focusring {
	color: transparent;
	text-shadow: 0 0 0 #000;
}
select.filter-users-select {
	min-width: 250px;
}

.footer-cards {
	display: block;
	/*position: absolute;*/
	bottom: 5px;
	right: 5px;
	width: 100%;
	float: left;
	text-align: right;
}
.footer-cards img{
	margin: 8px;
	float: right;
}
.footer-cards a{
	float: right;
	/*width: calc(100% - 26px);*/
	margin: 4px 8px;
	line-height: 38px;
}

.produkt {
	text-align: center;
	padding: 30px;
	width: calc(20% - 60px);
	float: left;
	position: relative;
	margin: 0 0 50px 0;
}
.produkt img{
	width: 80%;
	height: auto;
}
.produkt h4{
	font-size: 18px !important;
	padding: 20px 15px 40px 15px !important;
}
.produkt .green-btn{
	float: none;
	font-size: 18px;
	position: absolute;
	bottom: 0;
	width: calc(100% - 100px);
	line-height: 20px;
	padding: 10px 20px;
}




.stadium-bg{
	background: url("images/STADION-AS-final.png") no-repeat center center fixed;
	-webkit-background-size: cover;
 	 -moz-background-size: cover;
 	 -o-background-size: cover;
 	 background-size: cover;
	
}
.red-bg{
	background: var(--color-red);
	color: var(--color-white);
}
.red-bg h1{
	color: var(--color-white);
}

.red-opacity-bg50{
	background: url("images/stadium-left-bg.jpg") no-repeat right  ;
	-webkit-background-size: cover;
 	 -moz-background-size: cover;
 	 -o-background-size: cover;
 	 background-size: cover;
	
	/*background-color: rgba(186, 0, 32, 0.8); */
  position: fixed;
  height: 100%;
	float: left;
	color: var(--color-white);
} 
.red-opacity-bg50 a{
	color: var(--color-white);
} 


.red-opacity-bg50-slave{
  background: url("images/stadium-right-bg.jpg") no-repeat left ;
	-webkit-background-size: cover;
 	 -moz-background-size: cover;
 	 -o-background-size: cover;
 	 background-size: cover;
	
	height: 100%;
	float: left;
	position: fixed;
	margin: 0 0 0 50%;
	color: var(--color-red);
}  

.opacity-bg50{
  position: fixed;
  height: 100%;
	float: left;
} 

.log-reg-container{
  width: 400px;
	margin: 0;
	position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
	min-height: 450px;
}  

.log-reg-container p{
	font-size: 22px;
	margin: 30px 0;
}
.log-reg-container span{
	margin: 30px 0;
	display: block;
}

.log-reg-container h1{
	line-height: 0.9em;
}

.log-reg-container-img{
	width: 360px;
	height: auto;
}
.log-reg-text-box{
	min-height: 180px;
}

.border-grey-left{
	border-left: solid 2px var(--color-seda1); 
}

.bg-left-arrow{
	background: url("images/arrow-left.svg") no-repeat center right; 
}
.bg-right-arrow{
	background: url("images/arrow-right.svg") no-repeat center left;
}
.btn-tooltip {
	width: 20px;
	float: left;
	margin: 24px 0 0 0;
}
.tooltip {
	position: relative;
}
.tooltip:hover {
	cursor: pointer;
}
.tooltip span {
	visibility: hidden;
	width: 15em;
	background-color: var(--color-green-true);
	color: var(--color-white);
	text-align: left;
	padding: 5px 10px;
	position: absolute;
	z-index: 9;
	top: -1em;
	left:  100%;
	margin-left:1em;
	opacity: 0;
	transition: opacity 0.4s;
	white-space:normal;
	font-size: 12px;
}

.tooltip span::after {
	content: "";
	position: absolute;
	top: 1.5em;
	right: 100%;
	margin-top: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: transparent var(--color-green-true) transparent transparent;
}
.tooltip span::before {
	content: "X";
	position: absolute;
	top: -10px;
	right: -14px;
	margin-top: -5px;
	padding: 3px 7px;
	background-color: var(--color-green-true);
	border-radius: 14px;
}
.tooltip input {
	display:none;
}
.tooltip input:checked+span {
	visibility: visible;
	opacity: 1;
}

.btn-green {
	border: solid 2px var(--color-green-true);
	height: 44px;
	text-transform: uppercase;
	line-height: 44px;
	text-align: center;
	color: var(--color-green-true);
	background: transparent;
	padding: 0;
	transition: 0.4s;
	display: block;
	margin: 10px 12px;
}
.deleteRelation:hover{
	cursor: pointer;
}
.btn-red {
	border: solid 2px var(--color-red);
	height: 44px;
	text-transform: uppercase;
	line-height: 44px;
	text-align: center;
	color: var(--color-red);
	background: transparent;
	padding: 0 40px;
	transition: 0.4s;
	margin: 30px 0;
}
.btn-red:hover {
	background: var(--color-red);
	color: var(--color-white);
	cursor: pointer;
}
.btn-red-invrs {
	border: solid 2px var(--color-red);
	height: 44px;
	text-transform: uppercase;
	line-height: 44px;
	text-align: center;
	color: var(--color-white);
	background: var(--color-red);
	padding: 0 40px;
	transition: 0.4s;
	margin: 30px 0;
}
.btn-red-invrs:hover {
	background: transparent;
	color: var(--color-red);
	cursor: pointer;
}
.btn-white {
	border: solid 2px var(--color-white);
	height: 44px;
	text-transform: uppercase;
	line-height: 44px;
	text-align: center;
	color: var(--color-white);
	background: transparent;
	padding: 0 40px;
	transition: 0.4s;
	margin: 30px 0;
}
.btn-white:hover {
	background: var(--color-white);
	color: var(--color-red);
	cursor: pointer;
}
.btn-grey {
	border: solid 2px var(--color-seda2);
	height: 44px;
	text-transform: uppercase;
	line-height: 44px;
	text-align: center;
	color: var(--color-seda2);
	background: transparent;
	padding: 0 40px;
	transition: 0.4s;
	margin: 30px 0;
}
.btn-grey:hover {
	background: var(--color-seda2);
	color: var(--color-white);
	cursor: pointer;
}
.btn-grey50 {
	width: 50%;
	margin: 40px auto;
}

.inactv-btn {
	cursor: not-allowed !important ;
	opacity: 0.2;
}
.inactv-btn::before {
  content: "čoskoro";  
  display: inline-block;
  position: absolute; 
  background: var(--color-red); color: var(--color-white); padding: 0 35px;
  opacity:0; transition:0.4s; overflow:hidden;
  max-width: 50%; 
  pointer-events: none;
	margin: 0 ;
}
.inactv-btn:hover::before { 
	opacity:1;  
}

.btn-tooltip {
	width: 20px;
	float: left;
	margin: 24px 0 0 0;
}
.tooltip {
  position: relative;
}
.tooltip:hover {
	cursor: pointer;
}
.tooltip span {
  visibility: hidden;
  width: 15em;
  background-color: var(--color-green-true);
  color: var(--color-white);
  text-align: left;
  padding: 5px 10px;
  position: absolute;
  z-index: 9;
  top: -1em;
  left:  100%;
  margin-left:1em;
  opacity: 0;
  transition: opacity 0.4s;
	white-space:normal;
	font-size: 12px;
}
.tooltip span::after {
  content: "";
  position: absolute;
  top: 1.5em;
  right: 100%;
  margin-top: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent var(--color-green-true) transparent transparent;
}
.tooltip span::before {
  content: "X";
  position: absolute;
  top: -10px;
  right: -14px;
  margin-top: -5px;
	padding: 3px 7px;
	background-color: var(--color-green-true);
	border-radius: 14px;
}
.tooltip input {
  display:none;
}
.tooltip input:checked+span {
  visibility: visible;
  opacity: 1;
}

.flags-container{
	position: absolute;
  top: 40px;
  right: 40px;
	z-index: 999;
}
.flags-container img{
	margin: 0 10px;
}

.ver-hor-center-container{
  width: 400px;
	margin: 0;
	position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
	text-align: center;
} 
.ver-hor-center-container a{
  display: block;
	margin: 20px 0;
} 
.ver-hor-center-container h1{
  line-height: 1.2em;
	margin: 40px 0;
} 

.app-obchod-ikona{
  height: 30px;
	width: auto;
} 

.hor-center-mar-all{
	text-align: center;
	margin: auto;
	margin: 40px 2%;
	width: 96%;
}

.big-red-text{
	font-size: 35px;
	color: var(--color-red);
}
.big-red-text span{
	font-weight: bold;
	float: right;
} 

.match-container{
	width: 80%;
	margin: 20px 10%;
	text-align: center;
	float: left;
}
.match-container h2{
	width: 60% !important;
	float: left;
	padding: 0;
	line-height: 1.5em;
	margin: 10px 0;
}
.match-container h3{
	width: 60%;
	float: left;
	text-transform: uppercase;
	font-size: 14px;
}
.match-container h4{
	width: 60%;
	float: left;
	color: var(--color-red);
	text-transform: uppercase;
	font-size: 10px;
}
.match-container h5{
	width: 100%;
	float: left;
	color: var(--color-red);
	font-size: 16px;
	font-weight: normal;
	text-align: left;
	margin: 0 0 10px 0;
}
.match-container hr{
	border-top: solid 1px var(--color-seda1);
	margin-top: 0;
}
.match-container span{
	color: var(--color-red);
	float: right;
	font-weight: normal !important;
	font-size: 16px;
	line-height: 35px;
}
.match-container span::before {
	content: url("images/file-add-icon.svg");
	margin: 0 10px;
	width: 11px;
	display: inline-block;
}
.match-container .user-row-avatar{
	margin: 0 5px 0 0;
	width: 35px;
	padding-top: 35px;
}
.match-container-users{
	float: left;
	width: 60%;
	overflow: hidden;
	height: 35px;
}
.first-team{
	float: left;
	width: 20%;
	margin: 0 0 40px 0;
}
.second-team{
	float: right;
	width: 20%;
	margin: 0 0 40px 0;
}
.first-team img, .second-team img{
/*	width: 100%;*/
	height: auto;
	max-height: 85px;
}
.user-row{
  width: 90%;
	margin: 10px 5%;
	float: left;
}
.user-row-avatar{
  width: 55px;
  padding-top:55px;
  overflow:hidden;
  position:relative;
  border-radius:50%;
	float: left;
	margin: 0 30px 0 0;
}
.user-row-avatar img{
  position:absolute;
  top:50%;
  left:50%;
  min-width:100%;
  height:100%;
  transform:translate(-50%,-50%);
  transition: 1s ease;
}
.user-row h5{
	color: var(--color-seda3);
	font-size: 17px;
	float: left;
	line-height: 55px;
	font-weight: normal;
}
.user-row span{
	color: var(--color-red);
	float: right;
	line-height: 55px;
	font-weight: normal !important;
}
.user-row span::before {
	content: url("images/delete-user-icon.svg");
	margin: 0 10px;
}
.moji p{
	float: left;
	color: var(--color-seda2);
}
.moji hr{
	border-color: var(--color-seda1);
}
.moji img{
	width: 200px;
	float: left;
	margin: 10px 0;
}
.moji span{
	line-height: 75px;
}
.moji span::before {
	content: url("images/add-user-icon.svg");
	margin: 0 10px;
	width: 15px;
	display: inline-block;
}
.fanshop-box{
	background: url("images/fanshop-bg.png") no-repeat right bottom ;
	background-size: contain;
	height: 400px;
}
.fanshop-box img{
	margin: 10px 60px;
}
.fanshop-box-btn{
	margin: 40px 60px;
	width: 40%;
}

.red-box h2{
	color: var(--color-white);
	text-transform: uppercase;
	font-weight: bold;
	font-size: 38px;
	line-height: 1.2em;	
	margin: 40px 20px;
	width: calc(95% - 60px);
}
.ticket-box{
	background: url("images/ticket-bg.png") no-repeat right bottom ;
	background-size: contain;
	height: 160px;
	margin: 30px 0;
}
.red-box{
	background-color: var(--color-red);	
}
.white-box{
	background-color: var(--color-white);	
}
.match-box{
	height: 400px;
	background-color: var(--color-white);
	text-align: center;
}
.match-box .btn-red-invrs, .match-box .btn-red{
	margin: 10px 12px;
	display: block;
	padding: 0 20px;
}
.match-box h2{
	width: calc(100% - 60px);
}

.no-match-box img{
	margin: 30px 0;
}
.no-match-box h2{
	margin: 70px 0 0 0;
	width: calc(95% - 60px);
}
.hor-center-container{
  width: 40%;
	margin: 50px auto;
	text-align: center;
}
.hor-center-container ul{
	text-align: left;
	list-style: none;
}
.hor-center-container h2{
  	line-height: 1.3em;
	margin: 30px 0;
	padding: 0;
	width: 100%;
	}
.ok-ul, .x-ul{
	line-height: 2.1em;
	display: block;
	width: 100%;
}

.ok-ul li:before, .x-ul li:before{ 
content:''; 
display:inline-block; 
height:1em; 
width:1em; 
background-size:contain; 
background-repeat:no-repeat; 
padding-left: 26px; 
}
.ok-ul li:before{ 
background-image:url('images/ok-mark-icon.svg'); 
}
.x-ul li:before{ 
background-image:url('images/x-mark-icon.svg'); 
}
.x-ul li, .ok-ul li {
    padding-left: 40px;
    text-indent: -40px;
}
.overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  transition: opacity 500ms;
  visibility: hidden;
  opacity: 0;
	z-index: 99999;
}
.overlay:target {
  visibility: visible;
  opacity: 1;
}

.overlay2 {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  transition: opacity 500ms;
  visibility: visible;
  opacity: 1;
	display: block;
	z-index: 99999999;
}
overlay2:target {
  opacity: 0;
	visibility: hidden;
}

.popup {
  margin: 40px auto;
  /*padding: 20px;*/
  background: #fff;
  border-radius: 5px;
  width: 30%;
  position: relative;
  transition: all 5s ease-in-out;
	overflow: hidden;
}

.popup .close {
  position: absolute;
  top: 20px;
  right: 30px;
  transition: all 200ms;
  font-size: 30px;
  font-weight: bold;
  text-decoration: none;
  color: #333;
	z-index: 9999
}
.popup .close:hover {
  color: var(--color-red);
	cursor: pointer;
}
.popup-content {
  max-height: 30%;
  /*overflow: auto;*/
}
.popup-content img{
  width: calc(100% - 40px);
	height: auto;
	padding: 0;
	margin: 40px 20px;
}
.popup-content p{
  width: calc(100% - 40px);
	margin: 60px 20px 20px 20px;
	float: left;
	text-align: center;
}
.popup-content .btn-red{
 	display: inline-block;
	margin: 30px 10px 0 10px;
}
.popup-content .btn-grey{
	display: inline-block;
	margin: 30px 10px;
}

#popup2 .popup-content p{
  width: calc(100% - 40px);
	margin: 20px;
	float: left;
	text-align: center;
}
#popup2 .popup-content h2{
  width: calc(100% - 100px);
	margin: 20px 20px 0 20px;
	text-align: center;
	color: var(--color-red);
}


.txt-al-cntr{
	text-align: center;
}
.txt-al-left{
	text-align: left;
}
.txt-al-right{
	text-align: right;
}
.txt-line-h44 {
	line-height: 44px;
}

.pos-abs-botm-cntr {
	position: absolute;
	bottom: 0;
}

.btn-dropdown {
  z-index: 2;
	position: relative;
	display: block;
	transition: background 0.3s;
	cursor: pointer;
	padding: 56px 0;
}

.btn-dropdown span{
  font-size: 17px;
}
.btn-dropdown p{
  font-size: 12px;
	color: var(--color-seda2);
}

.btn-dropdown:after {
  content: ' ▼';
	color: var(--color-red);
}

.dropdown {
  display:inline-block;
	float: right;
}

.dropdown-overlay {
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
}

.dropdown-inner {
  background: #fff;
  position: absolute;
  opacity: 0;
  transition: opacity .3s, visibility .3s;
  visibility: hidden;
  z-index: 2;
	box-shadow: 0px 0px 15px -5px rgba(0,0,0,0.35);
	right: 35px;
	top: 130px;
}

.dropdown-open{
  visibility: hidden;
}

.dropdown-hover:hover .dropdown-inner,
.dropdown-open:checked ~ .dropdown-inner {
  opacity: 100;
  visibility: visible;
}

.dropdown-hover:hover .dropdown-overlay,
.dropdown-open:checked ~ .dropdown-overlay {
  display: block;
}

.h2-sides-lines {
  text-align: center;
	line-height: 0;
    padding: 0;
	width: 92%;
	margin: 60px 4%;
	position: relative;
}
.green-lines {
  border-bottom: 5px solid var(--color-green-true);
}
.red-lines {
  border-bottom: 5px solid var(--color-red);
}

.h2-sides-lines span{
  background: var(--color-white);
    padding: 0 5%;
}

.seats-table {
  width: 96%;
	margin: 30px 2%;
	position: relative;
	float: left;

}
.seats-table table{
  table-layout: fixed;
	
}

.seats-table td {
  width: auto;
  word-wrap: break-word;
}
.seats-table th {
  color: var(--color-red);
}

.seats-table span {
  visibility: hidden;
  width: auto;
  background-color: var(--color-red);
  color: #fff;
  text-align: center;
  border-radius: 5px;
  padding: 10px;
  position: absolute;
  z-index: 1;
	margin: 8px -25px;
}
.seats-table td:hover span{
  visibility: visible;
}

.seats-table input[type=checkbox] {
  position: absolute;
  opacity: 0;
	width: auto;
}
.seats-table input[type=checkbox]:checked + label {
  background: var(--color-green-true);
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand;
  animation-duration: 300ms;
  animation-fill-mode: both;
	color: var(--color-white);
}
.seats-table input[type=checkbox]:disabled + label {
  background: var(--color-red);
	color: var(--color-white);
  overflow: hidden;
}

.seats-table input[type=checkbox]:disabled + label:hover {
  box-shadow: none;
  cursor: not-allowed;
}


.no4sale input[type=checkbox]:disabled + label {
  background: #dddddd !important;
  text-indent: -9999px;
  overflow: hidden;
}
.no4sale input[type=checkbox]:disabled + label:after {
  content: "X";
  text-indent: 0;
  position: absolute;
  top: 4px;
  left: 50%;
  transform: translate(-50%, 0%);
	color: var(--color-red);
}
.no4sale input[type=checkbox]:disabled + label:hover {
  box-shadow: none;
  cursor: not-allowed;
}



.seats-table label {
  display: block;
  position: relative;
  width: 100%;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  line-height: 36px;
  padding: 4px 0;
  background: var(--color-seda1);
  border-radius: 5px;
  animation-duration: 300ms;
  animation-fill-mode: both;
	
}

.seats-table label:hover {
  cursor: pointer;
  box-shadow: 0 0 0px 2px var(--color-red);
	color: var(--color-red);
	background: var(--color-white);
}

@-webkit-keyframes rubberBand {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes rubberBand {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
.rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand;
}

.select-gender {
    padding: 15px 15px 15px 15px;
    color: var(--color-seda2);
    font-family: 'Prometo', sans-serif;
    font-size: 15px;
    float: left;
    display: block;
    position: relative;
    border-bottom: solid 1px #787878;
    border-top: none;
    border-left: none;
    margin-bottom: 20px;
    border-right: none;
    background: #ededed;
    height: 20px;
	width: calc(100% - 30px);
}
.select-gender label{
    float: left;
	padding: 0 2px 0 0;
}
.select-gender label:last-of-type {
	border-left: solid 1px var(--color-seda2);
	margin: 0 0 0 3px;
	padding: 0 0 0 8px;
}
input[type="radio"]{
	width: auto;
	margin: 3px;
}

.chosse-sector-map {
	float: left;
	margin: auto;
	width: 100%;
	text-align: center;
}
.chosse-sector-map svg{
	width: 90%;
	height: auto;
}

.ticket-summary-table{
	text-align: center;
	margin: 30px;
}
.ticket-summary-table span{
	padding: 10px 30px;
	border: solid 1px var(--color-seda3);
}
.ticket-summary-table input{
	margin-bottom: 0;
}


.ticket-summary-table .select-style{
	margin: 0;
}

.ticket-summary-table .seats-table{
	margin: 0;
}

.bold {
	font-weight: bold !important;
}

.ticket-summary h3{
	color: var(--color-red);
	font-size: 24px;
	font-weight: normal;
	margin: 0 30px 0 0;
}
.play-area{
	background: var(--color-seda1);
	line-height: 120px;
	text-align: center;
	margin: 30px 0;
	color: var(--color-seda2);
	font-size: 22px;
	
}


 #s {
	 width: 100%;
	 height: 100%;
	 white-space: nowrap;
	 overflow: hidden;
	 position: relative;
}
 #s #slides {
	 height: 100%;
	 transition: transform .7s ease-in-out;
	 transform: translate3d(0,0,0);
	 will-change: transform;
	 backface-visibility: hidden;
}
 #s .s-slide {
	 position: relative;
	 width: 100%;
	 height: 100%;
	 background-size: cover;
	 background-position: center;
	 display: inline-block;
}

 .nav-slider {
	 display: block;
	 position: absolute;
	 z-index: 10;
	 top: 0;
	 height: calc(100% - 115px);
	 width: auto;
	 max-width: 150px;
	 min-width: 45px;
	 font-size: 56px;
	 line-height: 0;
	 backface-visibility: hidden;
	 cursor: pointer;
	 transition: 0.3s ;
	 font-style: normal; 
	 font-weight: normal;
	 color: var(--color-red);
}
 .nav-slider.next {
	 right: 0;
	 text-align: right;
	 background: url("images/arrow-right.svg") no-repeat center;
	 background-size: 40px auto;
}
 .nav-slider.prev {
	 text-align: left;
	 background: url("images/arrow-left.svg") no-repeat center;
	 background-size: 40px auto;
}
 .nav-slider:before {
	 content: ' ';
	 display: block;
	 height: 50%;
	 line-height: 0;
	 backface-visibility: hidden;
}
 .nav-slider:hover {
	 color: var(--color-seda2);
}

.myticket {
	 width: 620px;
	 height: 391px;
	 background: url("images/myticket-bg.png") no-repeat center;
	 background-size: cover;
	float: left;
	margin: 5%;
	display: block;
}
article { 
	width: calc(100% - 80px);
	border-bottom: 1px solid var(--color-seda1);
	margin: 40px 40px 0 40px;
	display: inline-block;
} 
article p{ 
	float:left;
	margin: 0 0 40px 0;
}
article h2{ 
	padding: 0 ;
	width: 100%;
}
article h3{ 
	padding: 0 ;
	width: calc(50% - 18px);
	float: left;
	font-weight: normal;
}
article h3:last-of-type {
	text-align: right;
}
article svg{ 
	fill: var(--color-seda3);
	width: 12px;
	float: right;
	padding: 4px 0 0 20px;
}
article svg:hover{ 
	fill: var(--color-red);
}
.color-red { 
	color: var(--color-red)!important;
}
.color-red h2{ 
	color: var(--color-red)!important;
}
.tooltip2{display:inline;position:relative;}

.tooltip2:hover:after{
   background:var(--color-red);
   bottom:10px;
   color:#fff;
   content:attr(title);
   display:block;
   left:-10px;
   padding:5px 15px;
   position:absolute;
   white-space:nowrap;
   z-index:98;
	font-weight: normal;
	font-size: 12px;
	
  }
.tooltip2:hover:before{
    border:solid;
    border-color:var(--color-red) transparent;
    border-width:6px 6px 0 6px;
    bottom:5px;
    content:"";
    display:block;
    left: 24px;
    position:absolute;
    z-index:99
   }
.profile-edit-container{
	margin: 30px;
	width: calc(100% - 60px);
	position: relative;
}
.profile-edit-container .user-row-avatar{
	width: 120px;
	padding-top: 120px;
	margin-right: calc(100% - 120px);
	margin-bottom: 30px;
}
.edit-avatar {
	width: 30px;
	height: 30px;
	position: absolute;
	top: 75px;
	left: 100px;
	background: var(--color-seda1);
	text-align: center;
	border-radius: 20px;
	border: solid 1px var(--color-seda2);
}
.edit-avatar img{
	width: 15px;
	margin: 8px;
}
.last-trans-container{
	margin: 30px;
	width: calc(100% - 60px);
	position: relative;
	text-align: center;
}
.last-trans-container h2{
	width: 100%;
	padding: 0;
	line-height: 1.5em;
}
.last-trans-table{
	width: 100%;
	margin: 20px 0;
	float: left;
}
.last-trans-table th{
	font-weight: normal;
	border-bottom: solid 1px var(--color-seda1);
	padding: 20px 5px;
}
.last-trans-table td{
	padding: 10px 5px;
}
.fnt-colr-red {
	color: var(--color-red);
}
.fnt-colr-green {
	color: var(--color-green-true);
}

.ticket-price-table{
	width: calc(100% - 60px);
	margin: 30px;
	border-collapse: collapse;
}
.ticket-price-table td{
	padding: 5px 10px;
	text-align: center;
}
.ticket-price-table tr{
	border-bottom: solid 2px var(--color-white);
}
.ticket-price-table th{
	color: var(--color-seda2);
}
.table-green-row {
	background: #e6f6ed;
	color: #05a74e;
}
.table-green-row td {
	text-align: left;
}

.table-light-green-row {
	background: #e6f6ed;
	color: #00d561;
	text-align: left;
}

.table-light-green-row th{
	background: #00d561;
	color: var(--color-white);
	padding: 5px;
	text-align: left;
}
.table-light-green-row td{
	text-align: left;
}

.table-green-row th{
	background: #05a74e;
	color: var(--color-white);
	padding: 5px;
}

.table-blue-row {
	background: #e5eff5;
	color: #005b9b;
}
.table-blue-row td{
	text-align: left;
}
.table-blue-row th{
	background: #005b9b;
	color: var(--color-white);
	padding: 5px;
}

.table-grey-row {
	background: #f1f1f1;
	color: #787878;
}
.table-grey-row td{
	text-align: left;
}
.table-grey-row th{
	background: #787878;
	color: var(--color-white);
	padding: 5px;
}

.table-orange-row {
	background: #fdf8f3;
	color: #edb887;
}
.table-orange-row th{
	background: #edb887;
	color: var(--color-white);
	padding: 5px;
}
.ticket-price-table-link{
	margin: 28px 0 0 0;
}


.res-tab-container {
  font-size: 16px;
  line-height: 1.4;
  margin: 0;
	background: var(--color-white);
}
.res-tab-header {
  margin-bottom: 0.5em;
  text-align: left;
}

.res-tab-header > * {
  display: block;
}

table.res-tab-table {
  width: 100%;
  margin-bottom: 0.5em;
  font-size: 1em;
  border-collapse: collapse;
  border-spacing: 0;
}
table.res-tab-table tr {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  text-align: left;
}
table.res-tab-table thead {
  border-bottom: 1px solid var(--color-seda2);
}

table.res-tab-table tr.highlight {
  background-color: #dcf1f0 !important;
}
table.res-tab-table.zebra tr:nth-child(even) {
  background-color: #f8e5e9;
}
table.res-tab-table th {
  font-weight: bold;
  padding: 1.75em 0.75em;
  font-size: 0.9em;
}
table.res-tab-table td {
  padding: 0.75em;
  font-size: 0.9em;
}
table.res-tab-table .highlight td {
  font-weight: bold;
}

.simple-pagination ul {
    margin: 30px 0 ;
    padding: 0;
    list-style: none;
    text-align: center;
}
.simple-pagination li {
	display: inline-block;
	margin-right: 5px;
}
.simple-pagination li a, .simple-pagination li span {
    padding: 5px 10px;
    text-decoration: none;
	color: var(--color-seda3);
	font-weight: normal;
}
.simple-pagination .prev.current, .simple-pagination .next.current {
    color: var(--color-seda1);
}
.simple-pagination .current {
	font-weight: bold;
	color: var(--color-red);
}

.res-tab-filter-container {
	margin: 30px 30px 0 30px;
	float: left;
	width: calc(100% - 60px)
}

.res-tab-filter-container input[type=date]{
	border: solid 1px var(--color-seda2);
	background: var(--color-white);
	width: calc(100% - 30px);
	display: block;
	padding: 13px 15px;
}

.res-tab-filter-container select{
	border: solid 1px var(--color-seda2);
	background: var(--color-white);
	width: calc(100% - 30px);
	display: block;
	margin: 30px 0;
	padding: 14px 10px;
	cursor: pointer;
	font-family: 'Prometo', sans-serif;
}
.res-tab-filter-container select option {
  background: var(--color-white);
  border: var(--color-seda1);
}
.res-tab-filter-container select:hover {
  background-color: var(--color-white);
}

.mrgn30-0 {
	margin: 30px 0;
}
.mrgn10-0 {
	margin: 10px 0;
}

.charge-cred .btn-red{
	padding: 0 30px;
}



@media (max-width: 1730px) {
	.user-stats {
		width: 100%;
		min-width: 0;
		border-bottom: solid 1px var(--color-seda1);
		padding: 0 35px 0 0;
	}
	.user-stat {
		float: right;
		border-right: solid 1px var(--color-seda1);
		padding: 15px 30px ;
		margin: 0;
		width: calc(25% - 65px)
	}

	#menu {
		width: calc(50% - 30px);
	}
	#menu label {
		padding: 15px 30px;
	}
	ul.submenu {
		top: 62px;
		z-index: 9999999;
	}
	ul#menu > li {
		float: right;
	}
	nav a {
		padding: 15px 20px;
	}
	nav li:hover a {
		color: var(--color-seda3);
		padding: 11px 20px;
	}
	.header img {
		width: 97px;
		height: 60px;
		padding: 0;
	}
	.popup-content img{
  width: calc(100% - 40px);
	height: auto;
	padding: 0;
	margin: 40px 20px;
	}
	.popup {
    width: 50%;
	}
	.btn-dropdown {
    padding: 15px 0px;
		float: right;
	}
	.dropdown-open {
    visibility: hidden;
		position: absolute;
		top: 0;
	}
	.dropdown {
    width: calc(50% - 15px);
	}
	.dropdown-inner {
    right: 20px;
    top: 60px;
	}
}


@media (max-width: 1400px) {
	main {
		width: 95%;
	}
	.popup {
    width: 60%;
	}
	nav a {
    font: bold 13px/50px 'Prometo', sans-serif;
	}
}
@media(max-width: 1100px)
{
	.btn-red{
		padding: 0;
	}
	.btn-green{
		padding: 0;
	}
}
@media (max-width: 1200px) {
	.btn-green{
		padding: 0;
	}
	.btn-red{
		padding: 0;
	}
}

@media (max-width: 1000px) {
	h1 {
    font-size: 35px;
    line-height: 1.3em;
    margin: 70px 0 30px 0;
	}
	h2 {
    font-size: 25px;
    line-height: 1.3em;
	margin: 30px 0 ;
		padding: 0 0 0 30px;
		width: calc(100% - 30px)
	}
	.header .menu {
		clear: both;
		max-height: 0;
		transition: max-height .2s ease-out;
		overflow: hidden;
	}
	.header .menu-icon {
		cursor: pointer;
		display: inline-block;
		float: right;
		padding: 20px 5px 12px 20px;
		position: relative;
		user-select: none;
		margin: 15px;
		text-align: center;
	}
	.menu-icon p{
		font-size: 12px;
		color: var(--color-green);
		margin: 14px 10px 0 0;
		font-weight: bold;
		position: relative;
		right: 7px;

	}
	.menu {
		width: 100%;
	}
	nav li ul {
		position: relative;
		opacity: 1;
		visibility: visible;
		top: 0;
		-webkit-transition: none;
		-moz-transition: none;
		-ms-transition: none;
		-o-transition: none;
		transition: none;
	}
	nav li:hover ul {
		opacity: 1;
		top: 0;
		visibility: visible;
	}
	nav li {
		width: 100%;
	}
	#dropmenu {
		width: 100%;
		margin: 0;
	}
	#dropmenu a{
		text-align:center;
		padding: 0 0 0 50px;
	}
	nav a {
		padding: 20px 20px;
	}
	nav li:hover a {
		color: var(--color-seda3);
		padding: 20px 20px;
	}
	nav span {
	position: relative;
	right: 2px;
	bottom: 6px;
	padding: 1px 5px;
	border-radius: 20px;
	line-height: 17px;
	font-size: 11px;
	}
	.header {
		height: auto;
	}
	.header img {
		width: 77px;
		height: 60px;
		padding: 5px 0 0 5px;
	}
	.exp::before {
		content: "";
	}

	.user-stat  {
		width: 20%;
		padding: 15px 10px ;
	}
	#menu {
		width: calc(60% - 80px);
	}
	#menu label {
		padding: 15px 30px 15px 0;
	}
	table.main-table thead th, table.small-table thead th {
		padding: 30px 15px;
	}
	table.main-table td, table.main-table th, table.small-table td, table.small-table th {
		padding: 10px 15px;
	}
	.w40{
		float:left;
		width: 98%;
		margin: 15px 1%;
	}
	.w50{
		float:left;
		width: 98%;
		margin: 0 1%;
	}
	.w60{
		float:left;
		width: 98%;
		margin: 15px 1%;
	}
	.produkt {
		width: calc(50% - 60px);
	}
	
	.w50raw {
    width: 100%;
	}
	.red-opacity-bg50 {
    position: relative;
    height: auto;
    float: left;
		display: block;
		background: var(--color-red);
	}
	
	.red-opacity-bg50-slave {
    position: relative;
    height: auto;
    float: left;
		display: block;		
		margin: auto;
		background: none;
	}
	
	.log-reg-container {
    width: calc(100% - 60px);
    margin: 30px;
    position: relative;
	display: block;
		float: left;
		text-align: center;
	-ms-transform: none;
	transform: none;
		top: auto;
		left: auto;
		min-height: auto;
	}
	.flags-container {
    top: 15px;
    right: 15px;
	}
	.flags-container img{
    width: 20px;
	}
	.opacity-bg50 {
    position: relative;
    height: auto;
    float: left;
	}
	.bg-left-arrow {
    background: none;
	}
	
	.bg-right-arrow {
    background: none;
	}
	
	.border-grey-left {
    border-left: none;
		border-top: solid 2px var(--color-seda1);
	}
	
	.log-reg-container-img {
    width: 200px;
	margin: 0 calc(50% - 100px);
	}
	.btn-white, .btn-red, .btn-red-invrs, .btn-grey {
    width: 60%;
	margin: 30px auto;
	height: auto;
	}
	.fanshop-box-btn{
	float: left;
	margin: 40px 0 0 60px;
	}
	.red-box h2 {
    font-size: 30px;
    margin: 40px 20px;
	width: calc(100% - 100px);
	}
	.ticket-box {
		height: auto;
		margin: 30px 1%;
	}
	.ticket-box h2{
		width: 60% !important;
		font-size: 20px !important;
	}
	.match-box {
		margin: 30px 1%;
		height: auto;
	}
	.btn-green{
		width: calc(100% - 68px);
		margin: 10px 12px;
		display: block;
		padding: 0 20px;
	}
	.footer-cards {
		position: relative;
		float: left;
		width: 98%;
		margin: 0 1%;
	}
	.fanshop-box img {
    margin: 10px 100px 10px 60px;
	}
	
	.hor-center-container{
  	width: 90%;
	}
	.popup {
    width: 70%;
	}
	.popup-content img{
  	width: calc(100% - 40px);
	height: auto;
	padding: 0;
	margin: 40px 20px;
	}
	.log-reg-text-box {
    min-height: auto;
	}
	.pos-abs-botm-cntr {
    position: relative;
    bottom: 0;
    left: 0;
	}
	
	.match-box .btn-red-invrs, .match-box .btn-red {
    width: calc(100% - 68px);
	}
	.btn-tooltip {
		position: absolute;
		bottom: 100px;
		left:  80px;
		width: 30px;
	}
	form .w50 {
	width: 100%;
	margin: 0;
	}
	.ticket-price-table-link{
	margin: 0 35px 35px 35px;
	width: calc(100% - 70px);
	}
	.res-tab-filter-container select{
	margin: 5px 0;
	width: calc(100% - 10px);
	}
	.charge-cred p{
	text-align: center;
	}
	.charge-cred .btn-red{
	margin: 0 auto 20px auto;
	}
}


@media (max-width: 800px) {

	.h2-sides-lines span {
    font-size: 15px;
	}
	.h2-sides-lines {
		margin: 30px 4%;
	}
	.green-lines {
    border-bottom: 2px solid var(--color-green-true);
	}
	.red-lines {
    border-bottom: 2px solid var(--color-red);
	}
	/*
	.no4sale input[type=checkbox]:disabled + label:after {
	  top: 20px;
	}
	*/
	.myticket {
		width: 90%;
	 height: auto;
	}
	.res-tab-container {
    max-width: 800px;
    margin: 0 auto;
  }
  table.res-tab-table {
    width: 100%;
  }
  table.res-tab-table tr.hide-mobile,
  table.res-tab-table th.hide-mobile,
  table.res-tab-table td.hide-mobile {
    display: none;
  }
  table.res-tab-table thead {
    display: none;
  }
  table.res-tab-table tbody {
    width: 100%;
  }
  table.res-tab-table tr,
  table.res-tab-table th,
  table.res-tab-table td {
    display: block;
    padding: 0;
  }
  table.res-tab-table tr {
    border-bottom: none;
    margin: 0 0 1em 0;
    padding: 0.5em;
  }
  table.res-tab-table tr.highlight {
    background-color: inherit !important;
  }
  table.res-tab-table.zebra tr:nth-child(even) {
    background-color: transparent;
  }
  table.res-tab-table.zebra td:nth-child(even) {
    background-color: #f8e5e9;
	  padding: 0.5em 0.5em 0.25em 0.5em;
  }
  table.res-tab-table tr:nth-child(even) {
    background-color: transparent;
  }
  table.res-tab-table td {
    padding: 0.5em 0.5em 0.25em 0.5em;
    border-bottom: 1px dotted #ccc;
    text-align: right;
  }
  table.res-tab-table td[data-title]:before {
    content: attr(data-title);
    font-weight: bold;
    display: inline-block;
    content: attr(data-title);
    float: left;
    margin-right: 0.5em;
    font-size: 0.95em;
  }
  table.res-tab-table td:last-child {
    padding-right: 0;
    border-bottom: 2px solid #ccc;
  }
  table.res-tab-table td:empty {
    display: none;
  }
  table.res-tab-table .highlight td {
    background-color: inherit;
    font-weight: normal;
  }
}

@media (max-width: 700px) {
	.dropdown {
    width: calc(100% - 10px);
	padding: 0 0 0 10px;
	border-bottom: solid 1px var(--color-seda1);
	}
	.btn-dropdown {
    float: left;
	}
	.dropdown-inner {
    left: 10px;
    top: 60px;
	}
	.user-stats {
    float: left;
    padding: 0;
	}
	.user-stat:last-child {
    border-right: solid 1px var(--color-seda1);
	}
	.user-stat {
    width: calc(50% - 22px);
    border: none;
        border-right-color: currentcolor;
        border-right-style: none;
        border-right-width: medium;
    padding: 10px;
	}
	.header .logo {
    padding: 5px 10px;
	}
	.header .menu-icon {
    margin: 5px;
	}
	
	.seats-table table {
	 border-spacing: 3px;
	}
	.seats-table label {
		font-size: 12px;
		line-height: 20px;
	}
	.seats-table td {
    	font-size: 12px;
	}
	.play-area {
    line-height: 70px;
    font-size: 16px;
	}
}



@media (max-width: 600px) {
	.loginbox {
		width: calc(100% - 50px);
		padding: 20px;
		margin: 5px;
		position: relative;
		overflow: hidden;
		top: auto;
		left: auto;
		transform: none;
	}
	.user-row h5 {
    line-height: 25px;
		width: calc(100% - 85px)
	}
	.user-row span {
    float: left;
    line-height: 25px;
		width: calc(100% - 85px)
	}
	.box{
    width: 70%;
  }
  .popup{
    width: 80%;
  }

.ticket-summary-table {
			display: block;
	text-align: left;
	margin: 20px 0;
		}
.ticket-summary-table table, .ticket-summary-table thead, .ticket-summary-table tbody, .ticket-summary-table th, .ticket-summary-table td, .ticket-summary-table tr {
			display: block;
		}

.ticket-summary-table thead tr {
			position: absolute;
			top: -9999px;
			left: -9999px;
		}

.ticket-summary-table tr {
      margin: 0 0 1rem 0;

    }
      
.ticket-summary-table tr:nth-child(odd) {
      background: #f7f7f7;
    }
    
.ticket-summary-table td {
			/* Behave  like a "row" */
			border: none;
			border-bottom: 1px solid #eee;
			position: relative;
			padding-left: 50%;
			height: 80px;
	vertical-align: middle;
		}

.ticket-summary-table td:before {
			position: absolute;
			top: 0;
			left: 6px;
			width: 45%;
			padding-right: 10px;
			white-space: nowrap;
			line-height: 80px;
		}
.ticket-summary-table td:nth-of-type(1):before { content: "Sedadlo"; }
.ticket-summary-table td:nth-of-type(2):before { content: "Typ permanentky"; }
.ticket-summary-table td:nth-of-type(3):before { content: "Číslo karty"; }
.ticket-summary-table td:nth-of-type(4):before { content: "Cena permanentky"; }

.ticket-summary-table .select-style {
    float: left;
	margin: 25px 0;
	width: calc(100% - 20px);
}
.ticket-summary-table .select-style select{
	width: 100%;
}
.ticket-summary-table input {
    float: left;
	margin: 12px 0;
	width: calc(100% - 50px);
}
.ticket-summary-table span {
      margin: 20px 0;
	float: left;
	padding: 10px 20px;
}
.ticket-summary-table label {
      margin: 25px 0;
	float: left;
	width: 70%;
}

	
}



@media (max-width: 480px) {
	.user-stats {
		float: left;
		padding: 0;
	}
	#menu {
		width: calc(100% - 10px);
		padding: 0 0 0 10px;
		border-bottom: solid 1px var(--color-seda1);
	}
	ul#menu > li {
		float: left;
	}
	.user-stat  {
		width: calc(50% - 22px);
		border:none;
		padding: 10px
	}
	.user-stat:last-child  {
		border-right: solid 1px var(--color-seda1);
	}
	#menu label {
		padding: 10px 30px 10px 0;
	}
	.header .menu-icon {
		margin: 5px;
	}
	.header img {
		width: 50px;
		height: 39px;
		padding: 10px 0 0 5px;
	}
	.header .logo {
		padding: 5px 10px;
	}
	.search {
		width: 100%;
	}
	.searchTerm {
		width: calc(100% - 110px);
	}
	h1 {
		font-size: 35px;
		line-height: 1.3em;
		margin: 70px 0 30px 0;
	}
	.produkt {
		width: calc(100% - 60px);
	}
	.ver-hor-center-container {
    width: 94%;
    margin: 50px 3%;
    position: relative;
    top: auto;
    left: auto;
    -ms-transform: none;
    transform: none;
	}
	.btn-red, .btn-red-invrs, .btn-white, .btn-grey{
    width: calc(100% - 50px);
	font-size: 12px;
	padding: 0 20px;
	}
	.match-container h2{
	font-size: 15px;
		margin: 0;
	}
	.match-container h3{
	font-size: 10px;
	}
	.match-container h4{
	font-size: 8px;
	margin-bottom: 5px;
	}
	.first-team img, .second-team img {
	width: 80%;
	}
	.no-match-box h2 {
    line-height: 1.2em;
	}
	.fanshop-box  {
    background-size: auto 300px;
	}
	.fanshop-box-btn{
	float:none;
	width: calc(100% - 100px);
		margin: 50px auto;
	}
	.red-box h2 {
    margin: 40px 0px;
	}
	.fanshop-box img {
    margin: 10px 30px;
	}
	.ticket-box {
		background: none;
		background-color: var(--color-red); 
		
	}
	.ticket-box h2{
		width: calc(100% - 60px)!important;
	}
	.popup{
    width: 90%;
  	}
	.seats-table label {
		font-size: 9px;
		line-height: 16px;
	}
	.seats-table th {
		font-size: 9px;
		line-height: 16px;
	}
	.seats-table td {
    	font-size: 9px;
	}
	.play-area {
    line-height: 50px;
    font-size: 12px;
	}
	.btn-white, .btn-red, .btn-red-invrs, .btn-grey {
	margin: 10px auto;
	}
	.match-box .btn-red-invrs, .match-box .btn-red {
    width: calc(100% - 68px);
	}
	.match-container-users {
    width: 50%;
	}
	.btn-tooltip {
    bottom: 110px;
    left: 40px;
    width: 25px;
	}
	.tooltip span {
	width: 13em;
	}
	article { 
	width: calc(100% - 40px);
	margin: 20px 20px 0 20px;
	} 
	article p{ 
		margin: 0 0 20px 0;
	}
	.popup-content .btn-red{
 	width: calc(100% - 80px);
	}
	.popup-content .btn-grey{
	width: calc(100% - 80px);
	}
	
	.ticket-price-table {
			display: block;
	text-align: left;
	margin: 20px 5px;
		width: calc(100% - 10px);
		}
	.ticket-price-table table, .ticket-price-table thead, .ticket-price-table tbody, .ticket-price-table th, .ticket-price-table td, .ticket-price-table tr {
			display: block;
		}

	.ticket-price-table thead tr {
			position: absolute;
			top: -9999px;
			left: -9999px;
		}

	.ticket-price-table tr {
      margin: 0 0 1rem 0;

    }
      
	/*.ticket-price-table tr:nth-child(odd) {
      background: #f7f7f7;
    }*/
    
	.ticket-price-table td {
			/* Behave  like a "row" */
			border: none;
			border-bottom: 1px solid var(--color-white);
			position: relative;
			padding-left: 50%;
			height: 50px;
	vertical-align: middle;
		}

	.ticket-price-table td:before {
			position: absolute;
			top: 0;
			left: 6px;
			width: 45%;
			padding-right: 10px;
			line-height: 1.2em;
		}
	.ticket-price-table td:nth-of-type(1):before { content: "Kategória"; margin: 8px 0; }
	.ticket-price-table td:nth-of-type(2):before { content: "Cena"; margin: 8px 0;}
	.ticket-price-table td:nth-of-type(3):before { content: "Deti 6 - 15 rokov Seniori nad 70 rokov Doprovod ŤZP-S"; }
	.ticket-price-table td:nth-of-type(4):before { content: "Deti 0 - 6 rokov ŤZP-S";  margin: 8px 0;}

	
}

@media (max-height: 800px) and (max-aspect-ratio: 1/1) {
	header {
		position: absolute !important;
		z-index: 999 !important;
	}
	header img {
		position: absolute;
	}
	
	
}


@media (max-height: 900px) {
	.loginbox {
		position: relative;
		overflow: hidden;
		top: 15px;
		left: auto;
		transform: none;
		margin: auto;
	}
	.footer-cards {
		position: relative;
		float: right;
		/*margin: 40px 0 0 0;*/
		width: 100%;
		text-align: right;
	}
}

@media (max-height: 600px)  {
	.ver-hor-center-container {
    width: 94%;
    margin: 50px 3%;
    position: relative;
    top: auto;
    left: auto;
    -ms-transform: none;
    transform: none;
	}
	.btn-white, .btn-red, .btn-red-invrs, .btn-grey {
    width: 60%;
	margin: 30px auto;
	height: auto;
	}
	.fanshop-box-btn {
    margin: 40px 0 0 60px;
	}
	.popup {
    margin: 10px auto;
	height: 92vh;
	}
	.popup-content {
    height: auto;
		text-align: center;
	}
	.popup-content img {
    width: auto;
    height: 80vh;
		margin: 20px;
	}
		
}

@media (max-height: 300px) and (max-aspect-ratio: 1/1) {
	.popup {
    margin: 10px auto;
	height: 92vh;
	}
	.popup-content {
    height: auto;
		text-align: center;
	}
	.popup-content img {
    width: auto;
    height: 80vh;
		margin: 20px;
	}
}

.input-container input[type='checkbox'] {
	float: left;
	margin: 3px 10px;
	padding: 0;
	width: 20px;
}

#auto-logout-time {
	position: fixed;
	right: 10px;
	bottom: 50px;
	width: 12%;
	z-index: 1000;
	text-align: center;
	line-height: 50px;
	background-color: rgba(128,128,128,50);
	display: none;
}

.flex{
	display: flex;
	flex-wrap: wrap;
}


.text-center {
	text-align: center;
}

.text-left {
	text-align: left;
}

.text-right {
	text-align: right;
}

.select2-results__options {
	width: 100%;
}