body,html { margin: 0; padding: 0; background-color: #1a1a1a; width: 100%; height: 100%; }
body { font-family: 'Lato'; font-size: 14px; min-width: 1280px;  }

.clear { clear: both; }

.back-to-top       { position: fixed; bottom: 25px; right: 0px; text-decoration: none; background-color: #ce3523; font-size: 110%; padding: 0px 10px; display: none; z-index: 99; color: white; font-size: 300%; }
.back-to-top:hover { background-color: #f2bf06; }

.pad30 { padding: 30px; }


.button { display: inline-block; padding: 10px 25px; font-size: 140%; text-align: center; text-decoration: none; outline: none; color: #fff; background-color: #cd3223; border: none; border-radius: 15px; }
.button:hover { background-color: #dd4637; }


a.banner10:link,
a.banner10:visited { width: 400px; height: 125px; position: absolute; right: 0; top: 175px; z-index: 10; 
background-image: url("6grudnia2023.jpg"); background-repeat: no-repeat; background-size: cover; }

.section { position: relative; border-top: 1px solid #ce3523; text-align: center; }

#header  { width: 100%; height: 40%; overflow: hidden; position: relative; text-align: left; }

#header1 { width: 100%; height: 50%; overflow: hidden; position: absolute; margin-top: 14.5%; border-top: 2px solid #ce3523; border-bottom: 2px solid #ce3523; z-index: 1  }
#header1 img { width: 100%; position: absolute; margin: auto; top: 0; left: 0; right: 0; bottom: 0; }
#triangle1 { width: 0; height: 0; position: absolute; border-top: 3820px solid black; border-right: 3820px solid transparent;  top: 0; left: 50%; margin-left: -3500px; opacity: 0.7; z-index: 2; }

#logo { position: absolute; width: 285px; height: 195px; z-index: 3; top: 0; left: 0; right: 0; bottom: 0; margin: auto; overflow: hidden; }
#logo img { width: 100%; }

#logo1 { position: absolute; width: 285px; height: 195px; z-index: 3; top: 0; left: 0; right: 0; bottom: 0; margin: auto; overflow: hidden; }
#logo1 img {  }

#logo1a { position: absolute; z-index: 1; width: 80%; margin-left: 10%; }
#logo1b { position: absolute; z-index: 2; bottom: 0; width: 100%; }

#tagline { position: absolute; border-bottom: 2px solid #ce3523; color: white; font-size: 200%; padding: 10px 25px; padding-left: 130px; left: 0px; top: 50px; font-style: italic; z-index: 3; }
#tagline2 { position: absolute; background-color: #ce3523; color: white; font-size: 200%; padding: 10px 25px; padding-left: 150px; left: 0px; top: 390px; font-style: italic; z-index: 2 }

#tagline span { display: inline-block; vertical-align: middle; }

#menu { position: absolute; bottom: 75px; width: 100%; text-align: center; z-index: 2; border: 1px solid #ce3523; border-left: 0; border-right: 0; border-top: 0; }
#menu ul { list-style-type: none; margin: 0; padding: 0px; }
#menu li { display: inline-block; }
#menu a:link,
#menu a:visited { text-decoration: none; color: white; padding: 5px 35px 8px 35px; font-size: 150%; display: inline-block; }
#menu a:hover,
#menu a.activ { background-color: #ce3523; }

#menu.fixx, #menu.test { position: fixed; top: 0; background-color: black; bottom: auto; padding-top: 0px; z-index: 5; overflow: hidden; height: 38px }
#menu.fixx a { font-size: 120%; padding: 5px 4px 8px 4px; }

#menu.fixx:hover { height: auto; }

.topmenu { display: none; }

a#info:link,
a#info:visited    { position: absolute; right: 0px; top: 300px; background-color: #ce3523; color: white; padding: 10px 30px; z-index: 3; width: 325px; display: block; text-decoration: none; font-size: 110%; }
a#info:hover      { background-color: #f2bf06; }


.banner-sylwester a:link,
.banner-sylwester a:visited { text-decoration: none; border: 2px solid #3e3e3e; display: inline-block; }
.banner-sylwester a:hover   { border: 2px solid #ce3523; }

#menu2 { position: fixed; top: 0; background-color: black; z-index: 5; overflow: hidden; width: 100%; border: 1px solid #ce3523; border-left: 0; border-right: 0; border-top: 0;  }
#menu2 ul { list-style-type: none; margin: 0; padding: 0; }
#menu2 li { display: block; text-align: center; }
#menu2 a:link,
#menu2 a:visited { text-decoration: none; color: white; padding: 7px 6px 10px 6px; font-size: 400%; display: block; text-align: center; }
#menu2 a:hover,
#menu2 a.activ { background-color: #ce3523; }

.hov1 { height: 100px; }
.hov2 { height: auto; }

a#homelink:link,
a#homelink:visited { position: absolute; left: 0; top: 0; padding: 8px 15px 9px 15px; background-color: #ce3523 }
a#homelink:hover   { background-color: #d9ab05; }

a#menuswitch:link,
a#menuswitch:visited { display: inline-block; clear: both; padding: 8px 15px 9px 15px; }

a.baner3:link,
a.baner3:visited { width: 800px; height: 100px; display: block; margin: 0px auto; z-index: 10; border: 1px solid #d1300b; background-image: url(sylwester2026.jpg); }


a#back:link,
a#back:visited { text-decoration: none; display: inline-block; position: fixed; bottom: 10px; left: 10px; background-color: green; color: white; padding: 5px 15px; font-size: 180%; z-index: 10; vertical-align: middle; }

#fon { position: absolute; right: 45px; top: 25px; width: 315px; height: 115px; z-index: 3; }
#fonicon { position: absolute; width: 60px; height: 60px; left: 15px; top: 20px; }
#fonicon img { position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; }
#fonum   { position: absolute; right: 0; top: 15px; }

#fon a:link,
#fon a:visited { text-decoration: none; color: white; text-align: center; display: block; position: absolute; width: 150px; bottom: 0; left: 0; right: 0; margin: 0px auto; z-index: 2; }
#fon a:hover   { border-bottom: 1px dashed; }

#godziny { color: white; position:  absolute; z-index: 2; top: 200px; left: 25px; font-style: italic; }
#godziny2 { position: fixed; bottom: 0px; width: 100%; background-color: #ce3523; color: white; text-align: center; padding: 5px; z-index: 2 }

#fejs { position: absolute; top: 50px; left: 450px; z-index: 333; }
#fejs iframe { border:none; overflow:hidden; width:100px; height:65px; }

a.fblink:link,
a.fblink:visited { display: inline-block; padding: 5px 20px; background-color: #0968fd; color: white; text-decoration: none; border-radius: 5px; text-transform: uppercase; font-weight: bold; font-size: 14px; margin-left: 15px; vertical-align: middle; }
a.fblink:hover   { background-color: #2f7ffd; color: white; }
a.fblink i { background-color: white; color: #0968fd; border: 2px solid white; border-radius: 15px; width: 15px; height: 15px; text-align: center; padding: 1px 1px 0px 1px; font-size: 130%; display: inline-block;  vertical-align: middle; }
a.fblink span { display: inline-block; vertical-align: middle; }

.banner1 { width: 80%; height: 135px; margin: 0px auto; padding: 25px; max-width: 1110px; background-image: url(images/banner6grudnia2017.jpg); background-position: center; position: relative; overflow: hidden; z-index: 1; }

.renifer { position: absolute; width: 181px; height: 185px; left: 200px; top: 0px; }

.calendar { width: 100px; height: 135px; background-image: url(images/calendar1.png); background-repeat: no-repeat; color: white; position: relative; z-index: 2 }
.calendar .day { font-size: 450%; font-weight: bold; position: absolute; top: 16%; width: 100%; text-align: center; }
.calendar .mon { font-size: 140%; text-align: center; position: absolute; bottom: 0; width: 100%; font-weight: bold; }

.banner1 .triangle { width: 0; height: 0; position: absolute; border-top: 300px solid black; border-right: 250px solid transparent;  top: 0; left: 0; opacity: 0.7; z-index: 1; }
.banner1 .title    { font-size: 180%; background-color: black; color: white; position: absolute; right: 0; top: 50px; padding: 25px; padding-right: 275px; opacity: 0.8; border-bottom: 2px solid #ce3523; }
.banner1 .promo    { position: absolute; background-color: #ce3523; color: white; right: 35px; top: 35px; font-size: 500%; padding: 15px; }

a.box:link,
a.box:visited  { width: 28%; margin: 3% 1.5% 1.5% 3%; background-color: black; min-height: 220px; float: left; overflow: hidden; position: relative; display: block; border: 2px solid #1a1a1a; border-bottom: 1px solid #1a1a1a;  }
a.box:hover    { border: 2px solid #ce3523; border-bottom: 1px solid #ce3523; }

.box .imag     { position: absolute; bottom: 0; right: 0; } 
.box .imag img { width: 130%; }
.box .title    { position: absolute; color: white; padding: 5px 15px; padding-left: 30px; margin-top: 25px; font-size: 140%; z-index: 2; background-color: #ce3523; }
.box .desc     { position: absolute; bottom: 0; background-color: #1a1a1a; color: white; width: 100%; padding: 12px 20px; z-index: 2; font-style: italic; border-bottom: 1px solid #ce3523; text-align: left; }
.box .triangle { width: 0; height: 0; position: absolute; border-top: 180px solid black; border-right: 200px solid transparent;  top: 0; left: 0; opacity: 0.7; z-index: 1; }

a.box.wider   { width: 44.5% }
a.box.wider .title { padding-left: 50px; }
a.box.wider .imag  { bottom: 0; right: 0; }

h1 { background-color: #ce3523; color: white; text-align: center; display: inline-block; margin: 0px auto; padding: 10px 35px; }
h2 { margin-top: 25px; margin-bottom: 0px; text-align: left; }

.box2 { width: 22%; background-color: #ce3523; color: white; padding: 30px; float: left; margin: 3% 1.5% 1.5% 3%;   }

.box3 { border: 1px solid #ce3523; width: 26%; color: white; margin: 3%; float: left; font-size: 140%; text-align: center; }
.box3 .inner { padding: 15px 0px; }
.box3 .fa { font-size: 200%; vertical-align: middle; padding-right: 15px; }

.col30 { display: inline-block; vertical-align: middle; padding: 0px 5px; }

.content { max-width: 1024px; margin: 0px auto; color: white; }
.col40 { width: 40%; float: left; }
.col50 { width: 50%; float: left; }
.col60 { width: 60%; float: left; }

.onas { padding: 50px 30px 75px 30px; font-size: 80%; line-height: 130%; z-index: 2; position: relative; }

.karta { color: white; width: 100%; text-align: left; }
.karta td { padding: 6px 15px; font-size: 120%; }

.karta .num  { background-color: #ce3523; width: 30px }
.karta .nejm { color: #ce3523; width: 145px; }
.karta .desc { font-style: italic; font-size: 110%; color: #dadada;}
.karta .sajz { background-color: #ce3523; text-align: right; }
.karta .price { min-width: 45px; text-align: right; }

.karta tr:nth-child(even) { background-color: #2a2a2a; }
.karta tr   { background-color: #1a1a1a; }

.karta-head  { height: 300px; overflow: hidden; position: relative; }
.karta-title { background-color: #ce3523; color: white; padding: 10px 30px; padding-left: 100px; position: absolute; font-size: 200%; top: 100px; z-index: 2 }
.karta-imag  { position: absolute; overflow: hidden; width: 100%; top: 0px;}
.karta-triangle { width: 0; height: 0; position: absolute; border-top: 300px solid black; border-right: 350px solid transparent;  top: 0; left: 0; opacity: 0.7; z-index: 1; }
.karta-imag img { width: 100%; }

.karta tr:hover { background-color: #4e5e00 }

.niu { background-color: #a1bc1e; color: white; padding: 3px 10px; font-size: 80%; display: inline; vertical-align: middle;     -moz-border-radius: 210px; -webkit-border-radius: 210px; -khtml-border-radius: 210px; border-radius: 10px; margin-right: 10px;}
.hot { width: 25px; height: 25px; display: inline-block; vertical-align: middle; }
.hot img { width: 100%; }


form label                 { display: block; padding: 3px }
form label span.label      { display: inline-block; width: 100px; }
.wpcf7-form-control-wrap input[type="text"] { padding: 3px 10px; width: 60% }
.wpcf7-form  br { display: none; }
.wpcf7-mail-sent-ok { background-color: #398f14; color: white; }

input[type="submit"] { background-color: #ce3523; color: white; border: 0; padding: 5px 20px; margin-top: 7px; font-size: 100%; }

#kontakt { }
#kontakt input[type="text"],
#kontakt input[type="email"]  { font-size: 120%; background-color: #aaaaaa; border: none; padding: 10px 15px; width: 90%; display: block; margin-top: 13px; }
#kontakt textarea             { font-size: 120%; background-color: #aaaaaa; border: none; padding: 10px 15px; width: 100%; height: 132px; margin-top: 10px; font-family: Arial; }

input[type="text"]:focus,
textarea:focus {
    outline: none !important;
    border: 2px solid #ce3523;
    box-shadow: 0 0 30px #ce3523;
}


#mapa { padding: 0px; height: 400px; width: 100%;  }
#gmap { width: 100%; height: 100%; }


@media screen and (min-width: 1023px){
   #header  { height: 100%; }
   #header1 { margin-top: 13.5%; }
   #menu2 { text-align: center; }
   #menu2 ul {  padding-left: 50px; }
   #menu2 li { display: inline-block; }

#menu2 a:link,
#menu2 a:visited { font-size: 120%; }

   a#menuswitch:link,
   a#menuswitch:visited { display: none; }

.hov1 { height: 38px; }

   .box .imag img { width: 100%; }

   .box3 { border: 1px solid #ce3523; width: 26%; color: white; margin: 3%; float: left; font-size: 160%; text-align: center; }
   .box3 .fa { font-size: 300%; vertical-align: middle; padding-right: 15px; }

   .onas { font-size: 160%; }
}