hr {
  height:0px;
  border:0px;
  border-bottom:dotted 1px #666;
}

select {
  width: 100%;
  height: 35px;
}

h1, h2{
  margin:0px;
}

/******************************************************************************************************
* KSI-module
*******************************************************************************************************/

.ksi-button
{
  background:var(--color-btn-action-bg);
  color:var(--color-btn-action-font);  
  transition:all 250ms ease;
  font-family:var(--default-font);  
  cursor:pointer;
  border-radius:var(--default-radius);
  padding:8px 25px;
  transition:all 300ms ease;
  display:inline-block
}

.ksi-button:hover{
  background:var(--color-btn-action-bg-hv);
  color:var(--color-btn-action-font-hv);  
}

.ksi-module-container:before{
  all:unset;
}

.ksi-module-container{
}


.ksi-module-container input{
  box-sizing:border-box;
}

.ksi-module-container select{
  box-sizing:border-box;
}

.ksi-module-container textarea{
  box-sizing:border-box;
}

.ksi-module{
  font-weight:normal;
  width:100%;
  margin:auto;
  padding:0px;
  background:#fff;
}

.ksi-module div{
  box-sizing:border-box ;
}

.ksi-module span{
  box-sizing:border-box ;  
}

.ksi-module input{
  box-sizing:border-box ;
}

.ksi-module-title{
  font-weight: normal;  
  text-align:center;
  font-family: var(--default-font);
  font-size:34px;
  background-color:#333;
  color:#fff;
  line-height:1;  
  box-sizing: border-box;
  padding:35px;
  margin-bottom:30px;
  margin-top:1px;
}

.ksi-module-content{
  padding:var(--default-margin) 0px;
  color:#555;
  max-width:1300px;
  margin:auto;
}

.ksi-module-content h2{
  font-family: var(--default-font-3);
  font-size:25px;
  font-weight:bold;
  padding:0px;
  max-width:800px;
  margin:20px auto;
}

.ksi-module-content h3, .ksi-module-content h4, .ksi-module-content h5{
  font-family: var(--default-font-3);
  font-size:20px;
  padding:10px 0px;
  max-width:800px;
  margin:10px auto;
}


.ksi-module-content p, .ksi-module-content ul, .ksi-module-content ol{
  max-width:800px;
  margin:15px auto;
  line-height:1.5;
  color:#333;
  box-sizing: border-box;
}

@media screen and (max-width: 1330px) {
  .ksi-module-container{
    margin:0px var(--default-margin);
  }
  
  .ksi-module-title{
    margin-top:5px;
    border-radius:var(--default-radius);
    padding:25px;
  }  
}

@media screen and (max-width: 640px) {
  .ksi-module-container{
    padding-top:0px;
    padding-bottom:0px;
  }

  .ksi-module-title{
    font-size:22px;
    padding:15px;
  }

  .ksi-module-content h2{
    font-size:20px;
  }

  .ksi-module-content h3, .ksi-module-content h4, .ksi-module-content h5{
    font-size:18px;
  }

}

/******************************************************************************************************
* ???
*******************************************************************************************************/


.ksi-offer-desc-title{
  font-size:14px;
  padding:0px;
  margin:10px 0px 10px 0px;
  font-weight:bold;
  color:#414141;
}

.ksi-offer-desc{
  font-size:14px;
  padding:0px;
  margin:0px;
  color:#414141;
}


.dps{
  float:left;
  border: 1px solid #E5E5E5 !important;
}

.dpsYear{
  width:25%;
}

.dpsMonth{
  margin-left:10px;
  margin-right:10px;
  width:calc(55% - 20px);
}

.dpsDay{
  width:20%;
}

@media screen and (max-width: 575px) {

  .dpsYear{
    width:40%;
  }

  .dpsMonth{
    margin-left:0px;
    margin-right:0px;
    width:35%;
  }

  .dpsDay{
    width:25%;
  }

}


/* poppins-200 - latin-ext_latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: local(''),
       url('/skin/fonts/poppins-v20-latin-ext_latin-200.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/skin/fonts/poppins-v20-latin-ext_latin-200.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* poppins-regular - latin-ext_latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local(''),
       url('/skin/fonts/poppins-v20-latin-ext_latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/skin/fonts/poppins-v20-latin-ext_latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* poppins-500 - latin-ext_latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: local(''),
       url('/skin/fonts/poppins-v20-latin-ext_latin-500.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/skin/fonts/poppins-v20-latin-ext_latin-500.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* poppins-700 - latin-ext_latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: local(''),
       url('/skin/fonts/poppins-v20-latin-ext_latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/skin/fonts/poppins-v20-latin-ext_latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* poppins-900 - latin-ext_latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: local(''),
       url('/skin/fonts/poppins-v20-latin-ext_latin-900.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('/skin/fonts/poppins-v20-latin-ext_latin-900.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}


/************************************************************
  Global styles
************************************************************/
div{
  box-sizing: border-box;
}

html {
  scroll-behavior:smooth;
  transition: all 300ms ease;
}

body{
  margin:0px;
  padding:0px;
  border:0px;
  box-sizing: border-box;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  background:var(--color-main-background);
  font-family: var(--default-font);
  font-weight: 400;
  font-size: var(--font-size-defaut-text);
}

section{
  clear:both;
}

a{
  text-decoration: none;
}

.ui-clear,
.sk-clear{
  clear:both;
  width:100%;
  box-sizing:border-box;
  height:0px;
}

.ui-abs-center{
  position:absolute;
  top:50%;
  left:50%;
  transform: translateY(-50%) translateX(-50%);
}

/************************************************************
  Skin
************************************************************/

.sk-back{
  width:100%;
  float:left;
  box-sizing:border-box;
  background-image:url(/skin/img/login-bg.webp);
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;  
  min-height:calc(100vh - 77px - 100px - 7px);
  padding:30px 0px;
}

.sk-row{
  max-width: 1170px;
  margin: auto;
  box-sizing:border-box;
}

.sk-on-back{
  background:#ffffffBB;
  padding:30px;
  overflow:hidden;
  border-radius:var(--default-radius);
}


@media screen and (max-width: 1200px) {
  .sk-row{
    margin-left:var(--default-margin);
    margin-right:var(--default-margin);
  }  
}

@media screen and (max-width: 480px) {
  .sk-row{
    margin-left:var(--default-margin);
    margin-right:var(--default-margin);
  }  
  
  .sk-on-back{
    padding:var(--default-margin);
  }
}

@media all and ( max-width: 319px ){
  body{
    zoom:0.75;
  }
}

@media all and ( max-width: 239px ){
  body{
    zoom:0.5;    
  }
}

@media all and ( max-width: 160px ){
  body{
    zoom:0.25;
  }
}




/*
  ZMIENNE GLOBALNE CSS
*/

:root{
  --default-background: #ffffff;
  /* -- Colors -- */     
  --default-color-0:#ffffff;
  --default-color-1:#333333;
  --default-color-2:#781816;
  --default-color-3:#333333;
  --default-color-4:#ffffff;
  --default-color-5:#CCCCCC;
  --default-color-6:#1d8634;
  --default-color-7:#4c4c52;
  --default-color-8:#F5F5F5;
  --default-color-9:#EA5c6D;
  --default-color-A:#E1E1E1;
  --default-color-T1:#F0F0F0;
  --default-color-T2:#F9F9F9;
  --default-color-B:#9B3E84;
  
  --default-color:var(--default-color-1);
  --default-text-color-inv:var(--default-color-0);

  --color-btn-action-bg:var(--default-color-2);
  --color-btn-action-font:var(--default-color-0);
  
  --color-btn-action-bg-hv:var(--default-color-3);
  --color-btn-action-font-hv:var(--default-color-0);

  
  /* -- Font & sizes -- */  
  --default-font-size-mini:13px;
  --default-font-size-small:14px;
  --default-font-size:16px;
  --default-font-size-medium:18px;
  --default-font-size-big:20px;
  --default-font-size-huge:24px;
  --default-font-size-x-huge:30px;
  --default-font:'Poppins';
  --default-font-2:'Poppins';
  --default-font-3:'Poppins';
  --default-font-4:'Poppins';
  --default-font-weight:normal;  
  
  /* -- ... -- */
  --default-margin:15px;
  --default-radius:4px;
  --default-radius-medium:6px;
  --default-radius-small:8px;
  --default-shadow:0px 0px 8px 2px #00000044;
  --default-shadow-lite:0px 0px 20px -12px rgba(0, 0, 0, 0.5);
  --default-transition:all 200ms ease-in;
   
}


.sk-simple-header{
  width:100%;
  float:left;
  font-family: var(--default-font-4);
  font-weight: 100;
  font-size:34px;
  padding-bottom:5px;
  border-bottom: solid 1px var(--default-color-5);
  color:var(--default-color-3);
  margin:calc( 3 * var(--default-margin) ) 0px;
}


/************************************************************
  General settings
************************************************************/
html {
  scroll-behavior:smooth;
  transition: all 300ms ease;
}

body{
  margin:0px;
  padding:0px;
  border:0px;
  box-sizing: border-box;
  background:var(--default-background);
  font-family: var(--default-font);
  font-weight: var(--default-font-weight);
  font-size: var(--default-font-size);
  height:100%;
}

section{}

div{
  box-sizing: border-box;
}

a{
  text-decoration: none;
  box-sizing: border-box;
}

h1, h2, h3, h4, h5, h6{
  box-sizing: border-box;
  width:100%;
  float:left;
}

p{
  box-sizing: border-box;
  line-height:1.6;
}

hr{
  border:0px;
  border-bottom:dotted 1px var(--default-color-5);
  height:0px;
  margin:var(--default-margin) 0px;
}


/************************************************************
  General ui/sk settings
************************************************************/

.ui-clear{
  clear:both;
  width:100%;
  box-sizing:border-box;
  height:0px;
}

.ui-abs-center{
  position:absolute;
  top:50%;
  left:50%;
  transform: translateY(-50%) translateX(-50%);
}

/************************************************************
  Skin
************************************************************/

.sk-button-1{
  padding:15px 5px;
  background:var(--default-color-1);
  color:var(--default-color-0);
  transition: var(--default-transition);
  cursor:pointer;
  display:block;
  text-align:center;
  border-radius: var(--default-radius);
  font-size:var(--default-font-size-medium);
}

.sk-button-1:hover{
  background:var(--default-color-3);
  color:var(--default-color-0);
}

.sk-button-2{
  padding:15px 25px;
  background:var(--default-color-2);
  color:var(--default-color-0);
  transition: var(--default-transition);
  cursor:pointer;
  display:inline-block;
  text-align:center;
  border-radius: var(--default-radius);
  font-size:var(--default-font-size-medium);
  font-weight:700;
}

.sk-button-2:hover{
  background:var(--default-color-B);
  color:var(--default-color-0);
}


  /* *************************************************************************************************
  GENERAL
************************************************************************************************* */

.ui-clear{
  clear:both;
}

.ui-ul-flat{
  display:block;
  list-style:none;  
  box-sizing:border-box;
  width:100%;
}
.ui-ul-flat>li{
  display:inline-block;
}

/* *************************************************************************************************
  Page return UP
************************************************************************************************* */

@keyframes ui-up-arrow-anim{
   0% { transform:scale( 1.0, 1.0 ) }
  20% { transform:scale( 0.6, 1.4 ) }
  40% { transform:scale( 1.3, 0.7 ) }
  60% { transform:scale( 0.8, 1.2 ) }
  80% { transform:scale( 1.1, 1.00 ) }
  100%{ transform:scale( 1, 1 ) }
}


#ui-up-arrow{
  position: fixed;
  bottom: 20px;
  right: 20px;
  background: #FFFFFF66;
  padding: 0px;
  text-decoration: none;
  font-size: 40px;
  color: #033;
  opacity:0.5;
  /* border:solid 1px #00ccff66; */
  border-radius:25px;
  /* box-shadow:var(--default-shadow); */
  display:none;
  width:50px;
  height:50px;
  line-height:50px;
  text-align:center;
  box-sizing:border-box;
  z-index:99999;
  background-image:url('skin/img/up-arrow.svg');
  background-position:center;
  background-size:36px 36px;
  background-repeat:no-repeat;
  cursor:pointer;
}

#ui-up-arrow:hover{
  opacity: 1;
  animation-name: ui-up-arrow-anim;
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 1;  
}


/* *************************************************************************************************
  HEADER - page position
************************************************************************************************* */
#ui-page-pos{
  position:fixed;
  top:0px;
  left:0px;
  width:100%;
  box-sizing:border-box;
  opacity:0.95;
  border:solid 1px var(--default-color);
  background:var(--default-text-color-inv);
  z-index:999999;  
}

#ui-page-pos-pb{
  box-sizing:border-box;
  float:left;
  height:3px;
  width:0%;
  background-color:var(--default-color);
  transition: all 300ms ease;
}


/* *************************************************************************************************\
  uiTooltips
*/
.ui-tooltip{
  z-index:99999;
  background:linear-gradient(25deg, rgba(40,40,40,1) 0%, rgba(40,40,40,1) 68%, rgba(40,30,20,1) 100%);
  color:#bbb;
  font-size:var(--default-font-size);
  padding:15px 15px 15px 15px;
  text-align:center;
  border-radius: var(--default-radius);
  border:solid 1px #aaaaaa88;
  box-shadow: var(--default-shadow);
  text-align:left;
  display:table;  
  display:none;
  line-height:1.6;
  max-width:400px;
}

.ui-tooltip-close{ 
  float:right;
  position:relative;
  top:-5px;
  left:5px;
  width:28px;
  height:28px;
  background:var(--default-color-2);
  color:#fff;
  text-align:center;
  line-height:28px;
  border-radius:14px;
  transition: all 300ms ease;
  cursor:pointer;
}

.ui-tooltip-close:hover{
  background:var(--color-main-2);
  color:var(--color-main-light);
}


.ui-tooltip-arrow{
  z-index:99995;
  position:absolute;
  top:-12px;
  width: 0; 
  height: 0; 
  border-left: 12px solid transparent;
  border-right: 12px solid transparent;  
  border-bottom: 12px solid #aaaaaa88;
}

/* *************************************************************************************************
  uiTools elements popup
*/

:root{
  --popup-border-radius:30px;
}

.ui-tools-popup-container{
  position:fixed;
  top:50%;
  left:50%;
  transform: translateY(-50%) translateX(-50%);
  background:var(--default-color-3);
  border:solid 1px var(--default-color-2);
  border-radius: var(--popup-border-radius);
  color:var(--default-text-color-inv);
  box-sizing:border-box;
  min-width:240px;
  min-height:200px;
  z-index:99999;
  box-shadow: 0px 0px 2000px 2000px rgb(0 0 0 / 60%); 
  padding-top:60px;
  max-width:calc(100% - 20px);
  max-height:calc(100vh - 100px);
  transition: all 1000ms ease-in;
  opacity:0;
  display:none;
  overflow:hidden;
  filter:grayscale(0%) blur(0px);
  transition:var(--default-transition);
  overscroll-behavior: none;
  overscroll-behavior-y: none;
  z-index:9999999;
}

#ui-tools-popup-title{
  position:absolute;
  top:0px;
  left:0px;
  width:calc(100% - 60px);
  height:60px;
  line-height:60px;
  font-family:var(--default-font);
  font-size:22px;
  padding:0px 10px 0px 20px;  
  box-sizing:border-box;
  background-color:var(--default-color-2);
  border-radius:0px 0px var(--popup-border-radius) 0px;
  color:var(--default-text-color-inv);
  font-weight:200;
  
  white-space: nowrap;
  text-overflow:ellipsis;
  margin:0px;
}

#ui-tools-popup-title:after{
  content: "";
  position: absolute;
  height: var(--popup-border-radius);
  width: var(--popup-border-radius);
  right: calc( -1 * var(--popup-border-radius) );
  top: 0px;
  background-color: transparent;
  border-top-left-radius: var(--popup-border-radius) var(--popup-border-radius);  
  box-shadow: 0px 0px 0px var(--popup-border-radius) var(--default-color-2);
  clip: rect(0px, var(--popup-border-radius), var(--popup-border-radius), 0px);
}

@media all and ( max-width: 390px ){
  #ui-tools-popup-title{
    font-size:16px;
  }
}

#ui-tools-popup-content{
  position:absolute;
  top:60px;
  left:0px;
  right:0px;
  bottom:0px;
  display:block;
  padding:10px 20px;
  box-sizing:border-box;
  overflow:auto;
  overscroll-behavior: none;
  overscroll-behavior-y: none;
}

#ui-tools-popup-content:after{
  content: "";
  position: absolute;
  height: var(--popup-border-radius);
  width: var(--popup-border-radius);
  left: 0px;
  top: 0px;
  background-color: transparent;
  border-top-left-radius: var(--popup-border-radius) var(--popup-border-radius);  
  box-shadow: 0px 0px 0px var(--popup-border-radius) var(--default-color-2);
  clip: rect(0px, var(--popup-border-radius), var(--popup-border-radius), 0px);
}

@keyframes ui-tools-popup-close-anim{
    0%{border:dotted 2px #fff}
   20%{border:dotted 2px #888}
   40%{border:dotted 2px #fff}
  100%{border:dotted 2px #fff}
}

#ui-tools-popup-close{
  animation-name: ui-tools-popup-close-anim;
  animation-duration: 2s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  position:absolute;
  display:block;
  box-sizing:border-box;
  top:10px;
  right:10px;
  width:40px;
  height:40px;
  line-height:38px;
  text-align:center;
  background-color:var(--color-main-background);
  background-image:url(/skin/img/close.svg);
  background-position: center;
  background-size:16px 16px;
  background-repeat: no-repeat;
  border-radius:20px;
  cursor:pointer;
  font-weight:bold;  
  border:solid 2px #333;
  color:#fff;
}

#ui-tools-popup-close:hover{
  background-color:var(--color-main-2);
  color:var(--color-main-light);
}

/* mode = "minimal" */

.ui-tools-popup-container.minimal{}

@media all and ( max-width: 600px ){
  .ui-tools-popup-container.minimal{
    width:calc(100% - 30px);
    height:calc(100vh - 60px);
    max-width:calc(100% - 30px);
    max-height:calc(100vh - 60px);
  }
}

/* mode = "minimal-event" */

.ui-tools-popup-container.minimal-event{
  width:unset;
  height:unset;  
  left:25%;
  top:100px;
  right:25%;
  bottom:100px;
  transform:none;
  max-height:unset;
  max-width:unset;
}

@media all and ( max-width: 1024px ),
       all and ( max-height: 560px )
{
  .ui-tools-popup-container.minimal-event{
    left:10px;
    top:10px;
    right:10px;
    bottom:10px;
  }
}

.ui-tools-popup-container.minimal-event #ui-tools-popup-title{
  display:none;
}

.ui-tools-popup-container.minimal-event #ui-tools-popup-content{
  width:unset;
  height:unset;
  position:absolute;
  top:0px;
  left:0px;
  bottom:0px;
  right:0px;
  background:var(--default-color-6);
}



/* mode = "full" */

.ui-tools-popup-container.full{
  width:unset;
  height:unset;  
  left:25%;
  top:100px;
  right:25%;
  bottom:100px;
  transform:none;
  max-height:unset;
  max-width:unset;
}


@media all and ( max-width: 1024px ),
       all and ( max-height: 560px )
{
  .ui-tools-popup-container.full{
    left:10px;
    top:10px;
    right:10px;
    bottom:10px;
  }
}

/* mode = "full-screen" */

.ui-tools-popup-container.full-screen{
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
  border:0px;
}

.ui-tools-popup-container.full-screen>#ui-tools-popup-content{
  position:absolute;
  top:60px;
  left:0px;
  width:100%;
  padding:0px;
  height:calc(100% - 60px);
  overflow:hidden;
  background:var(--color-main-background);
}

.ui-tools-popup-container.full-screen>#ui-tools-popup-close{
  box-shadow:var(--shadow-default);
}

.ui-tools-popup-container.stage-1{
  position:fixed;
  min-width:0 !important;
  min-height:0 !important;
  padding:0px;
  box-sizing:border-box;  
  width:2px !important;
  height:2px !important;
  overflow:hidden;
  box-shadow:var(--shadow-default);
  --border-radius:50%;
  --transform:perspective(2500px) rotate3d(1,0,0,180deg);
  filter:grayscale(100%) blur(1px);
  opacity:0;
  
}
/* *************************************************************************************************
  wait-box
*/
#ui-tools-wait-box{
  position:fixed ;
  width:calc(100% - 40px);
  height:calc(100% - 40px);
  top:50%;
  left:20px;
  border-radius:3px;
  transform:translateY(-50%);  
  background:#ffffff88;
  z-index:999999;
}

#ui-tools-wait-box>span{
  position:absolute;
  top:50%;
  left:50%;
  transform:translateY(-50%) translateX(-50%);
}


/* *************************************************************************************************
  uiTools elements notice
*/

#ui-tools-notice{  
  position:fixed;
  z-index:99999;
  top:10px;
  right:10px;  
  background:#f60;
  color:#fff;
  font-size:24px;
  padding:30px;
  text-align:center;
  border-radius: var(--default-radius);
  box-shadow: var(--default-default);
  opacity:0px;
  display:none;  
}

/*
#ui-tools-notice:after{
  content: '';
  position: absolute;
  top:0;
  left: 50%;
  width: 0;
  height: 0;
  border: 10px solid transparent;
  border-top-color: var(--color-main-1);
  border-bottom: 0;
  margin-left: -0.6rem;
  margin-top: -0.6rem;
  transform: rotate(180deg);
}*/




/* *************************************************************************************************
  helpfull
*/


.ico-publication-date,
.ico-event-date,
.ico-clock{
  background-position:left;
  background-size:18px 18px;
  background-repeat:no-repeat;
  background-position-x:0px;
  padding-left:28px;
  padding-right:var(--default-margin);
  
}

.ico-clock{
  background-image:url(/skin/img/ico-clock.svg);
}

.ico-publication-date{
  background-image:url(/skin/img/ico-publication.svg);
}

.ico-event-date{
  background-image:url(/skin/img/ico-event-date.svg);
}


/* *************************************************************************************************
  animacja logo KSI
*/


.ui-ksi-logo{
  position:absolute;
  bottom:0px;
  right:0px;
}

.ui-ksi-logo>span{
  font-weight:900;
  font-size:14px;
  position:relative;
  top:-1px;
}

.ui-ksi-logo>img{
  width:21px;
  height:21px;
  display:inline-block;
  position:relative;
  top:5px;  
}

@keyframes sk-logo-main{
    0% { transform: rotate(360deg); }
  100% { transform: rotate(0deg); }
}

.ui-ksi-logo:hover>img{
  animation-name: sk-logo-main;
  animation-duration: 0.4s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 1;  
}



/************************************************************
  button
************************************************************/

.am-button{
  margin-top:15px;
  border:0px;
  height:40px;
  padding:0px 15px;
  line-height:40px;
  font-family:var(--default-font);
  font-size:14px;
  background:var(--default-color-6);
  color:#fff;
  border-radius:var(--default-radius);
  transition:var(--default-transition);
  cursor:pointer;
  margin-right:10px;
}

.am-button:hover{
  background:var(--default-color-6); 
}


:root{
  --ksi-checkbox-size:24px;
  --ksi-checkbox-color-1:#333;
  --ksi-checkbox-color-2:var(--default-color-1);
}

/* The container */
.fs-chk-container {
  display: block;
  position: relative;
  padding-left: calc( var(--ksi-checkbox-size) + var(--default-margin) );
  margin-bottom: 0px;
  cursor: pointer;
  color:var(--ksi-checkbox-color-1);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  overflow:hidden;
  box-sizing:border-box;
  min-height:28px;
  padding-top:2px;
}

.fs-chk-container>input {
  position: absolute;
  opacity: 0;
  height: 0;
  width: 0;
}

.fs-chk-container .fs-chk-checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: var(--ksi-checkbox-size);
  width: var(--ksi-checkbox-size);
  border-radius:var(--default-radius);
  border:solid 1px #333;
  background-color:#ffffff;
  transition:var(--default-transition);
}

.fs-chk-container:hover input ~ .fs-chk-checkmark {
  background-color: #ffffff22;
}

.fs-chk-container:hover input:checked .fs-chk-checkmark {
  background-color: #FFFFFF;
}

.fs-chk-container .fs-chk-checkmark:after {
  content: '';
  position: absolute;
  opacity: 0;
  transition:var(--default-transition);
  transform: translateX(-50%) translateY(-60%) rotate(405deg);
}

.fs-chk-container input:checked ~ .fs-chk-checkmark:after {
  opacity: 1;
  transform: translateX(-50%) translateY(-60%) rotate(45deg);
}

.fs-chk-container .fs-chk-checkmark:after {
  position:absolute;
  left: 50%;
  top: 50%;
  width: 40%;
  height: 70%;
  border: solid var(--ksi-checkbox-color-2);
  box-sizing:border-box;
  border-width: 0 3px 3px 0;
}


.sk-row {
    max-width: 1000px;
    margin: auto;
    padding: 0px;
    box-sizing: border-box;
}

@media screen and (max-width: 1030px) {
  .sk-row {
    margin-left: var(--default-margin);
    margin-right: var(--default-margin);
  }
}

.bs-top-text{
  color:#fff;
  margin:10px 15px 0px 15px;
  padding:5px;
  text-align:center;
  border-radius:var(--default-radius);
  font-weight:bold;
  font-family:var(--default-font);
  font-size:20px;
}

.bs-map-cnt{
  margin:15px 15px 15px 15px;
  box-sizing:border-box;
  border-radius:var(--default-radius);
  overflow:hidden;
  background:#f0f0f0;
  width:calc( 100% - 30px );
}

.bs-text-msg{
  margin:15px 0px;
  background:#f0f0f0;
  padding:15px;
  border-radius:var(--default-radius);
  overflow:hidden;
}

/* **************************************************************************
  Formularz
************************************************************************** */      

.bs-sub-form{
  display:grid;
  width:100%;
  float:left;
  grid-template-columns: 1fr 1fr;
  grid-gap: 15px 15px;
}

.bs-sub-form>div{
  width:100%;
}

.bs-has-icon{
  margin:30px 0px;
  padding:0px;
  padding-left:45px;
  line-height:30px;
  background-size:30px 30px;
  background-position:left;
  background-repeat:no-repeat;
  font-size:20px;
  font-weight:bold;
}

#bs-form-title{
  margin:30px 0px;
  padding:0px;
  padding-left:45px;
  line-height:30px;
  font-size:20px;
  font-weight:bold;
  background-image:url(skin/img/bs-ticket.svg);
  background-size:30px 30px;
  background-position:left;
  background-repeat:no-repeat;
}


#bs-form,
.bs-form{
  width:100%;
  float:left;
}

#bs-form label.edit{
  width:100%;
  float:left;
  box-sizing:border-box;
  padding:15px 0px 8px 0px;
}

#bs-form input.edit{
  width:100%;
  float:left;
  box-sizing:border-box;
  height:44px;
  line-height:42px;
  border:solid 1px #e0e0e0;
  font-family:var(--default-font);
  padding:0px 10px;
  border-radius:var(--default-radius);
  font-size:18px;
  color:#000;
}

#bs-form button,
.bs-form button{
  margin:30px auto;
  display:inline-block;
}

#bs-form-info{
  margin-top: 30px;
  padding: 0px 0px 0px 60px;
  color: #333;
  border-radius: var(--default-radius);
  line-height: 1.6;
  font-size: 15px;
  background-size: 30px 30px;
  background-position: 0px 0px;
  background-repeat: no-repeat;
  background-image:url(skin/img/bs-info.svg);
  width:100%;
  overflow: hidden;
  box-sizing:border-box;
  font-weight:normal;
}


/* **************************************************************************
  Formularz - wybrane miejsca
************************************************************************** */      

#bs-selected-seats{
  box-sizing:border-box;
  width:100%;
  float:left;
  margin:0px;
}

.bs-selected{
  padding:10px 20px;
  margin-right:0px;
  margin-bottom:10px;
  background:#ddd;
  color:#fff;        
  display:inline-block;
  text-align:left;
  position:relative;
  color:#333;
  border-right: dotted 4px #fff;
}

.bs-selected:before,
.bs-selected:after{
  position:absolute;
  content:'';
  display:block;
  top:50%;        
  width:20px;
  height:20px;
  background:#fff;  
  border-radius:50%;        
}
.bs-selected:before{ left:0px; transform:translateY(-50%) translateX(-50%); }
.bs-selected:after{ right:0px; transform:translateY(-50%) translateX(+50%); }


.bs-selected .row,
.bs-selected .nr{
  width:100%;
  font-size:14px;
  font-weight:normal;
  font-family:Verdana;
  box-sizing:border-box;
}

/* **************************************************************************
  Formularz - przycisk rezerwuj
************************************************************************** */      

#bs-reservation{
  background:var(--default-color-1);
  transition:var(--default-transition);
  color:#fff;
  border:0px;
  border-radius:var(--default-radius);
  padding:15px 25px;
  font-size:
  font-family:var(--default-font);
  box-sizing:border-box;
  cursor:pointer;
  font-weight:bold;
}

#bs-reservation:hover{
  opacity:0.7;
}



/* **************************************************************************
  Szczegóły rezerwacji
************************************************************************** */      


#bs-reservation-confirm{
  background:var(--default-color-1);
  transition:var(--default-transition);
  color:#fff;
  border:0px;
  border-radius:var(--default-radius);
  padding:15px 25px;
  font-size:
  font-family:var(--default-font);
  box-sizing:border-box;
  cursor:pointer;
  font-weight:bold;
}

#bs-reservation-confirm:hover{
  opacity:0.7;
}


/* **************************************************************************
  Bilet
************************************************************************** */      

#bs-ticket-list{
  width:100%;
  float:left;
  box-sizing:border-box;
  margin-bottom:30px;
}

.bs-ticket{
  width:100%;
  float:left;
  box-sizing:border-box;
  margin-top:var(--default-margin);
  padding:var(--default-margin);
  border-radius:var(--default-radius);
  background-color:#eee;
  border:solid 1px #888;
  
  padding-left: calc( 130px + 2 * var(--default-margin) );
  min-height: calc( 130px + 2 * var(--default-margin) );
  position:relative;
  font-size:18px;
}

.bs-ticket.canceled{
  background-color:#fbb;
  border:solid 1px #d33 !important;
  opacity:0.4;
}

.bs-ticket.canceled button{
  display:none !important;
}

.bs-ticket button{
  border:0px;
  height:36px;
  padding:0px 15px;
  line-height:32px;
  font-family:var(--default-font);
  font-size:14px;
  background:var(--default-color-2);
  color:#fff;
  border-radius:var(--default-radius);
  transition:var(--default-transition);
  cursor:pointer;
  margin-right:10px;
}

.bs-ticket button:hover{
  background:var(--default-color-1); 
}

.bs-ticket .imgcnt{
  position:absolute;
  top:var(--default-margin);
  left:var(--default-margin);  
  bottom:var(--default-margin);
  width:130px;
  background:#fff;
  border-radius:var(--default-radius);
}

.bs-ticket .imgcnt img{
  position:absolute;
  top:calc(50% - 111px / 2 );
  left:calc(50% - 111px / 2 );
}


.bs-ticket .person{
  width:100%;
  float:left;
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap:var(--default-margin);
  margin:var(--default-margin) 0px;
}

.bs-ticket .person label{
  font-size:16px;
  display:block;
  padding-bottom:4px;
}

.bs-ticket .person input{
  width:100%;
  height:36px;
  box-sizing:border-box;
  border:none;
  border-radius:var(--default-radius);
  padding:0px 10px;
  font-family:var(--default-font);
  font-size:16px;
}

.bs-ticket .person button{
  margin-top:29px;
}

@media screen and (max-width: 640px) {

  .t-number{
    width:100%;
    display:block;
  }
    
  .bs-ticket .person{
    display:block;
  }
  
  .bs-ticket .person button{
    margin-top:15px;
    margin-bottom:30px;
    width:100%;
  }
  
}

@media screen and (max-width: 480px) {
  .bs-ticket{
    padding-left:unset;
    padding:var(--default-margin);
    padding-top:calc( 130px + 2 * var(--default-margin) );
  }
  
  .bs-ticket .imgcnt{
    position:absolute;
    top:var(--default-margin);
    left:var(--default-margin);  
    right:var(--default-margin);  
    bottom:unset;
    width:unset;
    height:130px;
    background:#fff;
    border-radius:var(--default-radius);
  }
  
}


/************************************************************
  Wspolny pasek gorny: brand + uzytkownik + wylogowanie
************************************************************/

.vr-header{
  box-sizing: border-box;
  position: relative;
  flex-shrink: 0;
  margin-top: 5px; /* miejsce na kreskę postępu czytania */
  background-color: var(--default-color-2);
  color: var(--default-color-0);
  font-family: var(--default-font);
  font-size: var(--default-font-size);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

.vr-header__inner{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px 24px;
  padding-top: 12px;
  padding-bottom: 12px;
  min-height: 72px;
}

.vr-header__brand{
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
  text-decoration: none;
  color: inherit;
}

.vr-header__logo{
  display: block;
  height: 44px;
  width: auto;
  flex-shrink: 0;
}

.vr-header__titles{
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}

.vr-header__org{
  font-size: 12px;
  font-weight: 400;
  line-height: 1.3;
  color: rgba(255, 255, 255, 0.78);
}

.vr-header__app{
  font-size: var(--default-font-size);
  font-weight: 600;
  line-height: 1.3;
  color: var(--default-color-0);
}

.vr-header__user{
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
  min-width: 0;
}

.vr-header__identity{
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1px;
  min-width: 0;
  text-align: right;
}

.vr-header__name{
  font-size: var(--default-font-size);
  font-weight: 500;
  line-height: 1.3;
  color: var(--default-color-0);
  overflow-wrap: anywhere;
}

.vr-header__action{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 40px;
  padding: 9px 18px;
  background: #f1ebdc;
  color: var(--default-color-2);
  font-family: var(--default-font);
  font-size: var(--default-font-size-small);
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  border: 1px solid #f1ebdc;
  border-radius: 10px;
  white-space: nowrap;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.vr-header__action:hover{
  background: #fff;
  border-color: #fff;
  color: var(--default-color-2);
}

.vr-header__action:focus{
  outline: 2px solid #fff;
  outline-offset: 2px;
}

@media screen and (max-width: 900px){
  .vr-header__logo{
    height: 40px;
  }

  .vr-header__app{
    overflow-wrap: anywhere;
  }
}

@media screen and (max-width: 640px){
  .vr-header__inner{
    flex-direction: column;
    align-items: flex-start;
    min-height: 0;
    padding-top: 14px;
    padding-bottom: 14px;
  }

  .vr-header__user{
    width: 100%;
    justify-content: space-between;
  }

  .vr-header__identity{
    align-items: flex-start;
    text-align: left;
    flex: 1;
  }

  .vr-header__logo{
    height: 36px;
  }
}

@media screen and (max-width: 375px){
  .vr-header__org,
  .vr-header__app,
  .vr-header__name{
    overflow-wrap: anywhere;
  }
}



/************************************************************
  Footer
************************************************************/

footer{
  clear:both;
  background:var(--color-main-background);
  width:100%;  
  box-sizing:border-box;
  float:left;
  flex-shrink:0;
  padding:35px 0px;
  margin-top:auto;
  position:relative;
  color:#fff;
  text-align:right;
  line-height:29px;
}

footer a{
  color:#fff;
}

/************************************************************
  sk-copyright
************************************************************/
.sk-copyright{
  line-height:28px;  
}

.sk-copyright>div{
  float:left;
  color:#fff;
  font-size:16px;
}

.sk-copyright>a{
  float:right;
  color:#fff;
  font-size:16px;
}

.sk-copyright>a:hover{
  color:#eeeeee;
  text-shadow: #F00 0px 0px 3px;
}

@media all and ( max-width: 720px ){
  .sk-copyright>a,
  .sk-copyright>div{
    width:100%;
    box-sizing:border-box;
    display:block;
    text-align:center;
  }
  
  .sk-3-cols{
    grid-template-columns:1fr;
  }
  
  .ui-ksi-logo{
    position:static;
    margin-top:30px;
  }
}