       body
        {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f4f4f4+100 */
background: #ffffff; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover, #ffffff 0%, #f4f4f4 100%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover, #ffffff 0%,#f4f4f4 100%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center, #ffffff 0%,#f4f4f4 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f4f4f4',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
             color: #000000;
             font-family:'Josefin Sans';
             text-align:center;
padding: 30px 0px 0px 62px;
             min-height:400px;
             letter-spacing:-0.2px;
             cursor: default;
        }




.nicEdit-main::selection {
   background:#0086c3!important;
   color:#fff;
}


        h1, h2, h3, h4, h5, h6 {
         text-transform:uppercase;
        }


        p, span, div, ol, ul, li, td, button, input, textarea, form
        {
             margin: 0;
             padding: 0;
        }

        img {
         margin:0 auto;
        }

        a
        {
             color: #C8D7EB;
             outline: none;
             text-decoration: none;
             text-transform:uppercase;
             font-weight:700;
        }
        a:visited
        {
             color: #C8D7EB;
        }
        a:active
        {
             color: #C8D7EB;
        }
        a:hover
        {
             color: #376BAD;
             text-decoration: none;
        }


         .box5 {
         position:relative;
         width:3%;
         padding:1%;
         min-height:10px;
         float:left;
         box-sizing: border-box;
        }
         .box10 {
         position:relative;
         width:8%;
         padding:1%;
         min-height:10px;
         float:left;
         box-sizing: border-box;
        }
         .box20 {
         position:relative;
         width:18%;
         padding:1%;
         min-height:20px;
         float:left;
         box-sizing: border-box;
        }
         .box25 {
         position:relative;
         width:23%;
         padding:1%;
         min-height:20px;
         float:left;
         box-sizing: border-box;
        }
        .box33 {
         position:relative;
         width:31%;
         padding:1%;
         min-height:20px;
         float:left;
         box-sizing: border-box;
        }

        .box50 {
         position:relative;
         width:48%;
         padding:1%;
         min-height:20px;
         float:left;
         box-sizing: border-box;
        }
         .box60 {
         position:relative;
         width:58%;
         padding:1%;
         min-height:20px;
         float:left;
         box-sizing: border-box;
        }
        .box66 {
         position:relative;
         width:64%;
         padding:1%;
         min-height:20px;
         float:left;
         box-sizing: border-box;
        }
         .box70 {
         position:relative;
         width:68%;
         padding:1%;
         min-height:20px;
         float:left;
         box-sizing: border-box;
        }
        .box75 {
         position:relative;
         width:73%;
         padding:1%;
         min-height:20px;
         float:left;
         box-sizing: border-box;
        }
         .box80 {
         position:relative;
         width:78%;
         padding:1%;
         min-height:20px;
         float:left;
         box-sizing: border-box;
        }
        .box90 {
         position:relative;
         width:88%;
         padding:1%;
         min-height:20px;
         float:left;
         box-sizing: border-box;
        }
        .box100 {
         position:relative;
         width:99%;
         padding:0.5%;
         min-height:20px;
         float:left;
         box-sizing: border-box;
        }

.sekcja {
   width:100%;
   display:inline-block;
}

.box_aktualnosci {
min-height: 60px;
box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
display: block;
padding: 1% 3%;
margin-bottom: 12px;
background: #FFF url(https://pascal.edu.pl/newstlo.png) no-repeat scroll left bottom;
border-style: solid;
border-color: #f9f9f9;
border-width: 2px;
overflow: hidden;
}

.box_aktualnosci > .box100 {
min-height: 60px;
padding-bottom: 20px;
z-index:1;
}
.box_aktualnosci > .box100 > h4 {
font-size: 24px;
letter-spacing: -1px;
color: #0086c3;
width: calc(100% - 114px);
margin: 12px 10px 20px 0px;
text-align: left;
line-height: 30px;
float: left;
}
.box_aktualnosci > .tresc  {
left:0px;
background:none;
}
.box_aktualnosci > .tresc > img , .box_aktualnosci > .tresc > p > img , .box_aktualnosci > .tresc > div img {
max-width: 250px !important;
height: auto !important;
background-size: 100px 100px;
border-radius: 5px;
margin: 10px;
transition-duration: 0.6s;
animation-timing-function: ease;
}
.box_aktualnosci > .tresc > img:hover , .box_aktualnosci > .tresc > p > img:hover , .box_aktualnosci > .tresc > div img:hover{
transform:scale(1.7);
box-shadow:0px 0px 10px rgba(0,0,0,0.9);
transition-duration: 0.3s;
}

.box_aktualnosci > .box100 > .data {
width: 75px;
height: 90px;
background: #fff;
box-shadow: 0px 3px 3px rgba(0,0,0,0.3);
position: relative;
float:right;
border-radius: 10px;
background: red;
color:#fff;
overflow: hidden;
font-size: 12px;
padding: 4px 0px 0px 0px;
}

.box_aktualnosci > .box100 > .data > .kalendarzdol {
background-image: linear-gradient(#fff, #ccc);
color: #646464;
padding:4px 0px 10px 0px;
}


.zamknij-okno {
   background-image:url('grafika/zamknij.png');
   width:18px;
   height:18px;
   background-repeat:none;
   background-size:contain;
   background-position:center center;
   display:block;
   cursor:pointer;
   float:right;
   margin:2px;
}



.zamknij-baner-reklama {
width: 20px;
height: 20px;
background: lightgray;
border-radius: 9999px;
color: #797979;
position: fixed;
right: 4px;
bottom: 47px;
z-index: 1000;
cursor:pointer;
}

.baner-reklama {
background: white;
width: 350px;
height: 60px;
position: fixed;
z-index: 999;
right: 10px;
bottom: 0px;
box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
border-radius: 5px 0px 0px 0px;
background-size: contain;
}
.baner-reklama:hover {
   filter:brightness(1.1);
}


textarea {
font-family:inherit;
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
     transition-duration: 0.1s;
}

input[type=text], input[type=password], select {
font-family:inherit;
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
     transition-duration: 0.1s;
}


input[type=text]:hover, input[type=textarea], input[type=password]:hover, select:hover {
transform:scale(1);
}

input[type=text]:focus, input[type=textarea], input[type=password]:focus, select:focus {
transform:scale(0.97);
}

input[type=submit] {
position: relative;
padding: 15px 20px;
min-width: 150px;
background-color: #0086c3;
color: #fff !important;
text-decoration: none;
text-transform: uppercase;
font-weight: 700;
box-shadow: 0px 6px 0px #0f5778;
display: inline-block;
height: 44px;
margin: 5px 0px;
border-radius: 4px;
transition-duration: 0.1s;
font-size: 18px;
cursor: pointer;
border: none;
font-family: inherit;
text-shadow: 0px 2px rgb(28, 93, 156);
margin: 8px auto 14px;
}


input[type=submit]:hover {
filter:brightness(1.2);
text-decoration: none;
}

input[type=submit]:active {
top:3px;
box-shadow: 0px 3px 0px #000;
text-decoration: none;
}

input[type=radio]:checked {
   min-width: 80px;
display: inline-block;
color: #000;
background: #88dd11;
padding: 9px 7px;
text-align: center;
cursor: pointer !important;
border-radius: 4px;
margin: 3px 5px;
}


#pesel {
    text-align:center;
    font-size: 26px;
}



.radio input[type='radio'] {
  display: none;
  /*removes original button*/
}

.radio label:before {
  /*styles outer circle*/
  content: " ";
  display: inline-block;
  position: relative;
  top: 5px;
  margin: 0 5px 0 0;
  width: 20px;
  height: 20px;
  border-radius: 11px;
  background-color: transparent;
}

.radio label {
position: relative;
float: left;
min-width: 59px;
display: inline-block;
margin: 2px;
cursor: pointer !important;
background: #ffb700;
color: #fff;
padding: 4px 15px;
line-height: 21px;
border-radius: 2px;
text-shadow: 0px 1px 0px #5f5f5f;
box-shadow: 0px 2px 0px #8c6500;
}

.radio label:hover {
filter:contrast(0.8);
}

.radio label input[type='radio']:checked+span {
  /*styles inside circle*/
width: 100%;
height: 100%;
position: absolute;
top: 0px;
left: 0px;
display: block;
background-image: url('https://sluchacz.pascal.edu.pl/grafika/ikony/checkb.png');
background-repeat: no-repeat;
background-size: contain;
background-color: rgba(255,255,255,0.5);
z-index: 0;
box-shadow: 0px 2px 0px white inset,0px 3px 0px #FFD466;
}







#preloader {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgb(0,134,194);
z-index: 9999999;
background: #0086c2;
background: -moz-radial-gradient(center, ellipse cover, #0086c2 0%, #1e5799 100%);
background: -webkit-radial-gradient(center, ellipse cover, #0086c2 0%,#1e5799 100%);
background: radial-gradient(ellipse at center, #0086c2 0%,#1e5799 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0086c2', endColorstr='#1e5799',GradientType=1 );
}
#preloader > .logo {
   display: block;
width: 26%;
height: 100px;
background: url('grafika/logo_w.png');
background-repeat: no-repeat;
background-position: center;
background-size: contain;
position: fixed;
top: 25%;
left: 37%;
}
#preloader #preloaderobraz {
	position: relative;
margin: 0 auto;
top: calc(55% - 90px);
   left:115px;
    border: 16px solid #f3f3f3; /* Light grey */
    border-top: 16px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 90px;
    height: 90px;
    animation: ladowanie 2s linear infinite;
}

@keyframes ladowanie {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.preloadertext {
   position: relative;
left: -78px;
top: 55%;
margin: 0 auto;
font-size: 40px;
color:#ffffff;
}

.separator_miasta {
   margin-bottom:150px
}

.tresc {
width: 100%;
position: relative;
}

.naglowek_tresc {
position: sticky;
display: block;
width: 100%;
height: 40px;
text-align: left;
line-height: 37px;
box-sizing: border-box;
top: 50px;
z-index: 10;
}

.naglowek_tresc > img {
width: 30px;
height: auto;
float: left;
margin: 0px 16px 0px 10px;
}

.naglowek_wiersz {
background-color: #0086c3;
border-radius: 10px 10px 0px 0px;
font-weight: 800;
text-align: left;
text-transform: uppercase;
font-size: 11px;
border-width: 0px;
color: #fff;
height: 45px;
margin-top: 30px;
}

.grafika_upload {
background-image: url('grafika/upload.png');
width: 35px;
height: 35px;
background-size: contain;
background-repeat: no-repeat;
display: inline-block;
margin: 0px 20px;
}
.przycisk_upload {
padding: 8px 15px 4px 15px;
color: #555;
border-color: #ccc;
background: #f6f6f6;
box-shadow: 0 1px 0 #ccc;
margin: 0px 7px;
font-size: 14px;
font-weight:800;
}

.przycisk_dokumenty {
  width: 94%;
  padding: 14px 18px;
  margin: 0px auto 3px;
  text-transform: uppercase;
  font-weight: 800;
  letter-spacing: -1px;
  cursor: pointer;
  border-radius: 2px;
  border-color: #fff;
  box-shadow: 0px 3px 0px #ccdd;
  text-align: left;
  font-size: 16px;
  height: 20px;
  display: inline-block;
  border-style: solid;
  border-width: 0px 0px 1px 0px;
  background: #fff;
  color: #27446A;
}
.przycisk_dokumenty > img {
  height: 16px;
  margin: 0px 14px 0px 3px;
  display: inline-block;
  position: relative;
  left: -4px;
  transform: scale(1.7);
}
.przycisk_dokumenty:visited {
  color: #27446A;
}

.nicEdit-main {
   cursor:text;
}

.wiersz {
width: 100%;
padding: 0px;
min-height: 60px;
border-style: solid;
border-width: 0px 0px 1px 0px;
border-color: #ccc;
background-color: #fff;
overflow: hidden;
}
.wiersz:last-child{
border-radius:0px 0px 10px 10px;
}

.wiersz > .box5 {
padding:10px;
text-align:left;
}
.wiersz > .box10 {
padding:10px;
text-align:left;
}
.wiersz > .box60 {
padding:10px;
}
.wiersz > .box60 > a > img {
height: 28px;
margin: 0px 10px 0px 3px;
}
.wiersz > .box60 > a {
color: #27446A;
float: left;
letter-spacing: -0.7px;
}


.wiersz > .box70 {
padding:10px;
}
.wiersz > .box70 > a > img {
height: 28px;
margin: 0px 10px 0px 3px;
}
.wiersz > .box70 > a {
color: #27446A;
float: left;
letter-spacing: -0.7px;
}

.przyciskpanel {
width: 100%;
height: 36px;
background-color: white;
border-radius: 4px;
font-family: inherit;
box-shadow: 0px 2px 1px rgba(0,0,0,0.4);
text-transform: uppercase;
font-weight: 500;
letter-spacing: -0.5px;
position: relative;
float: left;
margin: 2px;
background-size: 30px;
background-repeat: no-repeat;
background-position: 13px 9px;
padding: 14px 0px 10px 50px;
cursor: pointer;
line-height: 10px;
overflow: hidden;
transition-duration: 0.1s;
font-size: 12px;
border: none;
box-sizing: border-box;
text-align: left;
color: #000000 !important;
}


.przyciskpanel:hover {
filter:brightness(1.1);
}


.przyciskpanel:active {
top:3px;
box-shadow: 0px 0px 1px rgba(0,0,0,0.4);
}

.przyciskpanel > img {
width: 25px;
height: 25px;
display: block;
position: absolute;
left: 12px;
top: 5px;
transition-duration: 0.1s;
}

.przyciskpanel:hover > img {
filter:blur(0px);
opacity:1;
width: 30px;
height: 30px;
left: 9px;
top:3px;
}

.przyciskmaly {
display: inline-block;
cursor: pointer;
padding: 6px 9px 3px 31px;
color: #ffffff;
font-weight: 300;
background-color: #0086c3;
border: none;
font-family: inherit;
text-transform: uppercase;
font-size: 16px;
width: auto;
background-position: 9px;
   background-size: 15px;
   background-repeat:no-repeat;
   border-radius:3px;
font-weight: 700;
box-shadow: 0px 2px 0px rgb(90,90,90);
}

.przyciskmaly:hover {
   filter: brightness(1.1);
}


.zmiennazwe {
background-image:url('grafika/ikony/zmiennazwe.png');
background-color: #fbce17;
}
.usun {
background-image:url('grafika/ikony/usun.png');
background-color: #ff6634;
}
.zapisz {
background-image:url('grafika/ikony/zapisz.png');
background-color: #88d833;
}
.dodaj {
background-image:url('grafika/ikony/dodaj.png');
background-color: #fbce17;
}
.przyciskwtabeli {
    cursor: pointer;
    transition-duration: 0.1s;
    position: relative;
    font-size: 7px;
    color: #000;
    width: 60px;
    height: 34px;
    border-style: solid;
    border-width: 1px;
    box-sizing: border-box;
    background-color: white;
    border-color: #888;
    border-radius: 2px;
    display: inline-block;
    text-transform: uppercase;
    font-family: inherit;
    font-weight: 600;
    text-align:center;
}
.przyciskwtabeli-ikona {
    font-size: 11px;
}
.przyciskwtabeli:hover {
    transform: scale(1.3);
    filter: brightness(1.3);
    position: relative;
}

.liczbapowiadomien {
width: auto;
height: auto;
min-width: 19px;
background: red;
border-radius: 999px;
text-align: center;
box-sizing: border-box;
right: 0px;
position: absolute;
display: none;
top: 0px;
z-index: 5;
color: white;
font-weight: bold;
padding: 5px 6px 4px;
}

.menu_boczne {
position: fixed;
top: 38px;
width: 70px;
left: 0px;
height: 100%;
min-height: 200px;
background-color: #4b4c51;
text-align: right;
color: #fff;
font-size: 12px;
box-shadow: 0px 2px 10px rgba(0,0,0,0.2);
padding: 4px 10px;
box-sizing: border-box;
z-index: 100;
-webkit-transition: all 0.4s cubic-bezier(.08,.33,0,1.19);
transition: all 0.4s cubic-bezier(.08,.33,0,1.19);
}

.menu_boczne ul li{
  white-space: nowrap;
}

.menu_boczne:hover {
    width: 275px;
    box-shadow: 0px 2px 20px rgba(0,0,0,0.5);
}

.ikona_pomoc {
text-transform: uppercase;
border: 1px;
border-style: solid;
width: auto;
display: inline-block;
padding: 0px 10px;
font-weight: 500;
background-color: #efefef;
line-height: 24px;
border-color: #fff;
}
.ikona_pomoc > img {
   width:20px;
   margin-right:5px;
   top:5px;
   position:relative;
}

.naglowek_panelu {
   position:fixed;
   top:0px;
   width:100%;
   left:0px;
   height: 38px;
   background-color: #005379;
   text-align:right;
   color:#ffffff;
   font-size:12px;
   box-shadow:0px 2px 10px rgba(0,0,0,0.1);
padding: 4px 10px;
box-sizing: border-box;
z-index: 100;
-webkit-transition: all 0.4s cubic-bezier(.19,1,.22,1);
transition: all 0.4s cubic-bezier(.19,1,.22,1);
}


.naglowek_panelu > a{
color: #fff;
margin: 2px 5px;
font-size: 16px;
padding: 5px 10px;
box-sizing: border-box;
display: inline-block;
}

.naglowek_panelu > a:hover{
background-color:rgba(255,255,255,0.1);
}

.naglowek_panelu_przyciski {
display: inline-block;
padding: 0px;
margin: 0px;
}

.naglowek_panelu_przyciski > form > input[type=submit]{
color: white;
margin: 6px 10px;
font-size: 16px;
padding: 0px 10px;
box-sizing: border-box;
display: inline-block;
background: none;
text-shadow: none;
box-shadow: none;
min-width: 100px;
height: auto;
}

.logo_white {
background-image: url('grafika/logo_w.png');
background-repeat: no-repeat;
background-size: contain;
height: 23px;
width: 130px;
margin: 0px 10px;
top: 4px;
left:20px;
position: absolute;
background-position: center center;
}

.logo_blue {
background-image: url('grafika/logo.png');
background-repeat: no-repeat;
background-size: contain;
height: 23px;
width: 130px;
margin: 0px 10px;
top: 4px;
left:20px;
position: absolute;
background-position: center center;
}

.logostart {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&1+16,0+39 */
background: -moz-linear-gradient(-45deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 16%, rgba(255,255,255,0) 39%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 16%,rgba(255,255,255,0) 39%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 16%,rgba(255,255,255,0) 39%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */width:600px;
height:500px;
position:fixed;
top:0px;
left:0px;
}
.logostart > img {
width: 184px;
left: 37px;
top: 30px;
position: absolute;
}

#czas {
   display:inline-block;
}

.czas {
display: inline-block;
width: 258px;
text-align: center;
color: rgba(255,255,255,0.8);
font-weight: 100;
cursor:default;
}


.tlozdjecie {
width: 100%;
height: 100%;
position: absolute;
left: 0px;
top: 0px;
z-index: -1;
background-size:cover;
background-repeat:no-repeat;
background-position:center center;
}

.tlozdjecieblur {
filter:blur(10px);
width: 360px;
min-height: 430px;
position: absolute;
z-index: 0;
background-size: 340%;
background-repeat: no-repeat;
background-position: 86% 41%;
left: 61%;
top: 13%;
}


.loginform {
width: 360px;
min-height: 430px;
margin: 0 auto;
padding: 50px 23px;
border-style: solid;
border-width: 4px;
border-color: #fff;
box-shadow: 0px 4px 30px rgba(0,0,0,0.25), 0px 0px 30px rgba(255,255,255,0.7) inset;
color: #00496c;
position: absolute;
left: 61%;
top: 13%;
box-sizing: border-box;
background-color: rgba(255,255,255,0.8);
transition-duration: 0.3s;
border-radius: 8px;
font-size: 16px;
text-transform: uppercase;
}

.loginform:hover {
background-color: rgba(255,255,255,0.9);
transition-duration: 0.2s;

}

.infoglowna {
width: 480px;
min-height: 130px;
margin: 0 auto;
padding: 34px;
border-style: solid;
border-width: 6px;
border-color: #fff;
box-shadow: 0px 4px 30px rgba(0,0,0,0.25), 0px 0px 30px rgba(255,255,255,0.5) inset;
color: #fff;
position: absolute;
left: 8%;
top: 58%;
box-sizing: border-box;
background-color: rgba(0, 137, 205,0.9);
transition-duration: 0.5s;
font-weight: 300;
text-shadow: 1px 1px 0px #465491;
border-radius: 50px 50px 50px 0px;
}


.g-recaptcha > div {
  margin: 0 auto;
}

.stopkastart {
background: #0089cd;
position: absolute;
left: 0px;
bottom: 0px;
min-height: 45px;
color:#ffffff;
font-size:14px;
}

.komunikat_pelny {
position: fixed;
left: 0px;
width: 100%;
height: 100%;
background-color: #4b4c51;
box-sizing: border-box;
color: #ffffff;
opacity: 0.97;
box-shadow: 0px 0px 410px rgba(0,0,0,0.5);
font-weight: 700;
text-transform: uppercase;
font-size: 30px;
top: 0px;
z-index: 10000000;
padding: 20% 10%;
}

p.success {
    background: #CF9;
    border: 1px solid #060;
    width: 500px;
    margin: 5px;
    color: black;
    font-weight: bold;
    padding: 2px;
}

p.error {
    background: #f88;
    border: 1px solid #c00;
    width: 500px;
    margin: 5px;
    color: black;
    font-weight: bold;
    padding: 2px;
}

label {
    font-weight: bold;
    display: block;
    margin-top: 5px;
}

footer#footer {
    font-size: 0.8em;
    text-align: center;
    clear: both;
    width: 100%
}

.box_ramka_dokument {
   position:fixed;
   width:100%;
   height:100%;
   left:0%;
   top:0%;
   background:rgba(20,20,20,0.9);
   z-index:110;
   cursor: zoom-out;
}
.ramka_dokument {
   position:fixed;
   width:90%;
   height:95%;
   left:5%;
   top:5%;
   border: none;
box-shadow: 0px 0px 20px #000000;
}

.box_dokument {
width: auto;
min-height: 50px;
padding: 15px 30px;
display: inline-block;
margin: 5px;
box-sizing: border-box;
cursor: pointer;
color: #fff;
font-weight: 700;
letter-spacing: -0.7px;
border-radius: 10px;
box-shadow: 0px 3px 0px #cbcbcb;
transition-duration: 0.2s;
text-shadow: 0px 1px 0px #5c5c5c;
}
.box_dokument:hover {
transform:scale(1.05);
color:#fff;
}


.box_pobierzplik {
width: 20%;
height: 240px;
display: inline-block;
cursor: pointer;
background: #a0cee4;
color: #0089b2;
box-shadow: 0px 5px 0px #224067;
padding-top: 100px;
box-sizing: border-box;
min-width: 220px;
padding: 40px 10px 10px 10px;
transition-duration: 0.2s;
background: -moz-radial-gradient(center, ellipse cover, #fdffff 1%, #e6f8fd 30%, #c8eefb 93%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover, #fdffff 1%,#e6f8fd 30%,#c8eefb 93%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center, #fdffff 1%,#e6f8fd 30%,#c8eefb 93%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdffff', endColorstr='#c8eefb',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.box_pobierzplik:hover {
transform:scale(1.05);
box-shadow: 0px 3px 0px #224067;
}

.box_pobierzplik > img {
width:40%;margin-bottom:20px;filter: hue-rotate(-32deg);
}


#box_pomoc {
position: absolute;
z-index: 50;
width:600px;
height:300px;
box-shadow:0px 2px 20px rgba(0,0,0,0.6);
background-color:#fff;
font-size: 13px;
line-height: 22px;
}
#box_pomocheader {
  cursor: move;
  z-index: 51;
  background-color: #2196F3;
  color:#fff;
  font-weight:bold;
  height:10%;
  padding: 6px 15px;
  text-align: left;
  box-sizing: border-box;
  text-transform: uppercase;
font-size: 16px;
}
#box_pomocheader > img {
float:right;
cursor:pointer;
width:18px;
height:auto;
}
#box_pomoctresc {
overflow-y:scroll;
height:auto;
height:90%;
text-align: center;
text-transform: none;
color: #000;
padding: 10px;
box-sizing: border-box;
}

#box_pomoctresc > section > h3 {
background: #dde9ee;
color: #002333;
padding: 11px 5px 3px;
font-size: 16px;
border-radius: 5px 5px 0px 0px;
margin: 0px 10px 10px;
}
.info_plany_zajec {
padding: 15px;
background: #d1f1ff;
margin-bottom: 50px;
border-style: solid;
border-color: #d0e0e7;
border-width: 2px;
border-radius: 5px;
box-shadow: 0px 0px 15px #b2e0f7 inset;
}



.okno_dialogowe {
  position: fixed;
  width: 500px;
  height: auto;
  left: calc(50% - 250px);
  top: calc(50% - 100px);
  background: white;
  z-index: 999999;
  padding: 30px;
  box-shadow: 0px 4px 50px rgba(0,0,0,0.2);
  border-style: solid;
  border-width: 1px;
  border-color: #aaa;
}



.box_narzedzie {
  min-height: 150px;
  border: 1px solid #b4b9be;
  background: white;
  padding: 35px 20px;
    padding-top: 35px;
    padding-right: 20px;
    padding-bottom: 35px;
    padding-left: 20px;
  box-shadow: 0px 2px 18px rgba(0,0,0,0.1);
  text-align: left;
}

















/*/////////////////////////////*/
/*///////// KONTAKT //////////*/
/*/////////////////////////////*/

.uzytkownikwiadomosci > input {
   display:none;
}

.kontakt_rozmowa {
font-family: inherit;
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
border-radius: 4px;
box-sizing: border-box;
transition-duration: 0.1s;
min-height: 100px;
background: #fff;
}

.uzytkownikwiadomosci {
width: 100%;
height: 32px;
box-sizing: border-box;
background-color: #d0eaff;
margin: 4px 0px;
border-radius: 3px;
padding: 11px 14px;
text-align: left;
text-transform: uppercase;
font-weight: 300;
color: #081f4e;
box-shadow: 0px 2px 0px rgb(218, 218, 218);
font-size: 12px;
cursor: pointer;
}
.uzytkownikwiadomosci.nieprzeczytana {
padding: 8px 14px;
font-weight: 800;
background-color: #ffcf00;
box-shadow: 0px 2px 0px rgb(117, 103, 0);
color: #332f26;
font-size: 16px;
}

.uzytkownikwiadomosci > .data {
font-size:10px;
font-weight:300;
float: right;
}

.kontakt_rozmowa_okno {
font-family: inherit;
width: 100%;
margin: 0px;
display: inline-block;
border: 2px solid #0086c3;
border-radius: 4px;
box-sizing: border-box;
transition-duration: 0.1s;
background: #fff;
position: relative;
box-shadow: 0px 0px 16px rgba(0,0,0,0.2);
height: auto;
overflow-x: hidden;
max-height: 300px;
min-height: 200px;
overflow-y: scroll;
}

.kontakt_rozmowa_okno_naglowek {
    width: 100%;
    background: #0086c3;
    position: sticky;
    z-index: 5;
    color: #fff;
    font-weight: 300;
    left: 0px;
    top: 0px;
    box-shadow: 0px 2px 3px rgba(0,0,0,0.2);
}

.wiadomosc {
width: 80%;
border-radius: 10px;
padding: 7px 12px;
box-sizing: border-box;
display: inline-block;
line-height: 17px;
}


.nieodczytana {
   filter:brightness(1.1);
}
.nieodczytana::before {
display: block;
content: "NOWA";
position: absolute;
background: yellow;
color: black;
padding: 0px 6px;
border-radius: 2px;
font-size: 8px;
right: -6px;
top: -10px;
}

.odebrane {
float: left;
background: #94c2d8;
margin: 6px 16% 6px auto;
color: #45494e;
text-align: left;
left: 4%;
position: relative;
}

.wyslane.nowe {
   filter:brigtness(1.1);
}

.odebrane::after {
display: block;
width: 0;
height: 0;
border-top: 7px solid transparent;
border-bottom: 7px solid transparent;
content: "";
border-right: 9px solid #94c2d8;
position: relative;
left: -20px;
float: left;
clear: both;
top:-10px;
}

.wiadomosc.odebrane > .data {
float: right;
font-size: 10px;
color: #6c8cab;
}

.wyslane {
float: right;
background: #0086c3;
margin: 6px auto 6px 16%;
color: #fff;
text-align: right;
right: 4%;
position: relative;
}

.wyslane::after {
display: block;
width: 0;
height: 0;
border-top: 7px solid transparent;
border-bottom: 7px solid transparent;
content: "";
border-left: 8px solid #0086c3;
position: relative;
right: -19px;
float: right;
bottom: -4px;
}


.wiadomosc.wyslane > .data {
float: left;
font-size: 10px;
color: #92c7d5
}

.wysylanie {
bottom: inherit;
width: 100%;
background: white;
min-height: 45px;
margin: 0;
padding: 2px 3px 0px;
box-shadow: 0px 0px 10px rgba(0,0,0,0.3);
box-sizing: border-box;
clear: both;
position: sticky;
}

.wysylanie > input {
   font-family: inherit;
}

.wysylanie > input[type=text], select {
font-family: inherit;
width: 66%;
min-height: 30px;
padding: 4px 10px;
border-radius: 5px;
border-style: none;
box-shadow: 0px 0px 5px rgba(0,0,0,0.5) inset;
}

.wysylanie > input[type=submit] {
font-family: inherit;
width: 21%;
min-height: 25px;
padding: 4px 10px;
border-radius: 5px;
border-style: none;
box-shadow: 0px 2px 0px rgb(0, 0, 0);
background-color: #fbce17;
font-weight: 500;
min-width: 100px;
height: 32px;
color: #000 !important;
text-shadow: none;
font-size: 14px;
}

/*/////////////////////////////*/
/*///////// /KONTAKT //////////*/
/*/////////////////////////////*/



.dokumenty_tytulkategorii {
  margin: 30px auto 0px;
  text-align: left;
  padding: 0px 30px;
  font-size: 16px;
}










@media (min-width: 1600px) {


.logostart {
       transform: scale(1.5);
    left: 7%;
    top: 11%;
}
.stopkastart {
       font-size: 24px;
}
.infoglowna {
    transform: scale(1.5);
    left: 16%;
}

.tlozdjecieblur {
    top: 29%;
}
.loginform {
    transform: scale(1.5);
    top: 29%;
}

.tlozdjecieblur {
    background-position: 80% 40%;
    transform: scale(1.5);
}

}










@media (min-width: 480px) and (max-width: 1080px) {


.infoglowna {
left: 45%;
width: 360px;
top: 14%;
}

.tlozdjecieblur {
left: 45%;
top: 31%;
}
.loginform {
left: 45%;
top: 31%;
}
.tlozdjecie {
   background-position: 29% center;
}
.tlozdjecieblur {
   background-position: 44% 27%;
}

}

@media (max-width: 480px) {


body
{
padding: 12px;
min-height:680px;
letter-spacing:-0.2px;
cursor: default;
}


.logo_blue {
    height: 23px;
    width: 100px;
    margin: 0px 10px;
    top: 4px;
    left: 2px;
    position: absolute;
}

.czas {
   display:none;
}


.box33, .box66 {
   width:98%;
}

.menu_boczne {
    padding: 0px;
    width: 114%;
    height: auto;
    position: relative;
    left:-7%;
}
.menu_boczne:hover {
   width:100%;
}
.przyciskpanel {
   padding: 38px 4px 26px 4px;
   border-radius: 4px;
   margin: 1%;
   text-align: left;
   word-break: break-word;
   text-transform:none;
   width:18%;
   min-width:60px;
   word-break: break-all;
line-height: 10px;
font-size: 9px;
text-transform: uppercase;
}

.przyciskpanel > img {
    left: 4px;
    top: 4px;
}


.naglowek_panelu {
   height: auto;
}

.naglowek_panelu_przyciski {
    width: 100%;
}
.naglowek_panelu_przyciski > form > input[type=submit]{
margin: 6px 2px 6px 10px;
}

.logo_white {
   left:0px;
   top:0px;
   position: relative;
   width: 105px;
   float:left;
}

.infoglowna {
   left: 5%;
    top: 100px;
    width: 90%;
    min-height: 60px;
    margin: 0 auto;
    padding: 20px 22px;
    border-radius: 25px 25px 0px;
}

.logostart {
   width:100%;
}
.logostart > img {
    width: 60%;
   left: 0px;
    top: 30px;
    margin: 0 auto;
    display: block;
    position: relative;
}

.stopkastart {
    padding: 14px;
    line-height: 17px;
    width: 100%;
    box-sizing: border-box;
    top: 660px;
    min-height: 140px;
}
.stopkastart > .box50 {
       width: 98%;
      margin: 2px 0px 6px;
}
.stopkastart > .box50 > a {
       width: 98%;
       display: inline-block;
}

#preloader > .logo {
    width: 60%;
    top: 16%;
    left: 20%;
}

.loginform {
    left: 5%;
    width: 90%;
    top: 245px;
        min-height: 300px;
    font-size: 18px;
padding: 20px 15px;
}
.tlozdjecieblur {
   display:none;
}
.tlozdjecie {
   filter:blur(10px);
}

.tresc {
    margin-top: 30px;
}

.ramka_dokument {
    width: 90%;
    height: 93%;
    left: 5%;
    top: 7%;
    overflow: scroll;
    position:fixed;
        overflow-x: scroll;
}

.naglowek_tresc > img {
    width: 20%;
    height: auto;
    float: left;
    margin: 0px 40% 10px 40%;
    }

.naglowek_tresc {
    width: 100%;
    min-height: 100px;
    text-align: center;
    line-height: 23px;
    top: 30px;
        margin: 0px auto 20px;
}

#preloader #preloaderobraz {
    top: calc(50% - 75px);
    left: 0px;
}

.preloadertext {
    left: 0px;
    top: 35%;
}



.box_aktualnosci > .box100 > .data {
    width: 25%;
    height: 90px;
}
.box_aktualnosci > .box100 > h4 {
    width: 70%;
   line-height: 25px;
    font-size: 22px;
}
.box_aktualnosci > .tresc {
    left: 0px;
    background: none;
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
        margin: 0px 0px 20px 0px;
}

.wiersz {
   width: 100%;
   min-height: 170px;
}

.wiersz > .box10 {
    padding: 1% 4%;
    text-align: left;
    float: left;
    width: 96%;
    box-sizing: border-box;
}

.wiersz > .box60 {
    padding: 6px;
    width: 100%;
    box-sizing: border-box;
    font-size: 13px;
}

.wiersz > .box60 > a {
    color: #27446A;
    float: left;
    letter-spacing: -0.7px;
    text-align: left;
}

.wiersz {
    width: 100%;
    padding: 30px 0px;
}

.naglowek_wiersz {
   display:none;
}

#pesel {
    font-size: 26px;
}








}
