/* 
 * http: //www.w3schools.com/web/web_validate.asp
 *
 * http: //validator.w3.org/check 
  *
 *
 */


/* Home.css */
/*utf-8 ąćłóśń  */

/*reset css*/


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
 caption, 
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    /*font-size: 100%;*/
    font: inherit;
    /*font-family:Verdana,Geneva,sans-serif;*/
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
}



html {
 /*font-family: Verdana, Arial, Helvetica, sans-serif;*/
 /*font-family: Tahoma, Verdana,Helvetica,Arial; */
 font-family: Arial, Tahoma, Verdana,Helvetica; 
 font-size: 16px;
 font-weight: normal; 

 COLOR: black; 

 /*AC24*/
 /*background: #831f1f;*/
 background: #FAFAFA;
 /*background: #e2e9f1;*/

 /* background: #f2ffe0; */
 /*background: #FCFFF7;*/
 
 /*AC24*/
 /*min-height: 100%;*/
}



BODY {
 /*font-family: Arial, Tahoma, Verdana,Helvetica; 
 font-size: 12px;*/
}


table {
  border-collapse: collapse;
  border-spacing: 0;
  
}


a{
 color: #2d58ae;
 text-decoration: none;


 /*
  nie dziala 
 text-decoration: underline;
 text-decoration-line: underline;
 text-decoration-style: solid;
 text-decoration-color: red;
 */

 /*
  nie dziala
 text-decoration-line: underline;
    text-decoration-style: wavy;
    text-decoration-color: red;
 */

}

/**/
a:link {
/*color: #0000FF;*/
/*border-bottom: 2px dashed #0000FF;*/
border-bottom: 2px dashed #C0C0C0;
}

a:visited {
/*color: #0000FF;*/
border-bottom: 2px dashed #636363;
}

a:active {
/*color: #FF0000;*/
border-bottom: 2px solid #30a6fd;
}

a:hover {
/*color: #000000;*/
/*border-bottom: 2px solid #DD0000;*/
border-bottom: 2px solid #1f60f4;
}



/*fonty zle sie przenosza z table trzeba bezposrednio robic table.xxx td lub th*/

table td, table th{
 /*border: 1px solid blue;*/

 font-family: Arial, Tahoma, Verdana,Helvetica; 

 text-align: left;
 text-wrap: normal; 

 /*font-size: 12px;*/

  /*color: red; */
}


table th{
 color: #00037f; 
}


/*
ol, ul, li {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
}
*/


li {
/*margin-left: 10px;
padding-left: 10px;
*/

/*
 outline-width: 2px;
 outline-color: blue;
 outline-style: solid;
*/
  /*border: 10;*/

 /*margin-left: 0.5em; */
  
}

.ListaTekts li {
 margin-left: 1em; 
}

.ListaTekts ul {
 margin-left: 1em; 
}


span {
 /*outline: Violet  dashed 1px;*/

}

b {
 font-weight: bold;
}

em {
  font-style:italic;
} 

small {
 font-size: 11px;
}

figure 
{
 /*font-size: 1.2em;*/
 /*font-size: 12px;*/
 margin: 2em 0 1em 0;
 text-align:justify;

 /*outline: red dashed 1px;*/

 width: 100%;

}

p
{
 /*font-size: 1.2em;*/
 /*font-size: 12px;*/
 margin: 0 0 1em 0;
 text-align:justify;
 hyphens: auto;
 /*outline: red dashed 1px;*/

 width: 100%;

}


p.forInput{
 margin-top: 8px;
 margin-bottom: 15px;
 /*margin-right: 50px;*/
 margin-left: 2px;
 /*FONT-SIZE: 12px;*/
}

p.forInputMsg{
 color: red;

 margin-top: 8px;
 margin-bottom: 15px;
 /*margin-right: 50px;*/
 margin-left: 2px;
 /*FONT-SIZE: 12px;*/
}

p.forInputError{
 color: red;

 margin-top: 8px;
 margin-bottom: 15px;
 /*margin-right: 50px;*/
 /*margin-left: 2px;*/
 /*FONT-SIZE: 12px;*/
 font-weight: bold;
}



FORM {
/* FONT-FAMILY: Verdana,Helvetica,Arial; 
 FONT-SIZE: 12px;*/
}


/*COLOR: #0B1237;   */
INPUT, SELECT, TEXTAREA{

 /*FF mial problem z dziedziczeniem po html*/
 /*
 font-family: Arial, Tahoma, Verdana,Helvetica; 
 FONT-SIZE: 13px;

 background-color: #FFFDCB;

 width: 120px;*/
}


/*
SELECT: required { 
 border-style: solid;
 BACKGROUND-COLOR: lightblue; 
}
*/

/*nie wiem czemu, ale Select nie chce dzialac w ramach  #signup*/
/*background-color: #e7fdd3;*/
/*
select: optional {
 border-width: thick;
 background-color: LightGrey;
}
*/

h1 {
 margin-top: 10px;
 FONT-SIZE: 1.8em;
}

h2 {
 FONT-SIZE: 1.6em;
}

h3 {
 FONT-SIZE: 1.4em;
}

h4 {
 FONT-SIZE: 1.2em;
}

/*dla wizytowki*/
td h2 {
 FONT-SIZE: 1.5em;
}

td h3 {
 FONT-SIZE: 1.2em;
}



article {
 
 /*height: auto;*/
 /*min-height: 100%;*/

}

/*format obszaru z tabela do parametrow dla diagramow dynamicznych*/
#SPCFormAndTable {
 height: 400px; 
 overflow: scroll;
 width:100%;
 max-width:800px;
 background-color: #fffff4;

}

/* środek strony */
#boxCentrum{
 /*AC24 */
 /*min-height:100%;
 position:relative;*/

 /*background-color: red;*/
 /*background-color: white;*/
 
 /*top, bottom = 0; left, right = auto = centrowany */
 /*AC24 */
 /*margin: 0 auto;*/
 /*szerokość*/
 /*AC24 */
 /*width: 998px;*/

 /*AC24 */
  /*
  padding-top:110px;
  width:100%;
  max-width:980px;

  margin-left:auto;
  margin-right:auto;


 border: 1px solid green;*/
 /*font-family: Arial,sans-serif;*/
 /*box-shadow: 0 20px 20px 0 #d6dfe8;*/
}

/*dla mail form*/
#box1Small{
 width: 672px;
 margin: 0 auto;
 background: #fff;
 color: #3f3f3f;
 
 /*100% == tylko 100% ekranu, poniżej nic*/
 /*height: 100%;*/
 /*height: auto;*/
 min-height: 200px;


 /*font-family: Arial,sans-serif;*/
 /*box-shadow: 0 20px 20px 0 #d6dfe8;*/
 z-index: 1;

}

#box2  { 
 position : relative; 
 width : 998px; 
 margin : 0 auto; 
 background : #fff; 
 color : #3f3f3f; 
 /*font-family : Arial, sans-serif; */
 box-shadow : 0 20px 20px 0 #d6dfe8; 
 z-index : 1; 
}

/*miejsce na menu*/
#boxHeader {
 /*background:#ff0;*/
 background: white;
 padding:10px;

 height: 51px;

 text-align: left;
}

#boxInfo {
  /*background-color: yellow;*/
  
  background-color: white;
  
  padding-top:80px;
  padding-bottom:80px;
  width:100%;
  max-width:980px;
  margin-left:auto;
  margin-right:auto;

  padding-left:10px;
  padding-right:10px;


  /*AC24*/
  /*
  padding-top: 100px;
  padding-right: 300px;
  padding-bottom: 100px;
  padding-left: 50px;
  */
  /*AC24*/
  /*height: 900px;*/
  /*
  height: calc(100% - 200px);
  min-height: calc(100% - 200px);
  */
  /*heigh of view point*/
  height: 100vh;
  overflow: auto;
  /*border: 1px solid blue;*/

 box-sizing: border-box;


}


#boxInfo > p {
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
}

/*jezeli sa obok siebie to zredukuj margines*/
#boxInfo > p + ul { 
 margin-top: -0.5em; 
}

/*jezeli sa obok siebie to zredukuj margines*/
#boxInfo > p + ol { 
 margin-top: -0.5em; 
}

/*
#boxInfo.p > img + figcaption { 
 margin-top: -1.5em; 
}
*/


#boxInfo > h1 {
 font-size: 36px;
 margin-bottom: 1em;
}

#boxInfo > h2 {
 margin-top: 1em;
 margin-bottom: 1em;
}

/*jezeli sa obok siebie to zredukuj margines*/
#boxInfo > h2 + p { 
 margin-top: -1.2em; 
}


#boxInfo > h3 {
 margin-bottom: 1em;
}

#boxInfo > h4 {
 margin-bottom: 1em;
}

#boxInfo > ul {
 padding-bottom: 1em;
 padding-left: 2em;
 padding-right: 2em;
 text-align:justify;
}


#boxInfo > ul+li {
 padding-bottom: 1em;
 padding-left: 4em;
 padding-right: 2em;
 text-align:justify;
}



#boxInfo > ol {
 padding-bottom: 1em;
 padding-left: 2em;
 padding-right: 2em;
 text-align:justify;
}

#boxInfo > table {
 margin-bottom: 1em;
 margin-left: 2em;
}


#boxInfoTools {
  /*background-color: yellow;*/
  background-color: white;
  
  padding-top: 40px;
  padding-bottom: 80px;

  width:100%;
  max-width:850px;

  margin-left:auto;
  margin-right:auto;

  padding-left:10px;
  padding-right:10px;


  height: 100vh;
  overflow: auto;
  border: 1px solid blue;
 
}


#boxInfoTools > p {
  text-align: justify;
  text-justify: inter-word;
}

#boxInfoTools > h1 {
 font-size: 36px;
 padding-bottom: 1em;
}

#boxInfoTools > ul {
 padding-bottom: 0.5em;
 padding-left: 2em;
}


#boxFooter {

position:fixed; 
text-align: center;

 /*position:absolute;*/
 bottom:0;
 width:100%;
 /*height:60px; */  /* Height of the footer */
 /*height:3em; */
 height:40px; 
 padding-top: 1em;
 /*padding: 2em 0;*/
 margin-top: 3em;


 background:#baf8fe;
 /*background:#6cf;*/
}

/*
#boxFooter > span {
  display: inline-block;
  vertical-align: middle;
}
*/




/*sprawdzanie form*/
select:required,
input:required,
textarea:required
{
border-style: solid;
/*border-width: thick;*/
/*background-color: #fde2d3;*/
background-color: lightblue;
}

/*pola nie wymagane*/
input:optional,
select:optional,
textarea:optional
{
 background-color: yellow;
 border-width: thick;
 /*background-color: LightBlue;*/
}

select:valid,
input:valid,
textarea:valid
{

 background-color: #e7fdd3;

 /*background-image: url('./img/valid_up2.png');*/

 background-position: right bottom;
 
 /*background-position-y: -5px;*/

 /*background-position: right top;*/
 background-repeat: no-repeat;

 /*border-color: green;*/
 border: 1px solid green;
}

select:invalid,
input:invalid,
textarea:invalid{
 /*background-color: #f08080;*/
 background-color: #fde2d3;

 /*background-image: url('./img/invalid.png');*/
 
 background-repeat:no-repeat;
 background-position:right top;
 
 /*background-position-y: 3px;*/
 /*background-position: right bottom;*/

 /*border-color: red;*/
 border: 1px solid red;
}


legend {
 background: yellow;
 margin-left: 10px;
 margin-right: 10px;

 padding-left: 10px;
 padding-right: 10px;

 padding-top: 5px;
 padding-bottom: 5px;

 font-weight: bold;

}



/*formy rejestracji itd. i podawania danych*/

#signup
{
 /*AC24*/
 /*
 margin: 5px auto;
 width: 670px;
 */

 FONT-SIZE: 16px;
 z-index: 10;

 box-sizing: border-box;

}


#signup fieldset 
{
 /*outline daje obramowanie niezależne od border
 obramowanie wokol calości * */
 /*
 outline-width: 1px;
 outline-color: black;
 outline-style: solid;
 */
 /*outline:#00FF00 dotted thick;*/
 /*outline:#00FF00 dotted 2px;*/


 /*obramowanie */
 /*border:1px solid green;*/
 border:2px solid #dbf3cd;
 background-color: #fffff4;

 margin: 0 0 20px;
 /*margin: 20px;*/
 padding: 10px;
 border-radius: 8px;
 z-index: 10;


}

#signup ol
{
 /*
 outline-width: 1px;
 outline-color: red;
 outline-style: dashed;
 */
 /*i rownowazny*/ 

 /*outline: red dashed 1px;*/


 /*list-style-type: decimal;*/
 list-style-type: none;
 padding: 0;
 margin: 0;
 z-index: 10;
}

#signup ul
{
 /*
 outline-width: 1px;
 outline-color: red;
 outline-style: dashed;
 */

 /*outline: red dashed 1px;*/

 /*list-style-type: decimal;*/
 list-style-type: none;
 padding: 0;
 margin: 0;
 z-index: 10;
 
 /*AC24*/
 /*border: 1px solid red;*/

}


#signup li
{
 /*outline: gray dashed 1px;*/

 /*margin: 0 0 6px;*/
 margin: 8px 0px 8px 20px;


 /*
 top padding is 25px
 right padding is 50px
 bottom padding is 75px
 left padding is 100px
 */

 /*wg wskazuwek zegara gora, prawy, dolny, lewy*/
 padding:0px 0px 0px 0px;

 /*UWAGA !!! ten parametr powodował przeźroczystość!!!!! */
 /*position: relative;*/
 z-index: 10;

 /*border: 1px solid black;*/

 /*display: inline-block;*/

}

#signup ul li
{
 text-indent: 0;
 padding-left: 0;
 list-style-position: inside;
}


#signup label
{
 /*outline: yellow solid 1px;*/

 /*width: 180px;*/
 /*AC24*/
 /*width: 150px;*/
  width: 30%;

 display: inline-block;
 /*vertical-align: top;*/
 /*vertical-align: middle;*/
 vertical-align: top;
 z-index: 10;
}

#signup fieldset input,
#signup fieldset select
{
 /*outline: blue dashed 1px;*/

 display: inline-block;

 /*AC24*/
 /* width: 430px;*/
  width: 60%;
  
  /*uwzględnienie w wielkości */
  box-sizing: border-box;


 /* drugie 24 dla lewej strony na odkrycie łapki*/
 /*opera ma problemy
 padding: 3px 24px 3px 3px;*/
 
 padding-top: 2px;
 padding-bottom: 2px;
 padding-right: 22px;
 padding-left: 2px;

 margin-top: 2px;
 margin-bottom: 2px;

 
/*  transition: background-color 1s ease;
 */  

 border: 1px solid #fff;
 border-radius: 5px;

 vertical-align: top;
 /*vertical-align: bottom;*/
 z-index: 10;
}

#signup fieldset select  
{ 
 /*background-color: yellow;*/
 /*background: white;*/
 /*width: 371px; */
 /*width: 430px; 
 padding: 3px; 
 z-index: 10;*/

 /*AC24*/
 /*width: 430px;*/
  /*width: 63%;*/
  box-sizing: border-box;

}

/* specjalnie do tabeli parametrów diagramów*/
#signup fieldset table select  
{ 
  width: 120px;
}



#signup fieldset input[type="checkbox"]
{
 /*backgorund: inherit;*/
 /*background-color: lightgrey;*/
 background-color: inherit;
 /*display: inline-block;*/
 width: 40px;
 height: 20px;

 border: 2px solid lightblue;
 border-radius: 5px;

 /*to jest Opery, bo próbuje pokazywać image*/
 background-image: none;


 /*padding: 1px 1px 26px 1px;*/
 padding-top: 0px;
 padding-bottom: 0px;
 padding-right: 3px;
 padding-left: 0px;

 z-index: 10;
}

/*radio in survey*/
#signup fieldset input[type="radio"][name^="arrS"]
{
 /*backgorund: inherit;*/
 /*background-color: lightgrey;*/
 background-color: inherit;
 /*display: inline-block;*/
 width: 60px;
 height: 20px;

 border: 2px solid lightblue;
 border-radius: 5px;

 /*to jest Opery, bo próbuje pokazywać image*/
 background-image: none;


 /*padding: 1px 1px 26px 1px;*/
 padding-top: 0px;
 padding-bottom: 0px;
 padding-right: 3px;
 padding-left: 0px;

 z-index: 10;
}


/*
#signup fieldset  textarea {
 min-height: 42px;
 min-width: 350px;
 max-width: 430px;

 height: 52px;
 width: 430px;
 overflow: auto;
}
*/
#signup fieldset  textarea.email {
 min-height: 250px;

 /*AC24*/
 /* 
 min-width: 350px;
 max-width: 430px;

 height: 202px;
 width: 430px;
 */
 /*width: 63%;*/

 width: 60%;
 box-sizing: border-box;

 border: 1px solid #fff;
 border-radius: 5px;

 overflow: auto;
}

#signup fieldset  textarea.Survey{
 min-height: 250px;

 width: 94%;

 border: 1px solid #fff;
 border-radius: 5px;

 overflow: auto;
}



/* input[type=file] { width: 300px; border: 2px solid red; }*/

#signup fieldset input[type="file"]  {
 display: inline-block;
 width: 430px;
 min-width: 350px;

 border: 1px solid #fff;
 /*padding: 3px 26px 3px 3px;*/
 /* drugie 24 dla lewej strony na odkrycie łapki*/
 padding: 3px 24px 3px 3px;
 
 border-radius: 5px;
 vertical-align: top;
 z-index: 10;
 }





 
/* 
#signup input: optional {
 background-color: LightGray;
 }      
*/
 
#signup fieldset output 
{  
 background-color: lightgrey;
 display: inline-block;
 width: 400px;
 border: 1px solid #fff;
 padding: 3px 26px 3px 3px;
 
 border-radius: 5px;
 vertical-align: top;
 z-index: 10; 
} 




/*do formatowania opisu i img*/
#signup fieldset p.list 
{  
 background-color: lightblue;
 display: inline-block;
 width: 422px;
 border: 1px solid #fff;
 padding: 3px 3px 3px 3px;
 /*padding: 5px 5px 5px 5px;*/
 
 border-radius: 5px;
 vertical-align: top;
 z-index: 10;
} 

/*beleczka w oddzielajac poszczegolne atrakcje*/
#signup fieldset p.ListHead, #signup fieldset h2.ListHead  
{
 font-weight: bold;
 font-size: 13px;

 /*odstęp nas p*/
 margin-top:20px;

 background-color: rgba(124, 231, 231, 0.92);
 display: inline-block;
 /*width: 640px;*/
 width: 100%;
 
 padding: 3px 3px 3px 3px;
 border-radius: 5px;
 vertical-align: top;
 z-index: 10;
} 

/*dla szukaj i pokaz*/
fieldset.FieldSetSzukaj
{
 background-color: #92d050;
}


/* formatowania opisu i img */
#signup fieldset img.list 
{  
 vertical-align: text-top;
 
 /*padding: 3px 9px 3px 3px;*/

 /*margin: 5px 5px 5px 5px;*/
 margin: 3px 3px 3px 3px;
 
 display: inline; 
 float: left; 
 border-radius: 5px;

 z-index: 10;
}

#signup fieldset img.ShowList 
{  
 vertical-align: bottom;
 margin: 0px 0px 0px 0px;
 /*padding: 2px 2px 2px 2px;*/
 /*padding: 3px;*/
 padding: 0px 2px 5px 5px;
 
 border-radius: 5px;
 z-index: 10;
 float: left; 
} 



/*
#signup fieldset select: required
{
 background-color: lightblue;
}
*/
/*form dla Tool is Knowledge */

#ConfirmParametersForm 
{
 /*AC24*/
 /*margin-bottom: 10px;*/

 
 /*margin: 5px auto;*/

 /*AC24*/
 /*width: 600px;*/

 FONT-SIZE: 16px;
 z-index: 10;
}


#ConfirmParametersForm fieldset 
{
 /*outline daje obramowanie niezależne od border
 obramowanie wokol calości * */
 /*
 outline-width: 1px;
 outline-color: black;
 outline-style: solid;
 */
 /*outline:#00FF00 dotted thick;*/
 /*outline:#00FF00 dotted 2px;*/


 /*obramowanie */
 /*border:1px solid blue;*/
 border:2px solid #dbf3cd;
 background-color: #fffff4;


 /*margin: 0 0 20px;*/
 /*margin: 20px;*/
 padding: 10px;
 border-radius: 8px;
 z-index: 10;
}

#ConfirmParametersForm ul
{
 /*
 outline-width: 1px;
 outline-color: red;
 outline-style: dashed;
 */
 /*i rownowazny*/ 

 /*outline: red dashed 1px;*/


 /*list-style-type: decimal;*/
 list-style-type: none;
 padding: 0;
 margin: 0;
 z-index: 10;

 /*border: 1px solid red;*/
 
}

#ConfirmParametersForm li
{

 /*outline: gray dashed 1px;*/

 /*margin: 0 0 6px;*/
 /*margin: 2px 0px 2px 5px;*/
 margin: 8px 0px 8px 20px;


 /*
 top padding is 25px
 right padding is 50px
 bottom padding is 75px
 left padding is 100px
 */

 /*wg wskazuwek zegara gora, prawy, dolny, lewy*/
 padding:0px 0px 0px 0px;

 /*UWAGA !!! ten parametr powodował przeźroczystość!!!!! */
 /*position: relative;*/
 z-index: 10;
}



#ConfirmParametersForm label
{
 /*outline: yellow solid 1px;*/

 /*width: 180px;*/
 /*AC24*/
 /*width: 350px;*/
  width: 50%;


 display: inline-block;
 /*vertical-align: top;*/
 /*vertical-align: middle;*/
 vertical-align: top;
 z-index: 10;
}

#ConfirmParametersForm fieldset input,
#ConfirmParametersForm fieldset select
{
 /*outline: blue dashed 1px;*/

 display: inline-block;
 /*AC24*/
 /*width: 199px;*/

 width: 45%;


 /* drugie 24 dla lewej strony na odkrycie łapki*/
 /*opera ma problemy
 padding: 3px 24px 3px 3px;*/
 
 padding-top: 2px;
 padding-bottom: 2px;
 padding-right: 22px;
 padding-left: 2px;

 
/*  transition: background-color 1s ease;
 */  

 border: 1px solid #fff;
 border-radius: 5px;

 vertical-align: top;
 /*vertical-align: bottom;*/
 z-index: 10;
}



#ConfirmParametersForm fieldset input[type="checkbox"]
{
 /*backgorund: inherit;*/
 /*background-color: lightgrey;*/
 background-color: inherit;
 /*display: inline-block;*/
 width: 40px;
 height: 20px;

 border: 2px solid lightblue;
 border-radius: 5px;

 /*to jest Opery, bo próbuje pokazywać image*/
 background-image: none;


 /*padding: 1px 1px 26px 1px;*/
 padding-top: 0px;
 padding-bottom: 0px;
 padding-right: 3px;
 padding-left: 0px;

 z-index: 10;
}

#ConfirmParametersForm  textarea.email {
 min-height: 150px;

 /*AC24*/
 /* 
 min-width: 350px;
 max-width: 430px;

 height: 202px;
 width: 430px;
 */
 width: 95%;

 overflow: auto;
}


.Eng 
{
 /*backgorund: inherit;*/
 /*background-color: lightgrey;*/
 background-color: inherit;
 /*color: #C3CCD3;*/
 color: #000066;

}


#Eng 
{
 /*backgorund: inherit;*/
 /*background-color: lightgrey;*/
 background-color: inherit;
 /*color: #C3CCD3;*/
 color: #000066;

}


#TOL_Desc {
  height: 300px;
  overflow:auto;
  padding-right:1em; 
}






/* select[value~="km"] { color: red }*/
/*to nie dziala*/
/*
[value~=km] { 
 
 color: red; 

 }
*/
/* to działa*/ 
/*
[title~=Podaj] 
{ 
 color: blue; 
 border: 5px solid yellow;
}
*/


/* format dla select wewnatrz tabeli */
select[rel="SelectInTable"][name^="arrCecha"],
input[rel="SelectInTable"][name^="arrCecha"]
{

 /*trzeba okreslic, bo zle sie dziedziczy*/
 font-size: 12px;

 /*color: darkblue;*/

 /*background-color: inherit;*/
 background-color: #c7f1fa;
 /*display: inline-block;*/

 width: 270px  !important;
 height: 26px  !important;

 border: 1px solid lightblue;

 /* musi byc important, bo tylko Fire Fox zle dziedziczy pozostale przyjęłyby bez important*/
 padding: 3px 1px 3px 1px  !important;
 /*
 padding-top: 3px  !important;
 padding-bottom: 3px  !important;
 padding-right: 3px  !important;
 padding-left: 3px  !important;
 */

 z-index: 10;
}


li.noNum {
 list-style-type: none;
 background-color: green;
 font-weight: bold;
}


/*dla regulaminu*/
div.ScrollRegul
{
border: 2px dotted #000;
background-color: #fdfcd8;
width: 600px;
height: 300px;
overflow: scroll;
padding: 5px;
}



div.scroll
{
background-color: #fdfcd8;
width: 600px;
height: 200px;
overflow: scroll;
padding: 5px;
}

table.result
{
/*width: 100%;*/
 /*border-collapse: collapse;*/

 /*FONT-FAMILY: Verdana,Helvetica,Arial; */
 
 /*FONT-SIZE: 12px;*/
 FONT-WEIGHT: normal; 
 COLOR: black; 
 BACKGROUND: #F0BF6A;
 TEXT-DECORATION: none;

 /*IE do not interpreter nowrap correctly, use also TD.nowrap*/
 /*white-space: nowrap;*/
 /*Sequences of whitespace will collapse into a single whitespace. Text will wrap when necessary, and on line breaks*/

 /*white-space: pre-line;*/
}


/* 
table.result tr 
{
text-align: left;
border: 1px solid #C3CCD3;

padding-top: 3px;
padding-bottom: 3px;
padding-left: 3px;
}*/

/*table.result th */
table.result th 
{
font-size: 13px;
font-weight: bold; 

text-align: left;

COLOR: #4448EC; 

BACKGROUND: #F0BF6A;

border: 1px solid #C3CCD3;

padding-top: 3px;
padding-bottom: 3px;
padding-left: 3px;
}


table.result td 
{
/* FONT-SIZE: 11px;*/
 FONT-WEIGHT: normal; 
 BACKGROUND: #FFFDEB;

 /*text-align: left;*/
 border: 1px solid #C3CCD3;

 padding-top: 3px;
 padding-bottom: 3px;
 padding-left: 3px;
}


table.result tr.alt2 td 
{
 FONT-SIZE: 12px;
 vertical-align: middle;
 
 color: #000000;
/*background-color: #EAF2D3;*/
 BACKGROUND: #FFFAC1;
border: 1px solid #C3CCD3;

padding: 4px;
}


table.result tr.alt1 td 
{
 FONT-SIZE: 12px;
 vertical-align: middle;
 
 color: #000000;
/*background-color: #EAF2D3;*/
 BACKGROUND: #FFFDEB;
border: 1px solid #C3CCD3;
padding: 4px;
}


table.result tr.altError td.altError 
{
 color: #000000;
/*background-color: #EAF2D3;*/
 BACKGROUND: red;
 border: 1px solid #C3CCD3;
}



/* properties for class dropt */
 /* usage: <span class="dropt" title="">HTML text<span style="width: 500px;">Pop-up text</span></span> */
 /* usage: <span class="dropt" title="">HTML text<span><img src="example.jpg"/></span></span> */
span.dropt {
 border-bottom: thin dotted; background: #ffeedd; 
}

/*uwaga nie oddzielać hover od wlasiwej nazwy

 span.dropt:hover - dobrze
 span.dropt: hover - zle
 * */

span.dropt:hover {
 text-decoration: none; 
 background: #ffffff; 
 z-index: 6; 
}

span.dropt span {
 position: absolute; 
 left: -9999px;
 margin: 40px 0 0 0px; 
 padding: 3px 3px 3px 3px; 
 border-style: solid; 
 border-color: black; 
 border-width: 1px;
}

span.dropt:hover span {
 left: 2%; margin: 20px 0 0 170px; background: #ffffff; z-index: 6;
}




/*musi byc !important, aby nadpisac klase hasDatepicker, ktora jest z automatu*/
input.MyDatePicker  
{
 FONT-FAMILY: Arial, Tahoma, Verdana,Helvetica !important; 
 width: 80px !important;
 BACKGROUND: #add8e6 !important;
 color: #000000 !important;
 padding: 3px 3px 3px 3px !important;
}


/*
input.MyDatePicker: valid
{
 background-image: url();

}
*/


/*link do strony*/
a.Strona {

 /*outline: Violet dashed 1px;*/

 /*overflow:scroll;*/

 /*width: 200px  !important;*/

 FONT-SIZE: 12px;
 /*font-weight: bold;*/

 /*white-space: pre-line;*/
 -ms-word-break: break-all;
     word-break: break-all;
-moz-word-break: break-all;


   word-wrap: break-word;

     /* Non standard for webkit */
   word-break: break-word;
   
    /*opera*/ 
    word-wrap: break-word;
   -moz-word-wrap: break-word;

 /*  
-webkit-hyphens: auto;
   -moz-hyphens: auto;
        hyphens: auto;
*/

}


div {
 /*font-family: Tahoma, Verdana,Helvetica,Arial; */
 /*font-size: 13px;*/
 /*border-radius: 15px;*/

}



footer {
  /*position:absolute;
  bottom:0;*/
  /*width:100%;*/

 position: relative;
 margin: 0 auto;

 /*width: 998px;*/

  height:3em; 
  

  background : #47F9E4; 
  /*background : #feffeb; */
  /*background:#b5fbbd;*/
  padding:1em 1.5em 1em 2em;


 position:absolute;
   bottom:0;
   width:100%;
   height:60px;   /* Height of the footer */
   background:#6cf;


 /*z-index: 100;*/

}

/*
footer p{
 background : #feffeb; 
}
*/


.center {
  text-align: center;
}

/*kreska pod podpisem artykułu
 * class="SignatureLine"*/
.SignatureLine {
  width:50%;
  text-align:left;
  margin-left:0;
}

/* class="ArticleSignature" */
.ArticleSignature {
  text-align: left;
}


/*80-100 ziel*/
#spQuizResult1{
 background:#3ec261;
}

/*50-80 zolt*/
#spQuizResult2{
 background: #fffd85;
}

/*30-50 pomar*/
#spQuizResult3{
 background: #ffa057;
}

/*0-30 czerw*/
#spQuizResult4{
 background: #ff5c5c;
}


#ButtonLeft  {
  float: left; 
  padding-right: 50px;
}

#ButtonRight { 
 float: right; 
 padding-left: 50px;
}

/*class="ImgKnowledge600" */
.ImgKnowledge150 {
  height: auto; 
  width: 150px; 
}

.ImgKnowledge200 {
  height: auto; 
  width: 200px; 
}

.ImgKnowledge250 {
  height: auto; 
  width: 250px; 
}

.ImgKnowledge350 {
  height: auto; 
  width: 350px; 
}


.ImgKnowledge400 {
  height: auto; 
  width: 400px; 
}


.ImgKnowledge600 {
  height: auto; 
  width: 630px; 
  /*height: 410px;*/
}


#IframeComment {
  height: 500px;
  width: 100%;
  background: #fffdeb;
}

#IframeToolBox{
  /*height: 80%;*/
  /*height: 870px;*/
  height: 100%;

  width: 100%;
  align: middle;
  /*background: #fffdeb;*/
}


/*Format do IFrame*/

#HiddenForm {
display: none;
}

p.CommentRow0 {
 background-color: #f6fffe;
 padding: 15px;
 margin-right: 20px;
 width: 95%;
}

p.CommentRow1 {
 background-color: #ffdf9c;
 padding: 15px;
 width: 95%;
 margin-right: 20px;
}

.Nick {
 font-weight: bold;
}

 /*Button to hide / show form in Comment*/
#NewComment {
  /*font-size: 18px;
  font-weight: bold;*/
  height: 60px;
 }

/*END: Format do IFrame*/


#ImgJa {
 /*width: 220px; */
 width: auto; 
 height: 303px; 
 float: left;  
 padding-right: 30px;
}

#ImgMaco {
 /*width: 220px; */
 width: 100%; 
 height: auto; 
 float: left;  
 /*padding-right: 30px;*/
 padding-bottom: 20px;*/
}



.ImgArticle {

}

select.Input60 {
 width: 360px; 
}

button {
 padding: 10px;
}

button:hover {
  color: white;
  background: black;
}

select:hover,
input:hover,
textarea:hover
{
 outline: #f9de6d dashed 5px;
}

.WaskiRadio
{
  width: 0px;
}

@media (max-width:980px) {

 table td, table th{
  font-size: 20px;
 }

 #boxInfo {
   width: calc(100% - 30px);
   font-size: 25px;
 }

 /*
 #boxInfoTools {
   width: calc(100% - 30px);
   font-size: 25px;
 }
 */

 #signup 
 {
   font-size: 25px;
 }

 
 #signup fieldset select,
 #signup fieldset input,
 #signup fieldset  textarea.email 
 { 
   font-size: 25px;
 }

 #signup fieldset input
 { 
   height: 60px;
 }

 #signup label {
  font-weight: bold;
 }

 button{
  font-size: 25px;
  font-weight: bold;
  height: 60px;
 }
 
 /*Button to hide / show form in Comment*/
 #NewComment {
  font-size: 18px;
  font-weight: bold;
  height: 80px;
 }

 #ImgQuiz {
   width: 100%;
 } 

 #ImgJa {
   width: 50%;
   height: auto; 
   padding-right: 5%;
   /*padding-left: 10px;*/
 }

 .ImgKnowledge150 {
   height: auto; 
   width: 100%;
 }

 .ImgKnowledge200 {
   height: auto; 
   width: 100%;
 }

 .ImgKnowledge250 {
   height: auto; 
   width: 100%;
 }

 .ImgKnowledge350 {
   height: auto; 
   width: 100%;
 }

 .ImgKnowledge400 {
   height: auto; 
   width: 100%;
 }

 .ImgKnowledge600 {
   height: auto; 
   width: 100%;
 } 

 #ConfirmParametersForm 
 {
   font-size: 25px;
 }

 
 #ConfirmParametersForm fieldset select,
 #ConfirmParametersForm fieldset input,
 #ConfirmParametersForm fieldset  textarea.email 
 { 
   font-size: 25px;
 }

 #ConfirmParametersForm fieldset input
 { 
   height: 60px;
 }

 #ConfirmParametersForm label {
  font-weight: bold;
 }

 figcaption {
   text-align: left;
 }

#signup fieldset table select  
{ 
  width: 180px;
}


}

/*
svg {
 border: 1px solid red;
}
*/

#HistScroll {
 height: 500px;
 width: 630px;
 overflow: scroll;
 /*max-width: 605px;*/
}



@media (max-width:900px) {

 #boxInfoTools {
   width: calc(100% - 30px);
   font-size: 25px;
 }
}

@media (max-width:530px) {
 #boxFooter {
   height:60px; 
 }

 #ImgJa {
   width: 100%;
   height: auto; 
   padding-right: 1px;
 }


}

@media (max-width:590px) {
  
  /*przyciski z quiz form*/
  #ButtonLeft {
    padding-right: 0px;
  } 

  /*przyciski z quiz form*/
  #ButtonRight { 
    float: left; 
    padding-left: 0px;
    padding-top: 60px;
  }

 #signup 
 {
   font-size: 20px;
 }

 #signup fieldset
 { 
   font-size: 20px;
   /*background: #bcfeff;*/
 }

 #signup fieldset select,
 #signup fieldset input,
 #signup fieldset  textarea.email 
 { 
   font-size: 20px;
   width: 95%;
   /* Ustawienie szerokości, aby uwzględnić padding */
   /* Dzieki temu zmieciło sie w kolumnie*/
   box-sizing: border-box;
 }

 #signup label
 {
  /*outline: yellow solid 1px;*/

  /*width: 180px;*/
  /*AC24*/
  /*width: 150px;*/
  width: 95%;

  /*display: inline-block;*/
 }

 #ConfirmParametersForm 
 {
   font-size: 20px;
 }

 #ConfirmParametersForm fieldset
 { 
   font-size: 20px;
   /*background: #bcfeff;*/
 }

 #ConfirmParametersForm fieldset select,
 #ConfirmParametersForm fieldset input,
 #ConfirmParametersForm fieldset  textarea.email 
 { 
   font-size: 20px;
   width: 90%;
 }

 #ConfirmParametersForm label
 {
  /*outline: yellow solid 1px;*/

  /*width: 180px;*/
  /*AC24*/
  /*width: 150px;*/
  width: 95%;

  /*display: inline-block;*/
 }


 


}

/*
@media (max-width:500px) {

 #signup li
 {
   display: block;
 }
}
*/

/*
@media (max-width: 605) {
 svg {
   width: 95%; 
   height: auto;
 }
}
*/


/*@media (max-width:980px) */



/* ----------- Galaxy S5 ----------- */

/* Portrait and Landscape */
/*
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) {


  #signup
  {
   margin: 5px auto;
   width: 670px;
  FONT-SIZE: 22px;
   z-index: 10;
  }


  INPUT, SELECT, TEXTAREA {
      FONT-SIZE: 18px;
  }

}
*/ 

/* Portrait */

/*
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) 
  and (orientation: portrait) {


  #signup
  {
   margin: 5px auto;
   width: 670px;
   FONT-SIZE: 30px;
   z-index: 10;
  }


  INPUT, SELECT, TEXTAREA {
      FONT-SIZE: 18px;
  }

  input[type="button"] {
   FONT-SIZE: 24px;
 
  }
   
  #signup fieldset input[type="radio"][name^="arrS"]
  {
   height: 40px;
  }

  #signup fieldset input[type="checkbox"]
  {
   height: 40px;
  }

  p.forInput {
    FONT-SIZE: 24px;
  }

  #signup li {
    FONT-SIZE: 24px;
  }

  p {
    FONT-SIZE: 24px;
  }

}
*/

/*
@media only screen and (max-height: 600px) {

  #boxInfo {
    
    height: 600px;
    overflow: auto;

  }
}

@media only screen and (min-height: 900px) {

  #boxInfo {
    
    height: 900px;
    overflow: auto;

  }
}
*/