.whitebox{
background:#fff;padding:10px;border-radius:5px;-moz-border-radius:5px;box-shadow:4px 4px 10px #777;
}
.fullscreen{
position:absolute;
margin-top: -70px;background: #fff;padding: 10px !important;border: 1px solid #aaa;border-radius: 5px;width: 950px;height: 500px;
margin-left:-200px !important;
}

.rtoEditorFS{
width:935px !important;
height:450px !important;
}
.cssIFrameFS{
width: 920px !important;
height: 340px !important;
}
.tableZapiszFS{
width:940px !important;
}
/************paginacja **************/
.paginacja{
display:inline-block;
border:1px solid #555;
padding:5px 7px 5px 7px;
                background-color:#b5de9e;
                color:#333;
font-weight:bold;
}
.paginacja_current{
display:inline-block;
border:1px solid #555;
font-weight:bold;
padding:8px 9px 8px 9px;
                background-color:#92cf6f;
                color:#333;
}

/* top elements */
* { padding: 0; margin: 0; }

body {
  margin: 0;
  padding: 0;
  font-family: Roboto;
  color: #666666; 
  /* background: #ffffff url(bg.gif) repeat-x; */
   
background-size:100%;  
  overflow-x: hidden; 
  
}

fieldset{
padding-bottom:10px;
border:1px solid #ccc;
margin-bottom:10px;
}
legend{
font-weight:bold;
margin:0px 10px;
padding:0px 5px;
}
/* links */
a { 
  color: #1388cb;
  background-color: inherit;
  text-decoration: none;
  
}
a:hover {
  color: #000000;
  background-color: inherit;
}
#toTop {
    width: 50px;
    height: 50px;
    background: url(../pliki/top.png);
    position: fixed;
    right: 10px;
    bottom: 100px;
    opacity: 0;
    -moz-transition: all 2s ease-in;
    -o-transition: all 2s ease-in;
    -ms-transition: all 2s ease-in;
    transition: all 2s ease-in;
	z-index:3;
    border-radius:50%;
}
#toTop a {
    display: block;
    height: 50px;
}
/* headers */
h1, h2, h3 {

  color: #333;  
}
.material-icons {
    display:block;vertical-align:middle;font-size:27px !important;color:#111;cursor:pointer;
}
.noteContainer:hover .noteButtons {opacity: 1;z-index:10;}
.noteContainer{
    border:1px solid #aaa;margin:5px;border-radius:5px;box-shadow:3px 3px 3px #ddd;
}
.noteHeader {
    padding:10px;
    font-size:17px;
    
    color:#1388cb;
    font-weight: bold;
    
}
.noteDate {
    background:#efefef;border-radius:10px;
    font-size:13px;
    margin-bottom:7px;
    margin-left:245px;
    padding: 3px 10px;;
    margin-right: 10px;
    font-style:italic;
}
.noteDesc{
    padding:10px;
    overflow: hidden;
    
}
.noteButtons {
    background:#efefef;
    padding: 7px;
    opacity:0;
     transition: all .3s ease-out 0s;
    
}
.dateTime
{
	    width: 100px !important;
    background: url(../img/date.gif) right no-repeat;
    cursor: pointer;
}
.grid-item {
     -moz-transition: all 0.7s ease-in;
    -o-transition: all 0.7s ease-in;
    -ms-transition: all 0.7s ease-in;
    transition: all 0.7s ease-in;
}
h1 { font-size: 20px; color: #000000; border-bottom:1px solid #ccc;padding-bottom:10px;} 
h2 { font-size: 1.4em; text-transform:uppercase;}
h3 { font-size: 1.3em; }

p, h1, h2, h3 {
  margin: 10px 15px;
}



h1, h2, h3 {
  margin: 10px 10px;
  margin-top:0;
}
ul, ol {
  margin: 10px 30px;
  padding: 0 15px;
  color: #666666;
}
ul span, ol span {
  color: #666666; 
}

h1 {
  margin-top:0;
}

/* images */
img {
  border: none;
}
img.no-border {
  border: none;
}
img.float-right {
  margin: 5px 0px 5px 15px;  
}
img.float-left {
  margin: 5px 15px 5px 0px;
}
a img {  
  border: none;
}

input {
  padding: 5px;
  border:1px solid #ccc;
  font-family: arial;
  color:#555;
  border-radius:3px;
    border:0px;border-bottom:1px solid #ccc;
    font-size:14px;
    background:none;
}
input::placeholder { color: #ccc; font-style: italic; font-weight: normal;}


textarea {
  width:300px;
  padding:5px;
  font-family: arial;
  border:1px solid #ccc;
  height:100px;
  font-size:13px;
  display:block;
  color:#555;
  border-radius:3px;
    font-size:14px;
    background:none;
}



.button { 
  height: auto !important;
  color: #FFF;
  white-space: nowrap;
  background: #1388cb;
  margin: 0px; 
  padding: 10px 10px 10px 10px; 
  font: bold 1em Arial, Sans-serif; 
	border: 1px solid #2970b0;
  FONT-SIZE: 10px;
border-radius:3px;
-moz-border-radius:3px;
  overflow: hidden;
    transition: all .3s ease-out 0s;
    vertical-align: middle;
    z-index: 1;
   cursor: pointer;
    box-shadow: 0 2px 3px 0 rgba(0,0,0,0.16),0 2px 5px 0 rgba(0,0,0,0.12);
margin-top:-3px;
margin-bottom:10px;
}
input[type="radio"] {
border:0px;
vertical-align:middle;
} 
input[type="checkbox"] {
border:0px;
vertical-align:middle;
} 
select {
padding:5px;
padding-right:5px;
    border: 1px solid #CCC;
    font-family:  arial;
    color: #777;
}
} 

#wrap {
  width: 1000px; 
  height: 100%;
  margin: 0 auto;  
  text-align: left;
}
#content-wrap {
  clear: both;
  margin: 0; padding: 0;  
  text-align:left;
}
#logowanie {
    float: right;
  margin: 0;  padding: 0;
  margin-bottom:10px;
  margin-right:8px;
  margin-top:2px;
  font-size:11px;
}

div#logowanie input.button {
    border:1px solid #b5af8c;
    background-color:#cac59d;
    height:25px;
}
div#logowanie input {
  height:20px; padding:2px; font-size:13px;
  border:1px solid #b5af8c;
}
div#logowanie a {
/*  color:#b5af8c;*/
color:#74725b;
  text-decoration:underline;
}
/* header */
#header {
  position: relative;
  /* height: 40px;   */
  height: 83px;
  background-image:url(../img/markizy.png);
  background-position:top center;
  background-repeat:no-repeat;
  width: 944px;
  left:-32px;
}
#logo {
    width: 212px;
  margin: 0px 0px 0px 0px;  
  padding:0px 0px 0px 0px;
}



#header h1#logo {
  position: absolute;
  margin: 0; padding: 0;
  font: bolder 4.1em 'Trebuchet MS', Arial, Sans-serif;
  letter-spacing: -2px;
  text-transform: lowercase;
  top: 0; left: 5px;  
}
#header h2#slogan {
  position: absolute;   
  top:37px; left: 95px;
  color: #666666;
  text-indent: 0px;
  font: bold 11px Tahoma, 'trebuchet MS', Sans-serif; 
  text-transform: none;  
}
#header form.searchform {
  position: absolute;
  top: 0; right: -12px;  
}

/* main */


.post-footer {
  padding: 5px; margin: 20px 15px 0 15px;
  border: 1px solid #ffffff;
  font-size: 95%;  
}
.post-footer .date {
  background: url(clock.gif) no-repeat left center;
  padding-left: 20px; margin: 0 10px 0 5px;
}
.post-footer .comments {
  background: url(comment.gif) no-repeat left center;
  padding-left: 20px; margin: 0 10px 0 5px;
}
.post-footer .readmore {
  background: url(page.gif) no-repeat left center;
  padding-left: 20px; margin: 0 10px 0 5px;
}

/* sidebar */
#sidebar {
    height:600px;
    max-height:90vh;
    background:url(../pliki/logo2.png) bottom no-repeat;
    background-size: 40px;
  margin: 0;  
  padding: 0; 
    position:fixed;
}

#sidemenu {
background:#fff;padding:10px 10px 10px 0px;border-radius:5px;-moz-border-radius:5px;

margin-top:10px;
margin-bottom:20px;
}

#sidemenuTop {
/*  background-image:url(../img/sidebarMid.png);
  background-position:top left;
  background-repeat:repeat-y;  */

}

#sidebar p {
  background-image:url(../img/sidebarmid.png);
  background-position:top left;
  background-repeat:repeat-y;
}

#sidebar ul.sidemenu {
  list-style:none;
  margin:0px 7px 0px 15px;
  padding:0;    
}
#sidebar ul.sidemenu li {
  margin-bottom:1px;
}
#sidebar ul.sidemenu a {
  display:block;
  font-weight:bold;
  color: #999;  
  text-decoration:none;  
  padding:2px 5px 2px 10px;
  background:none;
  font-size:11px;
  min-height:18px;
}

* html body #sidebar ul.sidemenu a { height: 18px; }

#sidebar ul.sidemenu a:hover {
  padding:2px 5px 2px 10px;
  background:none;
  color: #000000;
}

/* rightbar */
#rightbar {
    margin:0px;
    height:22px;  
  background-color:#fff;
  background-image:url(../img/divider_small.png);
  background-position:bottom;
  background-repeat:no-repeat;
}

/* Footer */
#footer { 
  clear: both; 
  color: #afab88; 
  border-top: 1px solid #ffffff;
  margin: 0; padding: 0;
  margin-top:10px;
  height: 37px;    
  font-size: 95%;
  width:860px; margin:auto;
}
#footer a { 
  text-decoration: none; 
  font-weight: bold;  
  color: #aaa;
}
#footer .footer-left{
  float: left;
  width: 45%;
}
#footer .footer-right{
  float: right;
  width: 50%;
  margin-top:10px;
  color: #afab88;
  text-align:right;

  }
#wykonanie_div {
  margin-top:5px;
  color: #afab88;
}

#footer a:hover {
  color:#ffffff;
}
/* start - table */
table {
  border-collapse: collapse;
  font-size:13px;
/*  margin: 10px;  */
  margin:0;
}
#logowanie table {
  border:0;
  margin: 0;
  font-size:13px;
}

#logowanie img {
  vertical-align:bottom; /* generalnie ok */
  vertical-align:top;
}
th strong {
  color: #fff;
}
tr {

}

td {
  padding-left: 10px;
  padding-right: 0px;
    padding-top:2px;
  padding-bottom:2px;
  
}


div#logowanie td {
  padding:2px;
  border:0;
  text-align:right;
}
td.first,th.first {
  border-left: 0px;
}
tr.row-a {
  background: #F8F8F8;
}
tr.row-b {
  background: #EFEFEF;
}
/* end - table */
/* menu tabs */
#header ul {
  z-index: 999999;
  position: absolute;
   margin:0; padding: 0;
   list-style:none;
  right: 0; 
  bottom: 6px !important; bottom: 5px;
  font: bold 13px  Arial, 'Trebuchet MS', Tahoma, verdana,  sans-serif;  
}
#header li {
   display:inline;
   margin:0; padding:0;
}
#header a {
   float:left;
   background: url(tableft.gif) no-repeat left top;
   margin:0;
   padding:0 0 0 4px;
   text-decoration:none;
}
#header a span {
   float:left;
   display:block;
   background: url(tabright.gif) no-repeat right top;
   padding:6px 15px 3px 8px;
   color: #FFF;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#header a span {float:none;}
/* End IE5-Mac hack */
#header a:hover span {
  color:#FFF;
}
#header a:hover {
   background-position:0% -42px;
}
#header a:hover span {
   background-position:100% -42px;
}
#header #current a {
   background-position:0% -42px;
  color: #FFF;
}
#header #current a span {
   background-position:100% -42px;
  color: #FFF;
}

/* end menu tabs */

/* alignment classes */
.float-left  { float: left; }
.float-right {  float: right; }
.align-left  {  text-align: left; }
.align-right {  text-align: right; }

/* additional classes */
.clear { clear: both; }
.green {  color: #9EC630; }
.gray  {  color: #BFBFBF; }


/*tabs*/
#tab_header {
        FONT-SIZE: 80%; BACKGROUND: url(bg_tab.gif) #dae0d2 repeat-x 50% bottom; FLOAT: left; WIDTH: 100%; LINE-HEIGHT: normal
}
#tab_header UL {
        PADDING-RIGHT: 10px; PADDING-LEFT: 10px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 10px; LIST-STYLE-TYPE: none
}
#tab_header LI {
        PADDING-RIGHT: 0px; PADDING-LEFT: 9px; BACKGROUND: url(left.gif) no-repeat left top; FLOAT: left; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px
}
#tab_header A {
        PADDING-RIGHT: 15px; DISPLAY: block; PADDING-LEFT: 6px; FONT-WEIGHT: bold; BACKGROUND: url(right.gif) no-repeat right top; FLOAT: left; PADDING-BOTTOM: 4px; COLOR: #666; PADDING-TOP: 5px; TEXT-DECORATION: none
}
#tab_header A {
        FLOAT: none
}
#tab_header A:hover {
        COLOR: #9EC630
}
#tab_header #cr {
        BACKGROUND-IMAGE: url(left_on.gif)
}
#tab_header #cr A {
        BACKGROUND-IMAGE: url(right_on.gif); PADDING-BOTTOM: 5px; COLOR: #333
}

/* fixed errors */

#main table {
  
}

#main font {
  margin-left:20px;
}
#div_tresc{
}

#f1{
margin-left:10px;
}
#przerwaEnd {
  background:#000;
  width:740px;
  height:27px;
  margin-bottom:0px;
  margin-right:0px;
background:url(../img/divider.png) top no-repeat;
}
#przerwaTop {
  
}

#mainEnd {
  background-position:top left;
  background-repeat:no-repeat;
  
}
#mainTop {
  background-position:top left;
  background-repeat:no-repeat;
  margin-bottom:0;
  
}
#main {
background:#fff;padding:10px;border-radius:5px;-moz-border-radius:5px;
min-height:200px;
margin-bottom:20px;
padding-bottom:40px;
}

li#current {
  background:none;
  color: #000000;
  padding-left:4px;
  
  background-image:url(../img/current.png);
  background-position:center left;
  background-repeat:no-repeat;
}

#sidebar ul.sidemenu li#current a , li#current a:hover {
  color: #000000;
}

#main .button, #overlay .button  {
	background: #1388cb;
  margin: 0px; 
  padding: 10px 10px 10px 10px; 
  font: bold 1em Arial, Sans-serif; 
	border: 1px solid #2970b0;
  height: 24px;
  FONT-SIZE: 13px;
border-radius:3px;
-moz-border-radius:3px;
  overflow: hidden;
    transition: all .3s ease-out 0s;
    vertical-align: middle;
    z-index: 1;
   cursor: pointer;
    box-shadow: 0 2px 3px 0 rgba(0,0,0,0.16),0 2px 5px 0 rgba(0,0,0,0.12);
margin-top:-3px;
margin-bottom:10px;
}

#rejestracja input.button {
  background:none;
  background-image:url(../img/zarejestruj.png);
  background-position:center center;
  background-repeat:no-repeat;
  width:118px;
  height:58px;
  border:0;
  color:#fff;
  font-size:13px;
}

input.button:hover {
  opacity:0.8;
}

.button {
  cursor:pointer;
}


/*- Menu Tabs C--------------------------- */

    #tabsC {
      float:left;
      width:740px;
      border-bottom:2px solid #EDF7E7;
      background:#fff;
      font-size:93%;
      line-height:normal;
    margin-bottom:10px;
      }
    #tabsC ul {
        margin:0;
    margin-top:2px;
        padding:10px 10px 0 10px;
        list-style:none;
      }
    #tabsC li {
      display:inline;
      margin:0;
      padding:0;
      }
    #tabsC a {
      float:left;
      background:url("../img/tableftc.gif") no-repeat left top;
      margin:0;
      padding:0 0 0 4px;
      text-decoration:none;
      }
    #tabsC a span {
      float:left;
      display:block;
      background:url("../img/tabrightc.gif") no-repeat right top;
      padding:5px 15px 4px 6px;
      color:#464E42;
      }
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #tabsC a span {float:none;}
    /* End IE5-Mac hack */
    #tabsC a:hover span {
      color:#FFF;
      }
    #tabsC a:hover {
      background-position:0% -42px;
      }
    #tabsC a:hover span {
      background-position:100% -42px;
      }

        #tabsC #current a {
                background-position:0% -42px;
        font-weight:bold;
        }
        #tabsC #current a span {
                background-position:100% -42px;
        font-weight:bold;
        }
          #tabsC #current2 a {
                background-position:0% -42px;
        font-weight:bold;
        }
        #tabsC #current2 a span {
                background-position:100% -42px;
        font-weight:bold;
        }  
    
    .toggler {
    background:#1388cb;
  margin: 0px; 
  padding: 3px 10px 3px 10px; 
  font: bold 1em Arial, Sans-serif; 
	border: 1px solid #2970b0;
  color:#fff;
  FONT-SIZE: 14px;
border-radius:5px;
-moz-border-radius:5px;
  cursor:pointer;
  margin-bottom:1px;
  border-radius:3px;
-moz-border-radius:3px;
  overflow: hidden;
    transition: all .3s ease-out 0s;
    vertical-align: middle;
    z-index: 1;
   cursor: pointer;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
}
 
.element {
 border-right: 0px solid #edf7e7;
  border-left:0px solid #edf7e7;

}
 
.element p {
  margin: 0;
  padding: 4px;
  text-align:justify;
  padding-bottom:10px;
}
 
.float-right {
  margin:5px 5px 5px 5px;
  float:right;
}

.tool-tip {
  color: #333;
  width: 254px;
  z-index: 13000;
  text-align:left;
  margin-left:-100px;
}
 
.tool-title {
  font-weight: bold;
  font-size: 11px;
  margin: 0;
  color: #9FD4FF;
  padding: 8px 8px 4px;
  background: url(bubble.png) top left;
}
 
.tool-text {
  font-size: 11px;
margin-top:0px;
margin-left:0px;
width: 230px;
height: 150px;
border:0px solid black;
padding:10px;
background-image: url(../img/bubble.png);
background-repeat: no-repeat;
}
 
.custom-tip {
  color: #000;
  width: 130px;
  z-index: 13000;
}
 
.custom-title {
  font-weight: bold;
  font-size: 11px;
  margin: 0;
  color: #3E4F14;
  padding: 8px 8px 4px;
  background: #C3DF7D;
  border-bottom: 1px solid #B5CF74;
}
 
.custom-text {
  font-size: 11px;
  padding: 4px 8px 8px;
  background: #CFDFA7;
}    

.msg_ok{
border:1px dashed #666666;
padding:10px;
background:#a9e892;
color:#222222;
border-radius:4px;
-moz-border-radius:4px;
}
.msg_err{
color:#222222;
border:1px dashed #666666;
padding:10px;
background:#ffa3a3;
border-radius:4px;
-moz-border-radius:4px;
}

.kategoria_header
{
height:30px; padding-left:35px;font-size:15px; font-weight:normal;background:url(../img/dir32.jpg) left top no-repeat;text-align:left;vertical-align:middle;
border-bottom:1px solid #bbb;
padding-top:10px;
}
.tooltip2{
   			display: inline;
    		position: relative;
			min-height:24px;
		
		}
	
		.tooltip2:hover:after{
    		background: #333;
    		background: rgba(0,0,0,.8);
    		border-radius: 5px;
    		bottom: 26px;
    		color: #fff;
    		content: attr(tooltip);
    		left: 20%;
    		padding: 5px 15px;
    		position: absolute;
    		z-index: 11111198;
    		width:auto;
			font-weight:normal;
			margin-top:-15px;
						
		}
		
		.tooltip2:hover:before{
    		border: solid;
    		border-color: #333 transparent;
    		border-width: 6px 6px 0 6px;
    		bottom: 20px;
    		content: "";
    		left: 50%;
    		position: absolute;
    		z-index: 11111199;
		}
.tooltip{
   			display: inline;
    		position: relative;
			min-height:24px;
			
		}
	
		.tooltip:hover:after{
    		background: #333;
    		background: rgba(0,0,0,.8);
    		border-radius: 5px;
    		bottom: 26px;
    		color: #fff;
    		content: attr(tooltip);
    		left: 20%;
    		padding: 5px 15px;
    		position: absolute;
    		z-index: 11111198;
    		width:150px;
			font-weight:normal;
			margin-top:-15px;
			
			
		}
		
		.tooltip:hover:before{
    		border: solid;
    		border-color: #333 transparent;
    		border-width: 6px 6px 0 6px;
    		bottom: 20px;
    		content: "";
    		left: 50%;
    		position: absolute;
    		z-index: 11111199;
		}
		
.slideThree {
	width: 80px;
	height: 26px;
	background: #333;
	margin: 0px auto;
   margin-top:-10px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	position: relative;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
}

.slideThree:after {
	content: 'Nie';
	font: 12px/26px Arial, sans-serif;
	color: #ddd;
	position: absolute;
	right: 10px;
	z-index: 0;
	font-weight: bold;
	text-shadow: 1px 1px 0px rgba(255,255,255,.15);
}

.slideThree:before {
	content: 'Tak';
	font: 12px/26px Arial, sans-serif;
	color: #fff;
	position: absolute;
	left: 10px;
	z-index: 0;
	font-weight: bold;
}

.slideThree label {
	display: block;
	width: 34px;
	height: 20px;

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;

	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-o-transition: all .4s ease;
	-ms-transition: all .4s ease;
	transition: all .4s ease;
	cursor: pointer;
	position: absolute;
	top: 3px;
	left: 3px;
	z-index: 1;

	-webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	background: #fcfff4;

	background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background:#2690cb;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
}

.slideThree input[type=checkbox]:checked + label {
	left: 43px;
}

.label {
    padding:5px 10px;
    background: #eee;
    border-radius:25px;
    margin:5px;
    display:inline-block;
    font-size:13px;
}
.roundedTwo {
  width: 28px;
  height: 28px;
  position: relative;
  margin: 20px auto;
  background: #fcfff4;
  background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  border-radius: 50px;
  box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
  label {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 4px;
    left: 4px;
    cursor: pointer;
    background: linear-gradient(top, #222 0%, #45484d 100%);
    border-radius: 50px;
    box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);
    &:after {
      content: '';
      width: 9px;
      height: 5px;
      position: absolute;
      top: 5px;
      left: 4px;
      border: 3px solid #fcfff4;
      border-top: none;
      border-right: none;
      background: transparent;
      opacity: 0;
      transform: rotate(-45deg);
    }
    &:hover::after {
      opacity: 0.3;
    }
  }
  input[type=checkbox] {
    visibility: hidden;
    &:checked + label:after {
      opacity: 1;
    } 
  }   
}


textarea::-webkit-scrollbar {
  width: 4px;
  background-color: none; }

textarea::-webkit-scrollbar-thumb {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.1);
  background-color: #555; }

#searchNoteForm {float:right;margin-right: 5px;margin-top: -50px;}

/*
 CSS for the main interaction
*/
.tabset {margin-top:10px;}
.tabset > input[type="radio"] {
  position: absolute;
  left: -200vw;
}

.tabset .tab-panel {
  display: none;
}

.tabset > input:first-child:checked ~ .tab-panels > .tab-panel:first-child,
.tabset > input:nth-child(3):checked ~ .tab-panels > .tab-panel:nth-child(2),
.tabset > input:nth-child(5):checked ~ .tab-panels > .tab-panel:nth-child(3),
.tabset > input:nth-child(7):checked ~ .tab-panels > .tab-panel:nth-child(4),
.tabset > input:nth-child(9):checked ~ .tab-panels > .tab-panel:nth-child(5),
.tabset > input:nth-child(11):checked ~ .tab-panels > .tab-panel:nth-child(6) {
  display: block;
}

.tabset > label {
  position: relative;
  display: inline-block;
  padding: 15px 15px 25px;
  border: 1px solid transparent;
  border-bottom: 0;
  cursor: pointer;
  font-weight: 600;
    font-size:13px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.tabset > label::after {
  content: "";
  position: absolute;
  left: 15px;
  bottom: 10px;
  width: 22px;
  height: 4px;
  background: #8d8d8d;
}

.tabset > label:hover,
.tabset > input:focus + label {
  color: #1388cb;
}

.tabset > label:hover::after,
.tabset > input:focus + label::after,
.tabset > input:checked + label::after {
  background: #1388cb;
}

.tabset > input:checked + label {
  border-color: #888;
  border-bottom: 1px solid #fff;
  margin-bottom: -1px;
}

.tab-panel {
  padding: 10px 0;
  border-top: 1px solid #888;
}




@media screen and (min-width: 1920px) {
    #wrap {max-width: 1920px !important;}
    #mainContainer {margin-right:20px !important;}
}
@media screen and (max-width: 1440px) {
    .grid {max-width: 1080px !important; margin:auto;}
}
@media screen and (max-width: 450px) {
   
    #noteTagFilter {width:100%;
    margin-bottom: 10px;
    }
    .nomobile {display: none;}
    .tabset > label {
            padding: 10px 10px 25px;
    }
    #addNoteButton {top:65px !important;}
   
    .noteDesc .material-icons {float:none !important;}
    #noteMenu {display: block !important;height:auto !important;width:auto !important;padding: 10px;
        background:#fff;
        margin-top:-20px;
        margin-left:-10px;
    border-top: 1px solid #aaa;
    z-index:100000000;
    position:fixed;
        bottom:0px;
        left:0px;
        min-height: 10px !important;
        width:calc(100vw - 20px) !important;
        padding-left:20px !important;
    }
    #noteCol1 {display: block !important;}
    
    
    .grid {width:360px;}
    body {padding-top:55px !important;}
    #noteEditDivInner{
        left:0px !important;
        top:55px !important;
        width:calc(100vw - 20px)!important;
        max-height:calc(100vh - 130px) !important;
    }
    #notificationDiv {
         left:0px !important;
        top:50px !important;
        width:calc(100vw - 20px)!important;
        z-index:100000000;
    }
    
    #labelDiv {
        left:10px !important;
        top:-50vh !important;
        width:calc(100vw - 10px)!important;
        z-index:1000000000 !important;
    }
     #colorDiv {
          left:10px !important;
        top:-50vh !important;
        width:calc(100vw - 10px)!important;
        z-index:1000000000 !important;
    }
      #contactDiv {
           left:10px !important;
        top:-50vh !important;
        width:calc(100vw - 10px)!important;
        z-index:1000000000 !important;
    }
    #sidebar {
        width:100vw;
        top:0px;
        z-index: 1000000;
        margin:0px !important;
        height:55px;
        background: none;
        box-shadow: -3px -3px 10px #aaa;
    }
    #sidemenu {
        max-width: 100vw !important;
        margin:0px !important;
    }
    #sidemenu .material-icons {
        display: inline-block !important;
        font-size: 35px !important;
        margin-right:15px !important;
    }
    #mainContainer {
        margin:0px !important;
    }
    #main {
        margin:auto !important;
        padding: 10px 0px !important;
        
    }
    .nomobile {
        display: none !important;
    }
    
    #sidemenu #logoffIcon {display:none !important;}
    #sidemenu #statsIcon {display:none !important;}
   
    #formLogin {width:240px !important;padding-top: 10px !important;padding-bottom: 0px !important;margin:auto;}
    .loginWrapper {width: 250px !important; }
    #wrap .loginWrapper {margin-top: 100px !important;}
    #toTop {bottom:10px;z-index: 1000004;}
    
    #searchNoteForm {float:none;margin-left: 5px;margin-top: 0px;}
    #addNoteButton {margin-top:-5px !important;right:20px !important;left:auto !important;}
    #notesFiltr {width:calc(100vw - 50px);margin-bottom: 20px;}
    #usersTableHeader td {display: block !important;}
    #usersNewContact {margin-right: 10px !important;margin-top:-55px !important;}
    #usersSearchForm {margin-top:-10px !important;width:calc(100vw - 20px);}
    #users_filtr {width: calc(100vw - 60px);}
    
    
    
    #kalendarz #naglowek {display: none;}
    #kalendarz .hidden {display: none !important;}
    #kalendarz li {display: block !important;width:auto !important;height:auto !important;}
    #kalendarz li .day {display: inline-block !important;}
    .sublista div {
            width: calc(100vw - 50px);

    }
}