*:focus {
outline: none;
}
@font-face
{
font-family: smolna;
src: url('../css/SMOLNA.TTF');
}
@font-face
{
font-family: komix;
src: url('../css/Komix.ttf');
}
@font-face {
font-family: komix-pl;
src: url('http://cmistrz.com/fonts/komix.ttf');
}
html, body {
        height: 100%;
}

body {
    margin: 0;
    padding: 0;
    background: #080808 url('/images/background4.webp') no-repeat center center;
    background-size: cover;
	background-attachment: fixed;
    font-family: 'Open Sans', sans-serif;
    font-size: 13px;
    color: #0066FF;
}


a {
        color: #0000FF;
        text-decoration: none
}

a:hover {
        text-decoration: none;
}

a img {
        border: none;
}

img.border {
}

img.alignleft {
        float: left;
}

img.alignright {
        float: right;
}

img.aligncenter {
        margin: 0px auto;
}



/** WRAPPER */

#wrapper {
}
.container {
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
	
}

.clearfix {
        clear: both;
}


/** HEADER */

#header {
        overflow: hidden;
        width: 950px;
        height: 70px;
        padding: 20px 0px 20px 0px;
        background-color: rgba(0, 1, 0, 0.5); /* Czarny z przezroczystością 50% */
}

/* header top info */
#headertopinfo {
        overflow: hidden;
        width: 1000px;
       /* height: 100px; */
        padding: 0px 0px;
		background-color: rgba(0, 0, 0, 0.5); /* Czarny z przezroczystością 50% */
        

}
#topinfo {
        float: right;
        width: 100px;
        height: 20px;
padding: 5px 0px;
}

/* LOGOWANIE */
#form_log 
{
        float: left;
        width: 550px;
        height: 50px;
padding: 5px 0px;
}
#form_log input
{
 margin-top:1px;
 border:solid 1px #aacfe4;
}
#form_log label 
{
#        width: 150px;
 font-weight:bold;
 text-align:left;
 color: #B6B6B6;
}
#textlabel
{
 font-weight:bold;
        float: left;
        width: 550px;
        height: 20px;
        padding: 0px 0px 0px 40px;
        font-size: 1em;
 color: #B6B6B6;
position: absolute;
z-index: 99;
}
#textlabel login
{
	font-weight:bold;
	text-transform: capitalize;
	color:magenta;
}

#textlabel a {
        text-decoration: none;
        font-family: 'Archivo Narrow', sans-serif;
        font-size: 1em;
        font-weight: 600;
        color: #B6B6B6;
z-index: 99;
}
#textlabel a:active
{
        background: #0091E6;
        color: #FFFFFF;
}

#textlabel a:hover {
        background: #0091E6;
        color: #9966FF;
        text-decoration: none;
}


#submit
{
 background-color: #0048e6 ;
# width: 85px;
 height: 25px;
 border: 0;
 border-radius: 5px 5px 5px 5px;
 color: #B6B6B6;
 font-weight:bold;
}

/* ### logowanie 2 ### */

#logowanie
{
 #       float: left;
#padding: 5px 0px;

}
#logowanie label
{
        width: 250px;
}


/* # LOGO */
#logo {
    float: left;
    width: 300px;
    height: 40px;
    padding: 20px 0;
    background-color: rgba(0, 0, 0, 0.5); /* Czarny z przezroczystością 50% */
    color: white; /* Kolor tekstu, aby był widoczny na ciemnym tle */
}


#logo h1, #logo p {
        margin: 0px;
        line-height: normal;
       font-size: 1.9em;
font-family: komix;
}
#logo h1 a {
        display: block;
        line-height: 40px;
        text-transform: uppercase;
        text-decoration: none;
#       font-family: 'Archivo Narrow', sans-serif;
font-family: komix;

        font-size: 1.9em;
        color: #FFFFFF;

}

/** MENU */

#menu {
        float: right;
        width: 450px;
        height: 80px;
}

#menu ul {
        float: right;
        margin: 0px;
        padding: 20px 0px 0px 0px;
        list-style: none;
        line-height: normal;
}

#menu li {
        float: left;
        margin-left: 1em;
}
#menu a {
        display: block;
        padding: 15px 5px;
        letter-spacing: 2px;
        text-decoration: none;
        text-transform: uppercase;
        font-family: 'Archivo Narrow', sans-serif;
        font-size: 1.10em;
        font-weight: 600;
        color: #B6B6B6;
}
#menu .active
{
        background: #0048e6;
        border-radius: 5px;
        color: #000000;
}
#menu .unactive
{
        background: #0048e6;
        border-radius: 5px;
        color: #000000;
}

.activee
{
        background: #0098E6;
        border-radius: 5px;
        color: #000000;
}

#menu a:activee
{
        background: #0091E6;
        border-radius: 5px;
        color: #FFFFFF;
}

#menu a:hover {
        background: #0091E6;
        border-radius: 5px;
        color: #FFFFFF;
        text-decoration: none;

}
#menu a:focus {
        background: #0091E6;
        border-radius: 5px;
        color: #FFFFFF;
        text-decoration: none;

}

/** PAGE */
 
#page {
        overflow: hidden;
        width: 1000px;
        padding: 50px 50px 10px 10px;
        background-color: #F0FFF0;
        border-radius: 10px 10px 0px 0px;
	color: 000000;
}

#page h2
{
        margin-bottom: 0px;
}


/** CONTENT */

#righttable {
        float: right;
        width: 700px;
		padding-bottom: 30px;
        padding-top: 30px;
        border-bottom: 1px solid #D4D4D4;
        border-top: 1px solid #D4D4D4;
}
 
#righttable #onecolumn
{
    overflow-wrap: break-word; /* Zawija długie słowa, aby uniknąć wychodzenia poza kontener */
    word-wrap: break-word; /* Stare właściwości, które mogą być używane równocześnie z overflow-wrap */
    hyphens: auto; /* Automatyczne dzielenie słów, jeśli to możliwe */
}

#table_data 
{
            overflow-x: auto; /* Dodaje poziomy scrollbar */
            white-space: nowrap; /* Zapobiega łamaniu linii */
        }

#righttable p
{
        margin-bottom: 30px; /* Zwiększa odstęp poniżej akapitu */
		line-height: 1.5; /* Zwiększa wysokość linii dla lepszej czytelności */

}

#righttable h2
{
        letter-spacing: -1px;
        font-size: 3em;
		color: #0048e6;
}

#righttable ul
{
            list-style-type: none;
            padding: 0;
}
#righttable li
{
            padding: 10px 0;
            border-bottom: 1px solid #ddd;
			line-height: 1.5; /* Zwiększa wysokość linii dla lepszej czytelności */
}


#two-column
{
        padding-top: 50px;
}
.box-content
{
        overflow: hidden;
        margin-bottom: 4em;
}

.box-content p
{
        padding-left: 60px;
}
/** left table menu */


#lefttable {
    float: left;
    width: 230px; /* Dostosuj szerokość */
    padding-top: 1px;

}

#lefttable #menu_left_box {
    margin-bottom: 10px;
    padding: 0;

}

#menu_left {
    width: 100%; /* Dostosuj szerokość */
}

#menu_left .zakladka {
    background-color: red;
    background: #000000;
    font: 1.0em Verdana, Geneva, sans-serif;
    color: #ed4949;
    padding: 2px 12px 0px;
    margin: 0px;
    width: 210px;
    height: 30px;
	text-align: center;
	/* border-radius: 100px 100px 0px 0px; */
}

#menu_left ul {
    background: #690305;
    padding: 3px 5px 5px 5px;
    margin: -3px 0px 0px 0px;
}

#menu_left ul li {
    background: #930306;
    border-bottom: solid 1px #b10e0e;
    list-style: none;
    display: block;
    height: 14px;
    width: 100%;
    padding: 5px 5px 5px 5px;
    margin-bottom: 1px;
	}

#menu_left ul li a {
    display: block;
    font-size: 0.8em;
    color: #dad5d5;
    text-decoration: none;
}













/* Link Style 1 */

.link-style {
        display: inline-block;
        margin-top: 10px;
        padding: 5px 15px;
        background: #0091E6;
        border-radius: 5px;
        letter-spacing: 1px;
        text-decoration: none;
        text-transform: uppercase;
        color: #FFFFFF;
}


/* List Style 1 */

.list-style1 {
        margin: 0px;
        padding: 0px;
        list-style: none;
}

.list-style1 li {
        padding: 20px 0px 20px 0px;
        border-top: 1px solid #D4D4D4;
}

.list-style1 .date {
        font-weight: bold;
        color: #212121;
}
.list-style1 .first {
        padding-top: 0px;
        border-top: none;
}
ul.style1
{
        margin: 0px;
        padding: 0px;
        list-style: none;
}

ul.style1 li
{
        padding: 10px 0px 20px 0px;
        border-top: 1px solid #242424;
}
 
ul.style1 a
{
        color: #4E4E4E;
}

ul.style1 .first
{
        padding-top: 0px;
        border-top: none;
}

ul.style2
{
        margin: 30px 0px 0px 0px;
        padding: 0px;
        list-style: none;
}
ul.style2 li
{
        float: left;
        margin-right: 10px;
}



/** stopka */
#footer {
    overflow: hidden;
    width: 1000px;
    padding: 0px 0px 10px 0px;
    background-color: #161616;
    border-radius: 0px 0px 40px 40px;
    border-color: rgb(201, 76, 76);
    min-height: 30px; /* Minimalna wysokość */
    display: flex;
    justify-content: center; /* Wyśrodkowanie elementów w poziomie */
}

#footer #footer1,
#footer #footer2,
#footer #footer3 {
	display: flex;
    justify-content: center;
    align-items: center;
    width: 310px;
    margin: 5px;
    padding: 5px;
    min-height: 100px; /* Minimalna wysokość */
    background-color: #3344FF;
    border-radius: 120px; /* Ustawienie zaokrąglenia */
}

#footer h2 {
    font-weight: 100px;
    color: #D3D3D3;
}

#footer p {
    color: #4E4E4E;
}
/* liczniki */
#liczniki {
    display: inline-block; /* Sprawia, że szerokość tła dopasowuje się do zawartości */
    padding: 10px; /* Dodaje 10 pikseli przestrzeni wewnętrznej wokół tekstu */
    background-color: rgba(0, 0, 0, 0.5); /* Czarny z przezroczystością 50% */
    
}


/* #copyright */
#copyright
{
        overflow: hidden;
        width: 720px;
        padding: 10px;
        background-color: #101010;
	color: FFFFFF;
	border-radius: 5px 5px 25px 25px;

}

#copyright p
{
        text-align: center;
        text-shadow: 1px 1px 1px rgba(0,0,0,1);
}

#copyright a
{  
        color: #4E4E4E;
}




#stopka
{
        overflow: hidden;
        width: 820px;
        padding: 10px;
        background-color: #161616;
        color: FFFFFF;
        border-radius: 5px 5px 5px 5px;

}

#stopka p
{
        text-align: center;
        text-shadow: 1px 1px 1px rgba(0,0,0,1);
}

#stopka02 {
display: inline; 
#padding: 0px; 
float: left; 
font-family: Arial, Helvetica, sans-serif; 
font-size: 12px; 
color: #000083; 
background-color: #3391ff;
text-align:center; 
width: 100px;
margin-left: 90px; 
#margin-right: auto;
}
#stopka03 {
float: left;
 color: #333; 
padding: 0px; 
width: 100px; 
display: inline; 
position: relative; 
margin-left: auto;
margin-right: auto; 
background: #aaffff;
}
#stopka04 {
display: inline; 
position: relative; 
float: left; 
font-family: Arial, Helvetica, sans-serif; 
font-size: 12px; 
color: #000083; 
background-color: #3391ff; 
text-align:center; 
width: 100px;
margin-left: auto; 
margin-right: auto;
}
#stopka05 { 
display: inline; 
position: relative; 
color: #333; 
width: 380px; 
float: left; 
margin-left: auto; 
margin-right: auto; 
background: #aaffff;
}


#stopka_browser
{
        overflow: hidden;
        width: 820px;
        padding: 10px;
        background-color: #161616;
        color: FFFFFF;
        border-radius: 5px 5px 5px 5px;

}
.stopka2_browser 
{ 
font-family: "Comic Sans MS", Arial, Helvetica, sans-serif; 
font-size: 12px; 
color: #0066FF; 
#background: #161111;
margin-left: auto;
margin-right: auto;
text-align:center;

}
.opis_browser 
{ 
font-family: Arial, Helvetica, sans-serif; 
font-size: 12px; 
color: #000083; 
background: #aaaaaa; 
text-align:center;
width: 700px; 
margin-left: auto; 
margin-right: auto;
}



#button like site
/* Stylizacja przycisku */
.button-likesite {
    display: inline-block;
    padding: 10px 20px;
    background-color: #4CAF50;
    color: white;
    text-align: center;
    text-decoration: none;
    font-size: 16px;
    border-radius: 5px;
    cursor: pointer;
}

/* Stylizacja przycisku po najechaniu myszką */
.button-likesite:hover {
    background-color: #45a049;
}





/* Styl dla ramki 3D */
.table-3d {
    border-collapse: separate;
    border-spacing: 0;
}
.table-3d th,
.table-3d td {
    border: 1px solid #dddddd;
    border-left: 2px solid #dddddd;
    border-top: 2px solid #dddddd;
    padding: 8px;
    color: white; /* Kolor tekstu */
}
.table-3d th:first-child,
.table-3d td:first-child {
    border-left: none;
}
.table-3d th:last-child,
.table-3d td:last-child {
    border-right: 2px solid #dddddd;
}
.table-3d th:first-child,
.table-3d th:last-child,
.table-3d td:first-child,
.table-3d td:last-child {
    border-top: none;
}
.table-3d thead th {
    border-top: 2px solid #dddddd;
    border-bottom: 2px solid #dddddd;
    background: linear-gradient(to right, #f0c14b, #e8a317); /* Dodanie gradientu tła */
    color: white; /* Zmiana koloru tekstu na biały */
}

/* Styl dla co drugiego wiersza - nieparzyste ID */
.table-3d tbody tr:nth-child(odd) {
    background-color: #555; /* ciemnoszary */
}

/* Styl dla co drugiego wiersza - parzyste ID */
.table-3d tbody tr:nth-child(even) {
    background-color: #666; /* ciemnoszary, nieco jaśniejszy */
}







/* obsługa ciasteczek */
.cookie-consent {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
    padding: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 1000;
}

.cookie-message {
    display: flex;
    flex-direction: column;
}

.cookie-button {
    background-color: #0066FF;
    border: none;
    padding: 10px 20px;
    margin: 5px;
    color: white;
    cursor: pointer;
}

.cookie-button:hover {
    background-color: #0057cc;
}

.hidden {
    display: none;
}
/* koniec obsługi ciasteczek */





/* CSS dla edytora */

#editor-container {
    display: flex; /* Definiuje kontener jako flexbox */
    justify-content: center; /* Opcjonalnie wyrównuje wszystkie elementy do środka kontenera */
    align-items: flex-start; /* Wyrównuje elementy do góry */
    width: 100%; /* Pełna szerokość */
    padding: 20px; /* Opcjonalne marginesy wewnętrzne */
    gap: 20px; /* Dodaje odstęp między elementami */
}

#editor {
    display: flex; /* Ustawienie jako flexbox */
    flex-direction: column; /* Ustawia elementy jeden pod drugim */
    width: auto; /* Szerokość okna edycji */
    padding: 20px;
    border: 1px solid #ddd;
    background-color: #f9f9f9;
    flex-grow: 1;
}

#menu_select {
    width: 100%; /* Ustawiłem na 100% szerokości elementu nadrzędnego */
    margin-bottom: 10px;
}

#menu_formatowanie_tekstu {
    width: 100%; /* Ustawiłem na 100% szerokości elementu nadrzędnego */
    margin-bottom: 10px;
}

#menu_opis {
    width: 100%;
    margin-bottom: 10px;
}

#save_button {
    margin-left: auto; /* Przesuwa przycisk do prawej strony w obrębie flex kontenera */
    margin-top: 10px; /* Odstęp nad przyciskiem */
    padding: 10px 20px; /* Marginesy przycisku */
    background-color: #28a745; /* Kolor przycisku */
    color: white; /* Kolor tekstu */
    border: none; /* Brak ramki */
    border-radius: 5px; /* Zaokrąglone rogi */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); /* Efekt 3D */
    cursor: pointer; /* Wskaźnik myszy */
    transition: all 0.3s ease; /* Płynne przejścia */
}

#save_button:hover {
    background-color: #218838; /* Zmiana koloru przycisku na hover */
    box-shadow: 0 6px 8px rgba(0, 0, 0, 0.3); /* Większy cień na hover */
    transform: translateY(-2px); /* Przesunięcie przycisku lekko w górę na hover */
}

#save_button:active {
    background-color: #1e7e34; /* Kolor przycisku po kliknięciu */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); /* Mniejszy cień przy aktywnym przycisku */
    transform: translateY(0); /* Resetowanie przesunięcia przy aktywacji */
}
	
		

#zegar {
            text-align: center;

        }		
        .clock {
            font-size: 2rem;
            color: #ffff00;
            margin-bottom: 10px;
        }
        .date {
            font-size: 1rem;
            color: #858585;
        }		

#user_OS {
            text-align: center;

        }		
        .systemOS {
            font-size: 2rem;
            color: #ffff00;
            margin-bottom: 10px;
        }
        .WitajOS {
            font-size: 1rem;
            color: #858585;
        }