html {
    margin: 0; 
    padding: 0; 
    background: white; 
    font-family: lato, tahoma, helvetica; 
    font-style: normal; 
    font-weight: 300; 
    color: #666; 
    font-size: 16px; 
    line-height: 18px; 
}

body {
    margin: 0; 
    padding: 0;
}

ol { overflow: hidden;  }

header {position: relative; margin: auto; width: 98%; height: 120px;}
footer {background-color: #ede7da; color: #666; padding: 20px 0; line-height: 1.5em;}
h1 {font-size: 1.6em; line-height: .7em; margin: 2rem auto;}
h2 {margin: 0; padding: 0; font-weight: 900; font-size: 3.6em; line-height: 0.7em; color: #de6d0d;}
h2 span {font-size: .5em; font-weight: 300;}
h2 span span {font-size: 1em;}
h3 {margin: 30px 0; padding: 0; font-weight: 400; text-transform: uppercase; text-align: center; font-size: 2em; line-height: 1em; color: #de6d0d;}
h3 b {font-weight: 900;}
h4 {width: 100%; text-align: center; color: #fff; background-color: #de6d0d; margin: 0; padding: 20px 0; font-size: 1.9rem; line-height: 1em; font-weight: 900; font-style: italic; border-radius: 10px 10px 0 0;}
h4 span { font-size: 1.4rem; font-weight:700; }
ol li, ul li { margin: .4rem auto; }

A:link {color: #666; text-decoration: underline;}
A:visited {color: #666; text-decoration: none;}
A:hover {color: #666; text-decoration: none;}
A:active {color: #666; text-decoration: none;}

A.menu:link {color: #de6d0d; text-decoration: none; text-transform: uppercase; border: 2px solid #ffffff; padding: 6px; margin: 0 5px; font-weight: 400;}
A.menu:visited {color: #de6d0d; text-decoration: none; border: 2px solid #ffffff;}
A.menu:hover {color: #5f2c11; text-decoration: none;}
A.menu:active {color: #de6d0d; text-decoration: none; border: 2px solid #ffffff;}

A.menu2:link {color: #666; text-decoration: none;}
A.menu2:visited {color: #666; text-decoration: none;}
A.menu2:hover {color: #666; text-decoration: underline;}
A.menu2:active {color: #666; text-decoration: none;}
footer .menu2 {margin: 5px;}
footer p {padding: 0; margin: 10px 5px; font-size: 0.8em;}

A.cta {position: absolute; display: block; width: 36%; margin: -25px 31% 0 33%; color: #ffffff; background-color: #5f2c11; border-radius: 10px; text-decoration: none; text-transform: uppercase; border: 3px solid #ffffff; padding: 0.5em 0; text-align: center; font-size: 1.2em; font-weight: 400;}
A.cta {color: #ffffff; text-decoration: none;}
A.cta:hover {color: #ffffff; background-color: #de6d0d; text-decoration: none; cursor: pointer;}
A.cta {color: #ffffff; text-decoration: none;}

.pt A.cta {position: static; width: 100%; margin: 0;  background-color: #de6d0d; padding: 1em 0;}
.pt A.cta:hover {background-color: #5f2c11;}

A.wiecej:link {color: #FAB131; text-decoration: underline; text-transform: uppercase; font-weight: 400;}
A.wiecej:visited {color: #FAB131; text-decoration: none;}
A.wiecej:hover {color: #FAB131; text-decoration: none;}
A.wiecej:active {color: #FAB131; text-decoration: none;}

#rwdtest {display: none; position: fixed; z-index: 1000; top: 0; left: 0; width: 5px; height: 30px; background-color: magenta;}
#content {width: 100%; position: absolute;}
#logo {margin-top: 30px; margin-left: 10px;}
#menu_mob {display: none; position: absolute; right: 0; top: 0;}
#menu_desk {position: absolute; right: 0; bottom: 5px; text-align: right; line-height: 3em; color: #ccc;}
#top_desk {width: 100%; background: url(../design/bgr_top_desk.jpg) no-repeat; background-position: center; background-size: cover; background-color: #E4E9EF; margin-bottom: 50px;}
#icons {width: 45%; padding: 65px 0; margin: 0 0 0 55%;}
#icons img {width: 90px; margin: 10px 30px 10px 0;}
#icons b {font-weight: 900;}

#main_mob {display: none; width: 100%;}

.container {margin: auto; width: 100%; max-width: 1680px;}
.left {float: left; width: 58%; margin: 1%;}
.right {float: right; width: 38%; margin: 1%;}
footer .right {text-align: right;}
.box {position: relative; float: left; display: inline; width: 500px; border: 3px solid #de6d0d; border-radius: 10px; margin: 0 27px 50px 27px; color: #666;}
.box ul {margin: 0 0 0 40px; padding: 0;}
.box2 {position: relative; float: left; display: inline; width: 48%; margin: 0 1% 50px 1%;}
.box2 img {border-radius: 0 0 10px 10px;}
.tab {margin: 0 auto; color: #666;}
.tab table {max-width: 60%; border: 3px solid #de6d0d; border-radius: 10px; margin: 0 auto;}
.tab table th { padding:5px 0; background-color: #de6d0d; color: #fff;}
.tab table th:nth-child(2) { width: 35%;}
.tab table td { padding: 10px 5px 10px 15px; text-align: left; border-bottom: 1px solid #de6d0d; border-right: 1px solid #de6d0d; border-left: 1px solid #de6d0d;}
.tab table td:nth-child(2)  { text-align:center; }
.tab table tr:last-child td { padding-bottom: 15px; }
/*#telefon .box2 {width: 30%; margin: 0 1.5% 50px 1.5%;}*/
#telefon .box {margin-bottom: 75px}
#internet .box {width: 380px; border: 3px solid #de6d0d; border-radius: 10px; margin: 0 17px 50px 17px; color: #666; line-height: 1rem;}
#internet p {margin: 10px;}
.kanal {border: solid 1px #E8E8E8; border-radius: 5px; margin: 5px;}
#telewizja .kanal {border: 0; border-radius: 5px; width: 9%; margin: 0.5%;}
.belka {width: 100%; background-color: #DFDFDF;}
.belka .nazwa {padding: 10px 10px 10px 10px; float: left;}
.belka .opis {text-align: right; padding: 10px 10px 10px 10px;}
.pakiet {padding: 40px 0px 0px 0px}
.pakiet p {padding: 0px 10px;}
.bgr_pakiet {background-color: #de6d0d; border-radius: 8px 6px 6px 8px; display: table; width: 100%;}
.bgr_pakiet img {border-radius: 6px 0 0 6px;}
.bgr_pakiet .left {margin: 0;}
#uslugi .box .bgr_pakiet h3 {color: #fff; text-align: left;}
.bgr_pakiet .right {color: #fff;}
#dodatki {background-color: #f5f5f5;}
#dodatki .box {float: none; display: block; border: 0; margin: 0 auto; padding: 10px; width: 80%; max-width: 1100px; background-color: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);}
#dodatki .box h3 {color: #de6d0d; margin: 20px 0 0 0;}
#uslugi {background-color: #fff;}
#uslugi .box {float: none; display: block; border: 0; margin: 0 auto; padding: 10px; width: 80%; max-width: 1100px; background-color: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);}
#uslugi .box h3 {color: #de6d0d; margin: 20px 0 0 0;}
#uslugi .box2 {width: 23%; margin: 0 1% 50px 1%;}

/* OGO */
.index_pakiety, .internet_produkty, .telefon_produkty, .telewizja_pakiety  { display:flex; justify-content:center; }
.index_pakiety h3, .internet_produkty h3, .telefon_produkty h3 { margin-top: 0px; }
.hd_informacja { margin: 0 auto; margin-top: 2rem;}
.hd_informacja > div { width:80%; max-width:1100px; text-align:left; }
.cena_pakiet { background-color: #de6d0d; text-align:center; color:#fff; padding: 10px 0; font-weight:bold; }
#uslugi .more {  display: none; }
#uslugi .pakiety-telefoniczne {  display: none; }
#uslugi .box2, #uslugi .pt { display: block;  }
#pakiety-programowe, #pakiety-tematyczne, #uslugi .pakiety-programowe, #uslugi .pakiety-tematyczne, .dodatki {  display: block; }
#uslugi .box { margin-top: 4em; }
#tti { margin: -15em 0 0 1em; position: absolute; display: none; background-color: red1; width: 93%;}
#tti h2 { line-height: 1.2em; /*color: #FAB131;*/ text-shadow: 1px 1px 1px #fff; font-size: 1.8em; text-align: right;}
/*.more {  display: none; background-color: rgba(242,242,242,.5);}*/
.wiecej { color: #FAB131; text-decoration: underline; text-transform: uppercase; font-weight: 400; cursor: pointer; padding: 0px 10px; display: inline-block;}
.wiecej:hover { text-decoration: none; }
#dekoder { max-width: 100%; display: block; margin: auto; border-radius: 10px; /*padding: 47px 0;*/}
.dodatki h3 {  margin: 10px 0; }
.all_programs { text-align: center; font-weight: 400; }
.lmenu { margin: 1rem 0; }
.lmenu:hover, #logo:hover, .box2.cta { cursor: pointer; }
.lmenu h2:hover{ color: #5f2c11; }
.header-list {
  display: flex;
  justify-content: center;
}
.header-list > div {
  width: 65.5%;
  text-align: left;
  padding: 1em 0;
  font-weight: 600;
}
.lista {
  display: flex;
  justify-content: center;
  text-align: left;
  padding: 0 0;
}
.lista > div:nth-child(1), .lista > div:nth-child(2) {
  padding: 1em;
  width: 32%;
  font-weight: 400;
  font-size: .8em;
  padding: 0 1em;
}
.lista div:first-child a:last-child .doc {
    margin-bottom: 1.6em;
}
.doc {
  font-size: 1em;
  border: 1px solid #ebebed;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: .2em;
}
.doc > div span {
  font-size: .8em;
  font-weight: 300; 
  color: #555;
} 
#pdf {
  width: 3em;
}
.kontakt {
  display: flex;
  justify-content: flex-start;
  text-align: left;
  padding: 0 0;
}

.kontakt > div {
  padding: 1em 2em;
  width: 24%;
  font-weight: 400;

}

/* cookie */
a.cookies:link { text-transform: none; padding: 0; border: 0; font-weight: 600; color: #354252; }
a.cookies:visited { color: #fff; }
a.cookies:active { color: #fff; }
a.cookies:hover { color: #fff; background-color: initial; padding: 0; border: 0; text-decoration: underline; }
#cookies {background:rgba(58,98,165,.85); color: #fff; font-size: 0.7em; line-height: 1.4em; position: fixed; z-index: 1000; right: 0; bottom: 0; margin: 0; border-radius: 0; width: 100%; display: none; text-align: center;}



/*1792*/ 
@media (max-width: 1792px) {
#rwdtest {background-color: blue;}
/*.box {width: 30.5%; border: 3px solid #336699; margin: 0 1% 50px 1%;}*/
/*#internet .box {width: 22.5%; border: 3px solid #336699; margin: 0 1% 10px 1%;}*/
}

/*1600*/ 
@media (max-width: 1600px) {
#rwdtest {background-color: orange;}
.box .kanal {width: 29%; margin: 1%;}
}

/*1536*/ 
@media (max-width: 1536px) {
#rwdtest {background-color: red;}

}

/*1440*/ 
@media (max-width: 1440px) {
#rwdtest {background-color: silver;}
h5 {font-weight: 300; font-size: 1.2em; line-height: 1em;}
.box ul {margin: 0 10px 0 30px; padding: 0;}
}

/*1366*/ 
@media (max-width: 1366px) {
#rwdtest {background-color: yellow;}
h2 {margin: 0 0 5px 0; font-size: 2em; line-height: 0.6em;}
html {font-size: 15px; line-height: 20px;}
.container {max-width: 1140px;}
#internet .box {width: 450px; border: 3px solid #de6d0d; border-radius: 10px; margin: 0 57px 50px 57px; font-size: 14px;}
#icons img {width: 70px; margin: 0 20px 0 0;}
#menu_desk {bottom: 15px;}
.box ul {margin: 0 0 0 25px; padding: 0;}
.doc { font-size: 1.2em;}
.doc > div span { font-size: .8em; } 
.header-list > div { font-size: 1.2em; }
}

/*1280*/ 
@media (max-width: 1280px) { 
#rwdtest {background-color: green;}
}


@media (max-width: 1024px) and (orientation: landscape) {
#rwdtest {background-color: pink;}
html {font-size: 15px; line-height: 18px;}
#content {top: 60px;}
#menu_mob {display: inline;}
#menu_desk {display: none;}
header {height: 60px;}
h2 {font-size: 2.2em; line-height: .7em;}
h2 span {font-size: .45em;}
A.cta:link {width: 50%; margin: -12% 25% 0 25%;}
.container {width: 100%; margin: 0 auto;}
#logo {margin-top: 15px; width: 150px; margin-left: 15px;}
#icons {width: 55%; padding: 20px 0; margin: 0 0 0 55%;}
#icons img {width: 60px; margin: 0 10px 0 0;}
.box { width: 41%; }
/*.box {width: 30%; border: 3px solid #336699; margin: 0 1% 50px 1%; font-size: 0.8em;}*/
.box ul {margin: 0 20px 0 30px;}
.tab table {max-width: 95%;}
.tab table th:nth-child(2) { width: 45%;}
#internet .box {width: 47%; border: 3px solid #de6d0d; margin: 0 1% 10px 1%;}
#telefon .box2 {width: 60%; margin: 0 20% 50px 20%;}
#uslugi .box2 {width: 40%; margin: 0 5% 50px 5%;}
.pakiet .kanal {width: 12%; margin: .5%;}
.left {float: none; width: 94%; margin: 1% 3%;}
.right {float: none; width: 94%; margin: 1% 3%;}
footer .left {float: none; width: 94%; margin: 1% 3%;}
footer .right {float: none; width: 94%; margin: 1% 3%; text-align: left;}
footer p {margin-top: 20px;}
footer {padding: 25px 0;}
.bgr_pakiet {border-radius: 6px 6px 8px 8px;}
.bgr_pakiet img {border-radius: 0 0 6px 6px;}
.bgr_pakiet .left {margin: 0; width: 100%;}
.bgr_pakiet .right {margin: 10px; text-align: center;}
#uslugi .box .bgr_pakiet h3 {text-align: center;}

.lista > div:nth-child(1), .lista > div:nth-child(2) {
  width: 40%;
  font-size: .8em;
}
.header-list > div {
  width: 82%;
}
.kontakt > div {
  width: 23%;
  font-weight: 400;
  padding: 1em 0;
}


/*#top_desk {width: 100%; background: url(../design/bgr_top_desk_horizontal.jpg) no-repeat; background-position: center; background-size: cover; background-color: #E4E9EF; margin-bottom: 50px;}*/

}

@media (max-width: 1024px) and (orientation: portrait), (max-width: 440px)  {
#rwdtest {background-color: black;}
html {font-size: 13px; line-height: 18px;}
#content {top: 60px;}
#menu_mob {display: inline;}
#menu_desk {display: none;}
#main_mob {display: inline;}
header {height: 60px;}
A.cta {width: 50%; margin: -25px 23% 0 27%; font-size: 1em;}
#telewizja .kanal {width: 24%; margin: 0.5%;}
h1 {font-size: 1.2em; line-height: 1rem;}
h2 {font-size: 2.2em; line-height: .7em;}
h2 span {font-size: .45em;}
h3 {font-size: 1.3em; line-height: 1em;}
h4 {font-size: 1.7em; line-height: 1.2em;}
.container {width: 100%;}
#logo {margin-top: 12.5px; width: 180px; margin-left: 15px;}
#top_desk {width: 100%; background: none;}
#icons img {width: 60px; margin: 10px 10px 10px 0;}
.box {float: left; display: inline; width: 93%; border: 3px solid #de6d0d; border-radius: 10px; margin: 0 2.5% 50px 2.5%;}
.box ul {margin: 0 10px 0 30px;}
#internet .box {width: 93%; border: 3px solid #de6d0d; margin: 0 2.5% 50px 2.5%;}
.box2 {width: 90%; margin: 0 5% 50px 5%;}
#telefon .box2 {width: 90%; margin: 0 5% 50px 5%;}
#uslugi .box2 {width: 90%; margin: 0 5% 50px 5%;}
.pakiet .kanal {width: 22%; margin: 1%;}
.bgr_pakiet {border-radius: 6px 6px 8px 8px;}
.bgr_pakiet img {border-radius: 0 0 6px 6px;}
.bgr_pakiet .left {margin: 0; width: 100%;}
.bgr_pakiet .right {margin: 10px; text-align: center;}
#uslugi .box .bgr_pakiet h3 {text-align: center;}
.left {float: none; width: 94%; margin: 3%;}
.right {float: none; width: 94%; margin: 3%;}
footer .left {float: none; width: 94%; margin: 1% 3%;}
footer .right {float: none; width: 94%; margin: 1% 3%; text-align: left;}
footer p {margin-top: 20px;}
footer {padding: 25px 0;}
footer .menu2 {display: block;}
.belka .nazwa {float: none; padding: 10px 0px 0px 10px;}
.belka .opis {text-align: left; padding: 0px 0px 10px 10px;}
.lista {
  flex-direction: column; 
  align-items: center;
}
.lista > div:nth-child(1), .lista > div:nth-child(2) {
  width: 90%;
  padding: 0;
}
.header-list > div {
  width: 90%;
}
.kontakt {
  flex-direction: column; 
  text-align: center;
}

.kontakt > div {

 width: 100%;
 padding: 1em 0;

}

/* OGO */
.index_pakiety h3:nth-child(1), .internet_produkty h3 { margin-top: 30px; }
.telewizja_pakiety { flex-direction:column; }
.tab table {max-width: 95%;}
.tab table th:nth-child(2) { width: 45%;}
#telefon .box { margin-bottom: 50px; }
#dekoder { padding: 0; }
#icons { display: none; width: 95%; padding: 2% 0 0 5%; margin: 0; background-color: #eaeaea;}
#top_desk { margin-bottom: 0; }
#main_mob { display: block; }
#tti { display: block; margin-top: -12em;}
.modal { font-size: 1.2rem; }

a.content:link { font-size: 1.5rem; }
a.cookies:link { font-size: .5rem; }

}