/* *************************************************************************************************
  Variables
************************************************************************************************* */
:root{
  /* -- Colors -- */
  --color-main-background:#fff;
  --color-main-light:#eee;
  --color-main-1:#640060;
  --color-main-1-transparent:#E5008088;
  --color-main-2:#FDee02;
  --color-main-light-frame:#888;
  --color-main-light-gray:#f5f5f5;
  --color-main-gray:#888;
  --color-main-dark:#eee;

  --color-btn-action-bg:var(--color-main-1);
  --color-btn-action-font:#fff;
  --color-btn-action-bg-hv:var(--color-main-2);
  --color-btn-action-font-hv:#333;  
  
  /* -- Shadows -- */
  --shadow-default:0px 0px 10px 0px #00000033;
  
  /* -- Texts -- */  
  --text-color-general:#333;
  --text-color-light:#666;
  --text-color-links:var(--color-main-2);
  
  /* -- Font & sizes -- */
  --font-size-defaut-text:16px;
  --font-size-defaut-text-small:16px;  
  --default-font:Poppins;
  --default-font-2:Lato;
  --default-font-3:Poppins;

  /* -- ... -- */
  --default-margin:15px;
  --default-radius:3px;
  
  
  --color-1-bg:var(--color-main-1);
  --color-1-color:#fff;
  --color-2-bg:var(--color-main-2);
  --color-2-color:#333;
  --color-3-bg:var(--color-main-2);
  --color-3-color:#333;
  
}  

@media all and ( max-width: 480px ){
  :root{          
    --default-margin:10px;  
  }
}


/* *************************************************************************************************
  GENERAL
************************************************************************************************* */
.ui-clear{
  clear:both;
}


/* *************************************************************************************************
  Page return UP
************************************************************************************************* */
#ui-up-arrow{
  position: fixed;
  bottom: 15px;
  right: 15px;
  /* background: var(--color-main-2); */
  background:#F5D841aa;
  padding: 0px;
  text-decoration: none;
  font-size: 30px;
  color: var(--color-main-1);

  border: dotted 1px #88888888;
  border-radius: 30px;
  display: none;
  width: 60px;
  height: 60px;
  line-height: 53px;
  text-align: center;
  box-sizing: border-box;
  z-index: 99999;
  box-sizing: border-box;
  cursor:pointer;
}

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

#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(--color-main-background);
  background:var(--color-main-background);
  z-index:999999;  
}

#ui-page-pos-pb{
  box-sizing:border-box;
  float:left;
  height:3px;
  width:0%;
  background-color:var(--color-main-1);
  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(--font-size-defaut-text-very-small);
  padding:15px 15px 15px 15px;
  text-align:center;
  border-radius: var(--button-radius);
  border:solid 1px #aaaaaa88;
  box-shadow: var(--shadow-default);
  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(--color-main-1);
  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
*/

.ui-tools-popup-container{
  position:fixed;
  top:50%;
  left:50%;
  transform: translateY(-50%) translateX(-50%);
  background:var(--color-main-background);
  border:solid 1px var(--offer-btn-reservation-background-hover);
  border-radius: var(--button-radius);
  color:var(--text-color-general);
  box-sizing:border-box;
  min-width:240px;
  min-height:200px;
  z-index:99999;
  box-shadow: 0px 0px 70px 70px rgb(0 0 0 / 82%); 
  padding-top:60px;
  max-width:calc(100% - 20px);
  max-height:calc(100vh - 100px);
  transition: all 1000ms ease-in;
  opacity:1;
  overflow:hidden;
  filter:grayscale(0%) blur(0px);

}

#ui-tools-popup-title{
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  height:60px;
  line-height:60px;
  font-family:var(--font-headers);  
  font-size:22px;
  padding:0px 10px;  
  box-sizing:border-box;
  background-color:var(--offer-btn-reservation-background-hover);  
  color:var(--color-main-light);
  font-weight:200;
  overflow:hidden;
  white-space: nowrap;
  text-overflow:ellipsis;
}

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

#ui-tools-popup-content{
  display:block;
  width:100%;
  padding:10px;
  box-sizing:border-box;
  height:100%;
  overflow:hidden;  
}

@keyframes ui-tools-popup-close-anim{
    0%{border:dotted 2px var(--color-main-background)}
   20%{border:dotted 2px #888}
   40%{border:dotted 2px var(--color-main-background)}
  100%{border:dotted 2px var(--color-main-background)}
}

#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:37px;
  text-align:center;
  background:var(--color-main-background);
  border-radius:20px;
  cursor:pointer;
  font-weight:bold;  
  border:solid 2px #333;
}

#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 = "full" */

.ui-tools-popup-container.full{
  width:calc(100% - 20px);
  height:calc(100vh - 100px);
  left:10px;
  top:40px;
  transform:none;
}

@media all and ( max-width: 390px ){
  .ui-tools-popup-container.full{
    width:calc(100%);
    left:0px;
    min-width:50px;
    max-width:1980px;
  }
}

.ui-tools-popup-container.full #ui-tools-popup-title{
  border-bottom:solid 3px #333;
  color:#fff;
}

/* 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%);
}


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-hv);
  color:var(--color-btn-action-font-hv);  
  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);
  color:var(--color-btn-action-font);  
}

.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-3);
  font-size:34px;
  background-color:var(--color-main-1);
  line-height:1;
  color:#fff;
  box-sizing: border-box;
  padding:35px;
  margin-bottom:30px;
}

.ksi-module-content{
  padding-top:10px;
  color:#555;
  max-width:1170px;
  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: 1200px) {
  .ksi-module-container{
    margin:0px var(--default-margin);
  }
  
  .ksi-module-title{
    margin:0px calc(-1 * var(--default-margin));
    margin-bottom:var(--default-margin);
    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%;
  }

}



/******************************************************************************************************
* przełącznik kalendarz / tabela w ofercie
*******************************************************************************************************/

.trpcal{
  padding-top:5px;
  padding-bottom:15px;
  overflow:hidden;
}
.trpcal-title{
  line-height: 25px;
  font-size: 16px;
  font-weight: bold;
  color: #666;
  float: right;
  margin-right: 15px;
}
.trpcal-switch{
  float:right;
  font-size:12px;
  height:28px;
  overflow:hidden;
  border-radius:13px;
  border:solid 1px #888 ;
  background:#fafafa;
  cursor:pointer;
  box-sizing: border-box;
}

.trpcal-switch:hover{
  background:#fff;
}

.trpcal-switch span{
  color:#bbb;
}

#trpcal-dates, #trpcal-calendar {
  margin: 3px;
  height: 20px;
  border-radius: 20px;
  border: 0px;
  font-size: 11px;
  font-weight: bold;
  display: inline-block;
  line-height: 20px;
  padding-left: 7px;
  padding-right: 7px;
}

.trpcal-active {
  transition:1s;
  background:var(--color-btn-action-bg) !important;
  color:var(--color-btn-action-font) !important;
}

@media all and ( max-width: 519px ) {
  .trpcal{
    display:none;
  }
}


/***************************************************************************************************************
  Sekcja okienka Cookie
*/

.cookie-info-box{
  box-sizing:border-box;
  background:rgba(0,0,0,0.7);
  position: fixed;
  bottom: 0px;
  z-index:9999999999;
  padding:20px;
  width: 100%;
  box-sizing:border-box;
}

.cookie-info-text{
  box-sizing:border-box;
  color: #fff;
  font-size:14px;
  margin-right:20px;
  float:left;
  width:calc(100% - 150px);
}

.cookie-info-btn{
  box-sizing:border-box;
  background: #ff6600;
  border-radius: 3px 3px 3px 3px;
  color: #FFFFFF;
  cursor: pointer;
  display: block;
  float: right;
  font-size: 16px;
  line-height: 22px;
  padding: 8px;
  margin-top:10px;
}

@media all and ( max-width: 640px ) {
  .cookie-info-text{
    width:100%;
  }
}



/************************************************************
  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;
  background:var(--color-main-background);
  font-family: var(--default-font);
  font-weight: 400;
  font-size: var(--font-size-defaut-text);
  line-height:1.8;
}

section{
  clear:both;
}

a{
  text-decoration: none;
}

.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-row{
  max-width: 1170px;
  margin: auto;
  padding:0px;
  box-sizing:border-box;
}

.sk-row h1{
  background:var(--color-main-1);
  color:var(--color-main-2);
  padding:5px 15px;
  font-family:var(--default-font);
  margin-top:calc(3 * var(--default-margin));
  font-weight:200;
  border-radius:var(--default-radius);
}

.sk-row h2{
  border-bottom:solid 3px var(--color-main-2);
  color:var(--color-main-1);
  padding:5px 0px;
  font-family:var(--default-font);
  margin:var(--default-margin) 0px;
  font-weight:200;
  border-radius:var(--default-radius);  
}

.sk-row h3{
  border-bottom:dotted 1px var(--color-main-2);
  color:var(--color-main-1);
  padding:5px 15px 5px 0px;
  font-family:var(--default-font);
  margin:var(--default-margin) 0px;
  font-weight:bold;
  border-radius:var(--default-radius);
  text-transform:uppercase;
}



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


/************************************************************
  Header
************************************************************/

header{
  height:100px;
  line-height:100px;
  position:relative;
  background:#fff;
  border-bottom:solid 4px var(--color-main-2);
  font-size:17px;
}

header .logo{
  position:relative;
  top:10px;
  float:left;
  display:block;
  width:256px;
  height:80px;
}

header .logo>img.sk-ifirst{
  position:absolute;
  top:0px;
  left:0px;
  width:80px;
  height:80px;
  transition:all 450ms ease;
}

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

header .logo .sk-isecond{
  position:absolute;
  left:100px;
  top:27px;
  width:156px;
  height:34px;
}

header .logo:hover>img.sk-ifirst{
  animation-name: header-logo-rotate;
  animation-duration: 0.5s;
}

.top-menu-right{
  float:right;  
}

.top-menu-right .phone{
  color:var(--text-color-general);
  font-weight:bold;
  padding-left:30px;
  margin-left:30px;
  display:inline-block;
  background-image:url("/skin/img/phone-call.svg");
  background-size:21px 21px;
  background-position:left;
  background-repeat:no-repeat;
  transition:all 150ms ease;
  font-family:var(--default-font);
}

@keyframes ui-tel-anim{
   0% { transform:scale( 1.0, 1.0 ) }
  20% { transform:scale( 0.7, 0,7 ) }
  40% { transform:scale( 1.2, 1.2 ) }
  60% { transform:scale( 0.9, 0.9 ) }
  80% { transform:scale( 1.1, 1.1) }
  100%{ transform:scale( 1, 1 ) }
}


.top-menu-right .phone:hover{
  animation-name: ui-tel-anim;
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 1;
}

@keyframes sk-jump-anim{
      0% {top:-8px;}
     15% {top:-18px; }
     30% {top:-8px; }
     45% {top:-12px;}
     60% {top:-8px; }
     75% {top:-10px; }
     90% {top:-8px; }
    100% {top:-8px; }
}

.sk-notes{
  position:relative;
  height:22px;
  width:22px;
  display:inline-block;
  float:right;
  top:39px;
  line-height:22px;
  margin-left:12px;
}

.sk-notes:hover #notes_counterValue{
  animation-name: sk-jump-anim;
  animation-duration: 0.8s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 1;
}

.sk-notes #notes_counterValue{
  position:absolute;
  display:block;
  height:16px;
  width:16px;
  border-radius:8px;
  right:-8px;
  top:-8px;
  line-height:16px;
  text-align:center;
  background:var(--color-main-1);
  color:#fff;    
  transition:all 300ms ease;
  font-size:11px;
}

@media all and ( max-width: 1180px ){
  
  header{
    position:relative;
    height:50px;
    line-height:50px;
    top:2px;
    margin-bottom:2px;
  }
  
  .top-menu-right .phone{
    margin-left:15px;
  }
  
  .sk-notes{
    top:15px;
  }
  
  header .logo{
    top:3px;
    width:150px;
    height:40px;
  }
  
  header .logo>img.sk-ifirst{
    width:40px;
    height:40px;    
  }
  
  header .logo .sk-isecond{
    left: 50px;
    top: 6px;
    width:80px;
  }
  
}

@media all and ( max-width: 480px ){
  .top-menu-right .phone{
    position:relative;
    width:21px;
    height:19px;
    overflow:hidden;
    margin-left:12px;
    margin-right:8px;
    box-sizing: border-box;
    top:5px;
  }
  
  .sk-notes{
    margin-left:0px;
  }
}

/************************************************************
  Header top-menu
************************************************************/

.top-menu{
  float:right;
}

.top-menu > ul , ul.submenu {
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}

.top-menu > ul > li {
  float: left;
  margin-right: 5px;
  cursor: pointer;
}

.top-menu > ul > li:last-child {
  margin-right: 0px;
}

.top-menu > ul > li > a {
  display: block;
  padding: 0px 10px;
  color:var(--text-color-general);
}

.top-menu > ul > li:hover > a {
  background: #eee;
}

.submenu {
  display: none;
  position: absolute;
  z-index: 9999;
  padding: 0px;
  background: #fff;
  box-shadow:var(--shadow-default);
}

.submenu > li{
  padding:0px;
  margin:0px;
  height:50px;
  box-sizing: border-box;
  overflow:hidden;
  transition:all 250ms ease;
}
.submenu > li > a {
  display:block;
  width:100%;
  color: var(--text-color-general);
  padding:0px 30px;
  height:50px;
  line-height:50px;
  box-sizing: border-box;
  border-bottom:solid 1px #f4f4f4;
  
  padding-left:45px;
  background-image:url(/skin/img/arrow-right-menu.svg);
  background-position:15px;
  background-size:12px 12px;
  background-repeat: no-repeat;

  
  transition:all 200ms ease;
}

.top-menu li:hover .submenu {
  display: block;    
}

.submenu > li {
  padding: 0px;  
  height:50px; 
}

.submenu > li:hover > a {
  background-color:var(--color-btn-action-bg-hv);
  color:var(--color-btn-action-font-hv);
  background-position:-30px;
}

.submenu > li:last-child {
    border-bottom: 0px dotted #8C2F5F;
}

/************************************************************
  Header top-menu button
************************************************************/

#sk-menu-top-btn{
  margin-left:20px;
}

#sk-menu-top-btn, #sk-menu-top-btn:before, #sk-menu-top-btn:after{  
  display:block;
  height:4px;
  width:26px;
  box-sizing:border-box;
  border:0px;
  border-radius:2px;
  box-sizing:content-box;
  cursor:pointer;
  transition:all 600ms ease;
  background:var(--color-main-1);
}

#sk-menu-top-btn.close, #sk-menu-top-btn.close:before, #sk-menu-top-btn.close:after{  
  width:26px;
}


#sk-menu-top-btn:before{
  background:var(--color-main-1);  
}

#sk-menu-top-btn:after{
  background:var(--color-main-1);
}

#sk-menu-top-btn{  
  position:relative;
  margin-top:23px;
  border:0;
  border-left:0px;
  border-right:0px;
  display:none;
  float:right;
}

#sk-menu-top-btn:before{
  content:'';
  position:absolute;
  top:-10px;
}

#sk-menu-top-btn:after{
  content:'';
  position:absolute;
  top:10px;  
}

#sk-menu-top-btn.close{
  background:none;
  transform: rotate(180deg);
}

#sk-menu-top-btn.close:before{
  transform: rotate(45deg) translateY(8px) translateX(5px);
  width:27px;
}

#sk-menu-top-btn.close:after{
  transform: rotate(-45deg) translateY(-9px) translateX(5.5px);
  width:27px;
}

@media all and ( min-width: 1181px ){
  .sk-menu-top{
    display:block !important;
    opacity:1 !important;
  }
  
  .sk-menu-top>li>a.menu-main-navigation-has-sub{
    background-image:none !important;
  }
}

@media all and ( max-width: 1180px ){
  
  .sk-menu-top{
    display:none;
    opacity:0;
  }
    
  .top-menu>ul>li{
    margin:0px;
  }  
  
  .top-menu>ul>li a{
    background-color:#fff;
    color:var(--text-color-general);
  }
  
  .top-menu>ul>li:hover a{

  }
  
  #sk-menu-top-btn{
    display:inline-block;
    float:right;
  }
  
  .sk-menu-top{
    position:fixed;
    display:none;
    background: #f6f6f6;
    border: solid 1px #eee;
    top: 50px;
    left:10px;
    right:10px;
    padding: 0px;
    box-sizing:border-box;
    line-height:1.5;    
    box-shadow:var(--shadow-default);
    z-index: 100;
    overflow:auto;
    transition:all 400ms ease;
    max-height: calc(100vh - 100px);
  }
  
  @keyframes sk-menu-top-mob-open{
      0% {height:0px; opacity:0.0;}
     25% {opacity:0.2; }
     50% {opacity:0.4; }
     75% {opacity:0.7;}
    100% {opacity:1.0; }
  }

  .sk-menu-top.close{}
  .sk-menu-top.open{    
    animation-name: sk-menu-top-mob-open;
    animation-duration: 0.6s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: 1;
  }
  
  .sk-menu-top>li{
    display:block;
    text-align:center;
    margin-bottom:10px;    
  }
  .sk-menu-top>li>a{
    padding:10px;
    padding-left:40px;
    margin:0px;
    background:#2f3843;
    display:block;
    width:100%;
    box-sizing:border-box;
    text-align:center;
    border-bottom: none;
  }
  
  .sk-menu-top-dropdown{
    display:block !important;
    position:initial;
    border:0px;
    box-shadow: none;
    padding:0px 20px;    
  }
  
  .sk-menu-top-dropdown a{
    padding:7px 0px;
  }
  
  .sk-menu-top.close{    
    height:0px;
    opacity:0;
  }
    
  .sk-menu-top>li{
    display:block;
    width:100%;
    margin:0px;
    border-bottom:solid 1px #d8d8d8;
    box-sizing:border-box;
    padding:0px;
  }
    
  .sk-menu-top>li>a{
    text-align:left;
    padding:0px 15px;
    background:#f6f6f6;
    line-height:50px;
    height:50px;
    font-weight:bold;
    box-sizing: border-box;
  }

  .sk-menu-top>li>a.menu-main-navigation-has-sub{
    background-image:url(/skin/img/arrow-down.svg);
    background-position:calc(100% - 15px) 20px;
    background-repeat:no-repeat;
    background-size:12px 12px;
    padding-right:16px;
  }
  
  .menu-main-navigation-sub{
    box-shadow:none;
    position:relative;
    width:100%;
    box-sizing: border-box;
    background:#fff;
    color:var(--text-color-general);
  }
  
  .menu-main-navigation-sub>li>a{
    color:var(--text-color-general);
    text-align:left;
    box-sizing: border-box;    
    
  }
  
}

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

footer{
  clear:both;
  background:var(--color-main-background);
  width:100%;
  box-sizing:border-box;
  float:left;
  padding:25px 0px 0px 0px;
  position:relative;
}


/************************************************************
  Footer - 4 kolumny
************************************************************/

.sk-footer-columns-cnt{
  padding: calc(2* var(--default-margin)) 0px;
  background:var(--color-main-1);
}

.sk-footer-columns{
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1fr;
  grid-gap:20px 20px;
  grid-auto-rows:minmax(auto, auto);
}

@media all and ( max-width: 990px ){
  .sk-footer-columns{
    grid-template-columns:1fr 1fr;
  }
}

@media all and ( max-width: 640px ){
  .sk-footer-columns{
    grid-template-columns:1fr;
  }
}

.sk-footer-column>h2{
  padding:0px;
  margin:0px;
  border:0px;
  font-size:15px;
  padding-bottom:25px;
  color:#fff;
}

.sk-footer-column{
  display:block;
  width:100%;
  box-sizing:border-box;
}

.sk-footer-column-phone{
  color:#fff;
  padding-bottom:5px;
  display:block;
}

.sk-menu-bottom{
  display:block;
  width:100%;  
  box-sizing:border-box;
}

.sk-menu-bottom>a{
  display:block;
  width:100%;
  box-sizing:border-box;
  height:27px;
  line-height:27px;
  color:#fff;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space: nowrap;  
  transition:all 0.3s ease;
}
.sk-menu-bottom>a:hover{
  text-decoration:underline;
}

.sk-info-bottom{
  color:var(--text-color-light);
}

.sk-info-bottom>a{
  padding-left:30px;
  display:block;
  width:100%;
  box-sizing: border-box;  
  background-image:url(/skin/img/phone-call.svg);
  background-position:left;
  background-size: 18px 18px;
  background-repeat: no-repeat; 
  margin-bottom:5px;
  transition:all 0.3s ease;
  color:var(--text-color-light);
}

.sk-info-bottom>a>b{
  width:100%;
  display:block;
  box-sizing: border-box;
}

.sk-info-bottom a:hover{
  color:var(--color-main-1);
}

.sk-footer-address{
  color:#fff;
  line-height:1.5;
}

.sk-footer-address a{
  line-height:1;
}

.sk-footer-address a:first-of-type{
  margin-top:var(--default-margin);
}

.sk-footer-social{
  padding-top:10px;
  float:left;
}

.sk-footer-social img{
  margin-right:var(--default-margin);
  transition:all 500ms ease;
  width:26px;
  height:26px;
  filter:grayscale(100%) brightness(1.5);
}

.sk-footer-social img:hover{
  transform:rotate(360deg);
  filter: grayscale(0%) brightness(1);;
}

.sk-footer-dotpay{
  display: inline-block;
  float: left;
  width: 100%;
  height: 24px;
  line-height: 24px;
  box-sizing: border-box;
  overflow: hidden;
  margin-top: 10px;
  transition:all 300ms ease;
  color:#fff;
  font-size:13px;
}

.sk-footer-dotpay>img{
  width:82px;
  height:24px;
  float:left;
  margin-right:10px;
}

.sk-footer-dotpay>span{
  display:block;
  height:24px; 
  line-height:24px;
  float:left;
}


.sk-footer-dotpay:hover{
  filter: opacity(0.7);
}

/************************************************************
  Footer - logotypy
************************************************************/

.sk-footer-partners{
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr ;
  grid-gap: 0px 0px;
  grid-auto-rows: minmax(auto, auto);
}

.sk-footer-partners a{
  display:block;
  height:80px;
  text-align:center;
  overflow:hidden;
}

.sk-footer-partners a>img{
  width:80px;
  height:80px;
}

@media all and ( max-width: 980px ){
  .sk-footer-partners{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr ;
  }
}

@media all and ( max-width: 480px ){
  .sk-footer-partners a{
    width:100%;
    height:60px;    
  }
  .sk-footer-partners a>img{
    width:58px;
    height:58px;
    object-position: center;
  }
}

/************************************************************
  Footer - napisy
************************************************************/
.sk-footer-bottom{
  padding: 30px 0px;
  box-sizing: border-box;
  display: block;
  background: var(--color-main-1);
  color: #fff;
  overflow:hidden;
}

.sk-footer-bottom span{
  float:left;
  display:block;
  font-size:13px;
  color:var(--color-main-background);
}

.sk-footer-bottom a{
  display:block;
  float:right;
  font-size:13px;
  color:var(--color-main-background);
  transition:all 300ms ease-out;
}

.sk-footer-bottom a:hover{
  filter:opacity(0.8);
}

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

  .sk-footer-column>h2{
    width:100%;
    box-sizing:border-box;
    clear:both;
    padding:calc( 2 * var(--default-margin) ) 0px;
  }
  
  footer{
    padding:0px;
    margin-top:var(--default-margin);
  }
  .sk-footer-columns{
    display:block;
  }
  
  .sk-footer-column{
    padding:0px;
    margin:0px;
  }
  
  .sk-menu-bottom>a{
    height:40px;
    line-height:40px;
    margin:0px;
    padding:0px;
    padding-left:25px;    
    background-image:url(/skin/img/arrow-right-white.svg);
    background-size:10px 10px;
    background-position:0px 14px;
    background-repeat:no-repeat; 
    border-bottom:solid 1px #FFFFFF22;
  }
  
  .sk-footer-column-phone{
    height:40px;
    display:block;
    line-height:40px;
    margin:0px;
    padding:0px;
    padding-left:25px;    
    background-image:url(/skin/img/phone-call-white.svg);
    background-size:16px 16px;
    background-position:0px 0px;
    background-repeat:no-repeat;     
  }
    
}


@media all and ( max-width: 720px ){
  
  .sk-footer-bottom{
    padding:var(--default-margin) 0px;
  }
  
  .sk-footer-bottom span, .sk-footer-bottom a{
    width:100%;
    float:left;
    margin-bottom:7px;
    text-align:center;
  }
}

@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;
  }
}













/************************************************************
  API DOCU
************************************************************/
.src-code{
  background:#482838;
  color:#cce;
  padding:20px;
  border-radius:var(--default-radius);
  width:100%;
  box-sizing:border-box;
  transition:all 250ms ease;
}  

.src-code:hover,
.src-code:active{
  background:#423;
  color:#eed;  
}


textarea.src-code{
  background:#423;
  color:#eed;
  padding:20px;
  border-radius:var(--default-radius);
  width:100%;
  box-sizing:border-box;
  overflow:auto;
}

.docu h1, .docu h2{
  cursor:pointer;
  transition:all 250ms ease;  
  position:relative;
  display:block;
  box-sizing:border-box;
  padding-right:50px;
}

.docu h1:after, .docu h2::after{
  position:absolute;
  content:'';
  right:15px;
  top:0px;
  height:100%;
  width:50px;
  background-image:url(skin/img/circle-button.svg);
  background-repeat:no-repeat;
  background-size:40px 40px;
  background-position:center;  
  transform:rotate(180deg);
  transition:all 250ms ease;
}

.docu h1.s-closed:after,
.docu h2.s-closed:after{
  transform:rotate(0deg);
}

.docu h1:hover, .docu h2:hover{
  text-decoration:underline;
}


/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/skin/fonts/S6u9w4BMUTPHh7USSwaPGR_p.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(/skin/fonts/S6u9w4BMUTPHh7USSwiPGQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/skin/fonts/S6uyw4BMUTPHjxAwXjeu.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/skin/fonts/S6uyw4BMUTPHjx4wXg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/skin/fonts/S6u9w4BMUTPHh6UVSwaPGR_p.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/skin/fonts/S6u9w4BMUTPHh6UVSwiPGQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(/skin/fonts/S6u9w4BMUTPHh50XSwaPGR_p.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url(/skin/fonts/S6u9w4BMUTPHh50XSwiPGQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}



/* 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+ */
}



.sk-main h2{
  font-family:var(--default-font);
  font-size:29px;
  font-weight:700;
  margin:0px;
  padding:calc( 4 * var(--default-margin) ) 0px calc( 4 * var(--default-margin) ) 0px;
  text-align:center;
}

@media all and ( max-width: 1024px ){
  .sk-main h2{
    font-size:21px;
    padding:calc( 2 * var(--default-margin) ) 0px calc( 2 * var(--default-margin) ) 0px;
  }
}

/************************************************************
  Slider main srch+slider
************************************************************/

::root{
  --slider-container-height:674px;
  --slider-height:670px;
}
.sk-search-over-cnt{
  position:relative;
  width:100%;
  height:var(--slider-container-height);
  max-height:calc(100vh - 104px);
  box-sizing:border-box;
  border-bottom:solid 4px var(--color-main-2);
}

@media all and ( max-width: 1024px ){    
  .sk-search-over-cnt{
    height:unset;
    float:left;
    border-bottom:solid 1px var(--color-main-1);
  }
}

/************************************************************
  Slider main
************************************************************/
@keyframes sk-main-anim-1 {
   20% { transform: rotate(-15deg); }
   40% { transform: rotate( 10deg); }
   60% { transform: rotate( -5deg); }
   80% { transform: rotate(  3deg); }
  100% { transform: rotate(  0deg); }
}

.sk-main-slider-cnt{
  width:100%;
  height:var(--slider-height);
  max-height:calc(100vh - 104px);
  position:relative;
}

.sk-main-slider-cnt .swiper-scrollbar{
  display:none;
}

.sk-main-slider{
  width:100%;
  height:var(--slider-height);
  max-height:calc(100vh - 104px);
  overflow:hidden;
}

.sk-main-slider [data-slide-tile]{
  width:100%;
  height:100%;
  max-height:calc(100vh - 104px);
  overflow:hidden;
  position:relative;
  float:left;
  display:block;
  cursor:pointer;
}

.sk-main-slider [data-slide-tile]>picture>img{
  height:100%;
  width:100%;
  object-fit: cover;
  transition:all 250ms ease;
}

.sk-main-slider [data-slide-tile]>div{
  position:absolute;
  left:50%;
  top:50%;
  transform: translateX(-50%) translateY(-50%);
  text-align:center;
}

.sk-main-slider [data-slide-tile]>div h2{
  font-size:67px;
  font-family: var(--default-font);
  margin:0px;
  padding:0px;
  border:0px;
  color:#fff;
  text-shadow: 1px 1px 4px #00000088;
  font-weight:400;
}

.sk-main-slider [data-slide-tile]>div h3{
  font-size:35px;
  font-family: var(--default-font);
  margin:0px;
  padding:0px;
  border:0px;
  color:#fff;
  text-shadow: 1px 1px 4px #000000;
}

.sk-main-slider [data-slide-tile]:hover div h2,
.sk-main-slider [data-slide-tile]:hover div h3
{
  text-shadow: 2px 2px 5px #000000;
}

.sk-main-slider [data-slide-tile]>div>span:hover{
  animation-name: sk-main-slider-buttons;
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 1;
}

#main-slider-next{
  display: block;    
  position: absolute;
  z-index: 1;
  right: 32px;
  top: calc(50% - 32px);  
  box-sizing:border-box;
  height: 64px;
  width: 64px;
  background-image: url(/skin/img/arrow-slider-right.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 64px 64px;
  cursor:pointer;
  border-radius:50%;
  transition:all 300ms easy;
}

#main-slider-prev{
  display: block;    
  position: absolute;
  z-index: 1;
  left: 32px;
  top: calc(50% - 32px);  
  box-sizing:border-box;
  height: 64px;
  width: 64px;
  background-image: url(/skin/img/arrow-slider-left.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 64px 64px;
  cursor:pointer;
  border-radius:50%;
  transition:all 300ms easy;
}


#main-slider-prev:hover, #main-slider-next:hover{
  background-color: var(--color-main-1);
}

@media all and ( max-width: 1024px ){
  .sk-main-slider-cnt{
    display:none;
  }
}

/************************************************************
  box-tiles
************************************************************/
.sk-main-box-tile-cnt{
  width:100%;
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  grid-gap:25px 25px;
}

.sk-main-box-tile{
  display:block;
  transition: all 250ms ease;
}

.sk-main-box-tile .image-wrapper{
  width:100%;
  height:340px;
  overflow:hidden;
}

.sk-main-box-tile .image-wrapper>img{
  height:100%;
  width:100%;
  object-fit:cover;
  transition: all 250ms ease;
}

.sk-main-box-tile .info-wrapper{
  padding:10px;
  text-align:center;
  width:100%;
}

.sk-main-box-tile h3{
  width:100%;
  padding:0px;
  margin:0px;
  font-size:18px;
  color:var(--text-color-general);
  font-weight:400;
  --text-overflow:ellipsis;
  --white-space: nowrap;
  --overflow:hidden;
}

.sk-main-box-tile:hover img{
  transform:scale(1.05);
}

.sk-main-box-tile:hover{
  background:var(--color-main-2);
}


@media all and ( max-width: 920px ){  
  .sk-main-box-tile-cnt{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media all and ( max-width: 480px ){
  .sk-main-box-tile-cnt{
    grid-template-columns:repeat(1, minmax(0, 1fr));
  }
}


/************************************************************
  box-promo
************************************************************/

.sk-main-box-bpw-offer-cnt{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  grid-gap:25px 25px;
}

.sk-main-box-bpw-offer{
  background:#fff;
  border:0px;
  padding:10px;
  box-sizing:border-box;
  position:relative;
  border-radius:var(--default-radius);
  border:solid 1px #eee;
  display:block;
  overflow:hidden;
  transition:all 300ms ease;
}

.sk-main-box-bpw-offer>.image-wrapper{
  width:100%;
  height:160px;
  overflow:hidden;
  border-radius:1px;  
}

.sk-main-box-bpw-offer>.image-wrapper>img{
  width:100%;
  height:100%;
  object-fit: cover;
  transition: all 250ms ease;
}

.sk-main-box-bpw-offer>.info-wrapper{
  color:var(--text-color-general);
  font-size:15px;
}

.sk-main-box-bpw-offer .offer-promo{
  position: absolute;
  left: 10px;
  top: 20px;
  padding: 5px;
  background: #FF3375;
  color: #fff;
  font-weight: 200;
}

.sk-main-box-bpw-offer .destination{
  margin-top:10px;
  display:block;
}

.sk-main-box-bpw-offer h3{
  font-size:16px;
  padding:5px 0px;
  width:100%;  
  overflow: hidden;
  text-overflow:ellipsis;
  white-space: nowrap;
  margin:0px;
}

.sk-main-box-bpw-offer .category{
  display:block;
}

.sk-main-box-bpw-offer .dates{
  display:block;
  margin-top:5px;
  padding-left:30px;
  background-position:left;
  background-repeat: no-repeat;
  background-size:16px 16px;
  background-image:url('/skin/img/ico-ofr-calendar.svg');
}

.sk-main-box-bpw-offer .transport{
  display:block;
  margin-top:1px;
  padding-left:30px;
  background-position:left;
  background-repeat: no-repeat;
  background-size:16px 16px;
}

.sk-main-box-bpw-offer .feeding{
  display:block;
  margin-top:1px;
  padding-left:30px;
  background-position:left;
  background-repeat: no-repeat;
  background-size:16px 16px;
  background-image:url('/skin/img/ico-ofr-meal.svg');
}

.sk-main-box-bpw-offer .price-cnt{
  width:100%;
  display:block;
  margin-top:10px;
}

.sk-main-box-bpw-offer .price{
  display:block;
  float:left;
  font-size:20px;
  font-weight:bold;
}

.sk-main-box-bpw-offer .btnMore{
  display:block;
  float:right;
  font-size:13px;
  padding:4px 11px;
  border-radius: var(--default-radius);
  background:var(--color-main-1);
  color:#fff;
  transition:all 250ms ease;
}

.sk-main-box-bpw-offer:hover{
  background: var(--color-main-2);
  border-color: var(--color-main-2);
}

.sk-main-box-bpw-offer .category img{
  transition:all 250ms ease;
}

.sk-main-box-bpw-offer:hover .category img{
  filter:brightness(2);
}

.sk-main-box-bpw-offer:hover .btnMore{
  background: var(--text-color-general);
}

.sk-main-box-bpw-offer:hover .image-wrapper>img{
  transform:scale(1.05);
}

@media all and ( max-width: 1024px ){
  .sk-main-box-bpw-offer-cnt{
    grid-template-columns:repeat(2, minmax(0, 1fr));  
  }
}

@media all and ( max-width: 640px ){
  .sk-main-box-bpw-offer-cnt{
    grid-template-columns:repeat(1, minmax(0, 1fr));
  }
}

/************************************************************
  box-user
************************************************************/

.sk-main-box-slu{
  display:block;
  width:100%;
  height:300px;
  overflow:hidden;
  position:relative;
  margin-top:calc( 4 * var(--default-margin) );
}

.sk-main-box-slu>img{
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  object-fit:cover;
}

.sk-main-box-slu>div>h2{
  color:#fff;
  font-size:52px;
  padding:0px;
}

.sk-main-box-slu>div>h3{
  color:#fff;
  font-size:23px;
  padding:0px;
  margin:0px;
}

.sk-main-box-slu>div{
  position:absolute;
  top:30px;
  left:0px;
  width:100%;
  text-align:center;  
}

.sk-main-box-slu>a{
  position:absolute;
  bottom:40px;
  left:50%;
  transform:translateX(-50%);
  padding:10px 20px;
  background:#00000033;
  color:#fff;
  cursor:pointer;
  font-size:16px;
  border-radius: var(--default-radius);
  transition:all 250ms ease;
}

.sk-main-box-slu>a:hover{
  background:#00000088;
}

@media all and ( max-width: 800px ){
  .sk-main-box-slu>div>h2{
    font-size:36px;
  }
  
  .sk-main-box-slu>div>h3{
    font-size:16px;
    margin-top:var(--default-margin);
  }
}


/************************************************************
  box-better
************************************************************/

.sk-main-box-better{
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1fr;  
}

.sk-main-box-better>div{
  width:100%;
  display:block;
}

.sk-main-box-better div>div{
  width:100%;
  text-align:center;
  box-sizing:border-box;
}

.sk-main-box-better div>div:nth-of-type(2){
  font-size:18px;
  color:#017C76;
  line-height: 1.1;
  margin-top:24px;
  padding:5px 0px;
  border-left:solid 1px #017C76;
}

.sk-main-box-better div:nth-of-type(4)>div:nth-of-type(2){
  border-right:solid 1px #017C76;
}

.sk-main-box-better div>div>img{
  height:60px;
  width:70px;
}

@media all and ( max-width: 960px ){  
  .sk-main-box-better{
    grid-gap:20px 0px;
    grid-template-columns:1fr 1fr;
  }
  
  .sk-main-box-better a:nth-of-type(2)>div:nth-of-type(2){
    border-right:solid 1px #017C76;
  }
}

@media all and ( max-width: 480px ){
  .sk-main-box-better{
    display:grid;
    grid-template-columns:1fr;
  }  
  .sk-main-box-better a>div:nth-of-type(2){
    border:none !important;
  }
}