* {
margin : 0;
padding : 0;
}
body {
background : #f8f8f6;
color : #444;
text-align : left;
font-family : Trebuchet MS, Helvetica, Verdana;
}
a {
text-decoration : none;
color : #333;
}
a:hover {
text-decoration : underline;
color : #333;
}
.przerwa {
clear : both;
background-color : #ccc;
height : 1px;
width : 100%;
}
#strona {
position : relative;
z-index : 1;
width : 940px;
margin : 0 auto;
}
#likeboxy {
height: 25px;
float : right;
margin : 10px -10px -10px 0;
width : 320px;
list-style : none;
}
#likeboxy li {
float : left;
text-align: right;
width: 95px;
margin-right : 10px;
}
#zawartosc {
position : inherit;
background-color : #fff;
padding : 20px;
margin-top : 30px;
}
#kupon {
float : right;
margin-top : 30px;
}
#menu {
position : relative;
clear : both;
top : 10px;
background : url('images/menu.png');
list-style : none;
height : 41px;
width : 940px;
}
#menu li {
background : url('images/divider.png') repeat-y right;
float : left;
height : 41px;
line-height : 41px;
font-weight : bold;
font-size : 14px;
}
#menu li:last-child{
background: none;
}
#menu li a {
color : #fff;
text-decoration : none;
padding : 11px 21px 12px 22px;
}
#menu li a:hover, #menu li a:active {
text-decoration : none;
background : url('images/menu_tlo.png') repeat-x;
}
#top {
margin : 30px 0 -10px 0;
}
#top ul {
list-style : none;
height : 370px;
}
#top ul li {
height : 370px;
}
#controls {
list-style : none;
position : absolute;
top : 515px;
right : 5px;
}
#controls li {
font-size : 11px;
font-weight : bold;
border : #666 solid 1px;
float : left;
margin : 0 5px 0 5px;
background : #fff;
padding : 2px 6px;
}
#controls li.current {
background : #ccc;
color : #fff;
}
#powitanie {
background : #f7f6f2;
width : 540px;
border : #ddd solid 1px;
padding : 18px;
margin : 40px 10px 10px 0;
float : left;
}
.belkobox {
float : left;
width : 100%;
margin : -50px 0 -20px 0;
}
.belkobox img {
float : left;
margin : 10px;
}
.belkobox h2 {
color : #333;
line-height : 52px;
margin : 0;
padding : 0;
width: 100%;
}
.belkobox h2 small {
position: absolute;
top: 25px;   
left: 250px;     
width: 100%;
font-size: 12px;
color: #666;
}
.belkobox h3 {
color : #333;
line-height : 32px;
margin : 0;
padding-top: 10px;
width: 100%;
}
.cena {
text-align : right;
font-size : 20px;
}
.cena small {
font-size : 12px;
}
.ramka {
border : #ddd solid 1px;
padding : 20px;
margin : 0 15px 0 15px;
float : left;
}
.facebook {
float : right;
width : 300px;
margin-top: 40px;
border : #ddd solid 1px;
}

#galeria {
text-align: center;
vertical-align: middle;
margin : 10px 0 20px 20px;
width: 850px;
align-items: center;
justify-content: center;
}

#galeria img {
margin : 20px;
border : #ccc solid 3px;
height: 150px;
display: inline-block;
}

#slider {
width : 450px;
height : 296px;
position : relative;
overflow : hidden;
}
#slider img {
position : absolute;
top : 0;
height : 0;
z-index : 0;
width : 450px;
height : 296px;
}
#slider img:first-child {
z-index : 1;
}
textarea {
padding : 5px;
font-size : 16px;
height : 250px;
width : 530px;
}
input {
padding : 5px;
}
input[type="submit"] {
float : right;
margin : 10px 10px 0 0;
}
.pomyslnie {
background : #ccff99;
padding : 10px;
margin : 10px 0 10px 0;
border : green solid 1px;
}
.blad {
background : #ffcccc;
padding : 10px;
margin : 10px 0 10px 0;
border : red solid 1px;
}
#partnerzy {
list-style : none;
width : 900px;
height : 90px;
margin-top : 20px;
}
#menudolne {
font-size : 13px;
text-align : center;
list-style-type : none;
}
#menudolne li:first-child {
margin-left : 45px;
}
#menudolne li {
float : left;
margin : 40px 0 100px 0;
padding : 0 20px 0 20px;
}
#stopka {
clear : both;
font-size : 13px;
color : #888;
padding : 20px 0 40px 0;
}
.simply-scroll-container {
position : relative;
}
.simply-scroll-clip {
position : relative;
overflow : hidden;
}
.simply-scroll-list {
overflow : hidden;
margin : 0;
padding : 0;
list-style : none;
}
.simply-scroll-list li {
padding : 0;
margin : 0;
list-style : none;
}
.simply-scroll-list li img {
border : none;
display : block;
}
.simply-scroll {
width : 900px;
height : 100px;
}
.simply-scroll .simply-scroll-clip {
width : 900px;
height : 100px;
}
.simply-scroll .simply-scroll-list li {
float : left;
width : 200px;
height : 100px;
}

#cennik{
width: 861px;
margin-top: 10px;
border-bottom: 3px solid grey;
overflow: hidden;
}

#cennik li{
float: left;
display: block;
padding-top: 5px;
border: 1px solid grey;
font-size: 13px;
padding: 7px 13px 7px 13px;
margin: 0 9px 0 0;
}

#cennik li:first-child{
padding-left: 15px;
}

#cennik li:last-child{
margin: 0;
padding-right: 15px;
}

#cennik li.active{
background-color: #888;
}

#cennik li.active a{
font-weight: bold;
color: #fff;
}

#paznokcie {
position: fixed;
z-index: 666;
margin-top: 100px;
background-image: url("images/paznokcie.png"); 
width: 200px; 
padding-left: 60px;
height: 295px;
padding-top: 5px;
right: -210px;
font-size: 13px;
}

#menu-zabiegi {
    position: relative; /* Umożliwia pozycjonowanie dymka względem tego elementu */
}

#menu-zabiegi::after {
    content: "HeadSpa Nowość!"; /* Treść dymka */
    position: absolute;
    top: -10px; /* Przesunięcie w górę, aby był nad menu */
    right: 5px; /* Pozycja od prawej krawędzi elementu li */
    
    /* Style wizualne dymka */
    background-color: #dc3545; /* Kolor tła (czerwony) */
    color: #fff; /* Kolor tekstu (biały) */
    font-size: 8px;
    font-weight: bold;
    padding: 3px 6px;
    border-radius: 3px;
    line-height: 1;
    z-index: 10; /* Upewnienie się, że jest nad innymi elementami */
    
    /* Lekkie obrócenie, dla efektu "przyklejonej" etykiety */
    transform: rotate(5deg);
}