*, ::before, ::after {box-sizing: border-box;}
*, html, body {margin: 0; padding: 0; font-family: 'Roboto', Arial, Helvetica, sans-serif;}
body {background-color: #f9f9f9; }
a {text-decoration: none; }
.flex {display: flex;}
.flexWrap {flex-wrap: wrap;}
.flexCol {display: flex; flex-direction: column;}

/* colors CD */
.BGcervenohneda {background-color: #782327;}
.BGcervena {background-color: #cd202c;}
.BGoranzova {background-color: #ff671F;}
.BGzlutapend {background-color: #ffcb4f;}
.BGzlutozele {background-color: #ccdc00;}
.BGzelena {background-color: #00AF3F;}
.BGzelenatmava {background-color: #004438;}
.BGmodratmava {background-color: #002664;}
.BGmodrasvetla {background-color: #009FDA;}
.BGstribrna {background-color: #BABDBA;}

.cervenohneda {color: #782327;}
.cervena {color: #cd202c;}
.oranzova {color: #ff671F;}
.zlutapend {color: #ffcb4f;}
.zlutozele {color: #ccdc00;}
.zelena {color: #00AF3F;}
.zelenatmava {color: #004438;}
.modratmava {color: #002664;}
.modrasvetla {color: #009FDA;}

/* login */
#login, #contentswitch { max-width: 450px; position: absolute; top: -1rem; right: 0; padding: 0.75rem; background: #fff; border: 1px solid #e8e8e8; color: #778899; }
#login_diskuze { max-width: 450px; position: relative; top: -1rem; right: 0; padding: 0.75rem; background: #fff; border: 1px solid #e8e8e8; color: #778899; }
  #login h3, #login_diskuze h3, #contentswitch h3 { margin: 7px 0; font-size: 120%; text-transform: uppercase; }
  #login table, #login_diskuze table { margin: 1rem 0; font-size: 80%; }
  #login table td, #login_diskuze td { padding: 0.15rem; }
  #login a, #login_diskuze a { color: #009FDA; text-decoration: underline; }
  #login p, #login_diskuze p, #contentswitch p { margin: 0; padding: 0.25rem 0; font-size: 85%; }
  #login p.close, #login_diskuze p.close, #contentswitch p.close { float: right; font-size: 100%; }
  #login p.close a, #login_diskuze p.close a, #contentswitch p.close a { color: red; text-decoration: underline; }
  #login input[type=text], #login_diskuze input[type=text] { width: 190px; padding: 0.5rem; color: #778899; border: 1px solid lightgray; float: left; }
  #login input[type=password], #login_diskuze input[type=password] { width: 83px; padding: 0.5rem; color: #778899; border: 1px solid lightgray; float: left; }
  #contentswitch select { }
  #login input[type=submit], #login_diskuze input[type=submit] { float: left; margin-left: 7px; border: 1px solid #d3d3d3; background-color: rgba(212, 212, 212, 0.6); color: #778899; padding: 0.5rem 1rem; cursor: pointer; text-transform: uppercase; }

/* header */
header {max-width: 81.5rem; margin: 0 auto; border-bottom: 1px solid lightgray; position: relative; }

.headerTop { display: flex; align-items: center; margin: 2rem 0 0 2rem;}
.headerTop .logo {margin-right: 3rem; position: relative;}
.headerTop .logo a {position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 10;}
.headerTop input {height: 57px; width: 400px; border: 1px solid lightgray; padding: 1rem; color: lightgray;}
.headerTop .search {height: 57px; width: 180px; border: 1px solid #d3d3d3; background-color: rgba(212, 212, 212, 0.6); border-left: none; color: grey; cursor: pointer; }
input .search [type=submit] {margin: auto; font-size: 80%; font-weight: bold; }
input:hover [type=submit] {cursor: pointer;}

.linkSign {justify-content: flex-end; flex: 1; justify-content: space-between; align-items: center; color: #778899; }
.linkSign > span:first-child { flex-basis: 30%; padding-left: 1rem; }
.linkSign > span:last-child { flex-basis: 68%; padding-right: 1rem; text-align: right; } 
.linkSign a {text-decoration: underline; color: #009FDA;}
.linkSign a.wwwcd {text-decoration: none; flex: 2; align-items: flex-start;}
.linkSign a.wwwcd:hover {text-decoration: underline;}
.linkSign a.wwwcd span{color: grey}

/* menu */
#menubox { padding: 1.5rem 0 0 0; }
#menu { padding: 0 1.5rem 1rem 1.5rem; display: block; }
#menu li { display: inline-block; list-style-type: none; }
#menu li a { color: gray; border-left: 1px dotted gray; padding: 0 0.5rem; font-size: 18px; display: block; }
#menu li a:hover {text-decoration: underline;}
#menu li a.over {text-decoration: underline;}
/* menu overlap firstchild */
#menubox { position: relative; }
.menuoverlap { position: absolute; left: 1.4rem; top: 1em; z-index: 10; width: 5px; height: 30px; background: #f9f9f9; display: block; }

/* menu closer */
#menucloser { display: none; width: 100%; background: #4C4F54; border-bottom: 1px solid #1E2126; }
#menucloser:hover { background: #2E3136; }
#menucloser a { display: block; text-decoration: none; color: #fff; background:url('/images/cdin/menucloser.svg') 15px top no-repeat; font-weight: 900; padding: 1em 1em 1em 55px; font-size: 105%; -webkit-transition: background 500ms ease; -moz-transition: background 500ms ease; -ms-transition: color 500ms ease; -o-transition: background 500ms ease; transition: background 500ms ease; }
#menucloser a.close { background-position: 15px bottom; }

/* submenu */
#submenu { padding: 1rem 1.5rem;  background: #efefef; border-top: 1px solid #ccc; display: block; }
#submenu li { display: inline-block; list-style-type: none; }
#submenu li a { color: gray; border-left: 1px dotted gray; padding: 0 0.5rem; font-size: 16px; display: block; }
#submenu li a:hover {text-decoration: underline;}
#submenu li a.over { text-decoration: underline; }
 
/* section */
section, #main {max-width: 81.5rem; margin: 0 auto; color: #031425; }
#main { display: flex; flex-wrap: wrap; justify-content: space-between; }

/* top infoboxes */
.infoboxes { margin: 2rem 0; justify-content: space-between; }
.infoboxes .box { flex-basis: 19.2%; margin: 0; text-align: center; text-transform: uppercase; border-bottom: 1px solid gray; font-size: 1.6rem; padding: 1em 0; } 
.infoboxes .box span { margin: auto; color: white; padding: 1rem; background-image: url('/images/cdin/arrow.svg'); background-position: center 200px; background-repeat: no-repeat; -moz-transition: all 100ms ease; -ms-transition: all 100ms ease; -o-transition: all 100ms ease; transition: all 300ms ease;  }
.infoboxes .box:hover span { padding-top: 0.25rem; padding-bottom: 1.75rem; background-position: center bottom;  }

/* top infoboxes2  pro testovaci homepage*/
.infoboxes2 { margin: 2rem 0; justify-content: space-between; }
.infoboxes2 .box { flex-basis: 15.3%; margin: 0; text-align: center; text-transform: uppercase; border-bottom: 1px solid gray; font-size: 1.5rem; padding: 1em 0; } 
.infoboxes2 .box span { margin: auto; color: white; padding: 1rem; background-image: url('/images/cdin/arrow.svg'); background-position: center 200px; background-repeat: no-repeat; -moz-transition: all 100ms ease; -ms-transition: all 100ms ease; -o-transition: all 100ms ease; transition: all 300ms ease;  }
.infoboxes2 .box:hover span { padding-top: 0.25rem; padding-bottom: 1.75rem; background-position: center bottom;  }

/* main */
.main {display: flex; justify-content: space-between;}

/* main left */
.mainLeft {flex-basis: 49%; margin-bottom: 1rem;}

/* main news */
.news {background-color: white; border-bottom: 1px solid lightgray; position: relative;}
.news div {padding: 2rem;}
.news a {position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 10;}
.news:hover p{text-decoration: underline;}
.news span{font-size: 75%;}
.news h3 {color: #009FDA; padding: 0.5rem 0;}
.news img { display: none; }
.news p { text-align: justify; }

.mainLeft .news:first-child {background-color: #002664; color: white; display: flex; flex-direction: column;}
.mainLeft .news:first-child h3 {color: white; font-size: 1.5rem;}
.mainLeft .news:first-child div {padding: 2.4rem 2rem;}
.mainLeft .news:first-child img { display: inline-block; width: 100%; height: auto; max-height: 436px; }

/* main right */
.mainRight {flex-basis: 49%;}

/* right news */
.newsR {display: flex; flex-wrap: wrap; justify-content: space-between;  }
.newsRbox {flex-basis: 48%; border-bottom: 1px solid lightgray; margin-bottom: 1.5rem; position: relative; background-color: white; }
.newsRbox h3 {padding: 0 0 0.8rem 0; color: gray;}
.newsRbox a {position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 10;}
.newsRbox div { padding: 0.8rem; display: flex; align-items: center;}
.newsRbox div p span { display: block; }
.newsRbox div p span:first-child { color: #009FDA; font-size: 90%; }
.newsRbox div p span:last-child { color: #778899; padding-top: 0.5rem; font-size: 80%; }
.newsRbox:hover div p span:first-child { text-decoration: underline; }
.newsRbox:hover div p span:last-child { text-decoration: none; }
.newsRbox div img { height: 80px; padding-right: 0.5rem;}

/* more nesw */
.allNews a {text-decoration: underline; color: gray; font-size: 90%;}
.allNews a:hover {color: #009FDA;}

/* banner */
.banner {margin: 1.8rem 0; position: relative;}
.banner a {position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 10;}
.banner img {max-width: 100%;}

/* more news down */
.allNewsdown {margin: 1rem 2rem;}
.allNewsdown a {text-decoration: underline; color: gray; font-size: 90%;}
.allNewsdown a:last-child  {text-decoration: underline; color: gray; font-size: 90%;; border-left: 1px solid grey; margin-left: 0.8rem; padding-left: 0.8rem;}
.allNewsdown a:first-child  {text-decoration: underline; color: gray; font-size: 90%;; border-right: 1px solid grey; margin-right: 0.8rem; padding-right: 0.8rem;}
.allNewsdown a:hover {color: #009FDA;}

.allNewsdown.ITpod a:last-child { border-left: none; margin-left: 0; padding-left: 0;}

/* podstranky */
/* COLS */
#cols { padding: 2em 0; } /* novy styl pro situaci kdy mam jen jeden sloupec */

#cols12 { padding: 2em 0; flex-basis: 79%; display: flex; flex-wrap: wrap; justify-content: space-between; } /* ten zabira vzdy jen tolik mista aby zbylo vpravo misto pro sloupec COL3 */

#col3 { flex-basis: 20%; padding-top: 2em; } /* prave menu */
#col3 h3 { color: #1A9DD3; font-size: 140%; font-weight: 400; }
#main #col3 a { color: #0F2A61; }
#col3 .doyouknow { background: #ECEFF4; padding: 1.5em; margin-top: 0.5em; }

#col1alone { width: 100%; padding: 0 2em; margin-top: 1rem;} /* ten je když nemá vlevo menu, ale má ho pro změnu vpravo */

#col1 { flex-basis: 25%; order: -1; } /* levé menu */ 
#col2 { flex-basis: 72%; padding-left: 1em; } /* ten je kdyz je to hlavni obsah a ma vlevo menu */

/* leve menu */
#main #col1 ul { margin: 0; padding: 0; }
#main #col1 ul li { list-style-type: none; margin: 0; padding: 0; }
#main #col1 ul li a { background: #DADDE2; color: #30353B; display: block; padding: 0.85em 1em; margin-bottom: 1px; text-decoration: none; }
#main #col1 ul li a:hover { background: #C9CCD1; }

/* prave menu */
#main #leftmenu ul { margin: 0 0 2em 0; padding: 0; }
#main #leftmenu ul li { list-style-type: none; margin: 0; padding: 0; }
#main #leftmenu ul li a { background: #DADDE2; color: #30353B; display: block; padding: 0.85em 1em; margin-bottom: 1px; text-decoration: none; text-align: left; }
#main #leftmenu ul li a:hover { background: #C9CCD1; }
#main #leftmenu ul li a.over { background: #4C4F54; color: #fff; }

#main #leftmenu ul ul { margin-bottom: 0; padding-left: 1em; text-align: left; }
#main #leftmenu ul ul a { font-size: 90%; }

#main #leftmenu ul ul ul { margin-bottom: 0; padding-left: 1em; text-align: left; }
#main #leftmenu ul ul ul a { font-size: 90%; }

#main .favoriteslinks ul { text-align: left; }

/* zeleznicar HP */
.newarticles { display: inline-block; vertical-align: top; padding-top: 2em; width: 59%; }
#main .newarticles h2 { color: #0F2A61; }
.linkslist { display: inline-block; vertical-align: top; padding-top: 2em; width: 35%; padding-left: 2%; margin-left: 2%; }
#main .linkslist h2 { color: #0F2A61; }

/* filtr */
#main form { width: 100%; }
fieldset.filtr { background: #f5f5f5; border: 1px solid #dadadb; margin: 20px 0; padding: 1em; color: #666; width: 100%; display: block; }
  .filtr legend { border-left: 3px solid #dadadb; padding: 0 1em; color: #999; font-weight: 300; }

  .filtr .col1 { display: inline-block; vertical-align: top; width: 22%; max-width: 200px; padding: 0 1em 0 0; }
  .filtr .col1 strong { font-weight: 400; display: block; padding-bottom: 0.5em; }
  .filtr .col1 input { min-width: 130px;  }
  .filtr .col1 img.ui-datepicker-trigger { margin: 0; padding: 0 0 0 10px; }
  
  .filtr .col2 { display: inline-block; vertical-align: top; width: 22%; max-width: 200px; padding: 0 1em 0 0; }
  .filtr .col2 strong { font-weight: 400; display: block; padding-bottom: 0.5em; }
  .filtr .col2 input { min-width: 130px; }
  .filtr .col2 img.ui-datepicker-trigger { margin: 0; padding: 0 0 0 10px; }
  
  .filtr .col3 { display: inline-block; vertical-align: top; width: 18%; max-width: 200px; padding: 0 1em 0 0; }
  .filtr .col3 strong { font-weight: 400; display: block; padding-bottom: 0.5em; }
  .filtr .col3 select { min-width: 130px; }
  
  .filtr .col4 { display: inline-block; vertical-align: top; width: 18%; max-width: 200px; padding: 0 1em 0 0; }
  .filtr .col4 strong { font-weight: 400; display: block; padding-bottom: 0.5em; }
  .filtr .col4 select { min-width: 130px;  }
  
  .filtr .col5 { display: inline-block; vertical-align: top; padding-top: 20px; width: 10%; }

form.smallform { margin: 0; padding: 0; }
form.smallform input[type=text] { background: #fff; float: left; }
form.smallform input[type=submit] { margin: 0 0 0 5px; float: left; }
form.smallform select[name=firma] { margin: 0 0 0 5px; float: left; }

/* drobeckova */
#main p.breadcrump, p.breadcrump { display: block !important; width: 100%; max-width: 81.5rem; background: #EEEFF1 !important; padding: 1.5em 2em !important; margin: 0 auto -2em auto !important; color: #9198A0 !important; }
#main p.breadcrump a, p.breadcrump a { color: #9198A0; text-decoration: underline; }
#main p.breadcrump a:hover, p.breadcrump a:hover { color: #363D45; }

/* footer */
footer {max-width: 81.5rem; margin: 2rem auto 0 auto; border-top: 1px solid lightgrey; justify-content: space-between; padding: 1.5rem 2rem;}
footer div {flex-basis: 24%;}
footer div h3 {font-weight: 1400; padding-bottom: 1rem;}
/*footer div h3 span {color:#cd202c;}*/
footer div h4 {font-weight: 1000; padding-bottom: 1rem;}
footer div a {display: block; text-decoration: underline; color: gray; line-height: 1.45;}
footer div a:hover {color: #009FDA;}

/* defaultní HTML prvky */
#main h1 { color: #0F2A61; font-size: 220%; font-weight: 400; padding-bottom: 0.5em; }
#main h1 + #main p { padding-bottom: 0; }
#main h2 { color: #1A9DD3; font-size: 160%; font-weight: 400; padding-bottom: 0.5em; }
#main h3 { color: #1A9DD3; font-size: 140%; font-weight: 700; padding: 0.25em 0 0.5em 0; }
#main h4 { color: #0F2A61; font-size: 120%; font-weight: 700; padding: 0.25em 0 0.5em 0; }
#main h5 { color: #0F2A61; font-size: 110%; font-weight: 700; padding: 0.25em 0 0.5em 0; }

#main p, #main ul { padding: 0.5em 0 1em 0; text-align: justify; }
#main ul, #main ol { padding-left: 2em; }
#main ul li, #main ul ol { padding: 0.35em; }

#main div.div_disc>p { padding: 0;}

#main a { color: #1A9DD3; text-decoration: underline; }
#main a:hover { text-decoration: none; }

.reset { width: 100%; height: 1px; overflow: hidden; clear: both; display: block; }

#main table { border: 1px solid #ccc; border-collapse: collapse; margin: 0.5em 0; }
#main table th { border: 1px solid #ccc; background: #003b79; color: #fff; border-collapse: collapse; padding: 0.5em 1em; text-align: left; }
#main table td { border: 1px solid #ccc; border-collapse: collapse; padding: 0.5em 1em; }

#main .date { font-style: italic; color: rgba(0,0,0,0.5); }

#main img { max-width: 100%; }

#main .listfull .thumb { max-width: 200px; }
#main .thumb.left, #main .iluleft { margin: 0 1rem 1rem 0; float: left; }
#main .thumb.right, #main .iluright { margin: 0 0 1rem 1rem; float: right; }

.gbox { clear: both; padding: 25px 30px; background: #fff; }
.gbox h2 { margin-top: 0; padding-top: 0; }

/* import ze starych stylu */

.listfull { clear: both; }
.listfull p.title { padding: 0; margin: 0 0 0.5rem 0; }
.listfull p.text { padding: 0; margin: 0; }

.listfull .row1, .listfull .row2 { clear: both; margin: 0; padding:  1rem 0; }
.listfull .row1 {  }
.listfull .row2 {  }

.list { padding: 0 0 0 5px; clear: both; }
  /*     .list p.title { background: url('/images/cdi/oddblackarr.gif') 0 10px no-repeat; padding: 5px 0 0 8px; margin-bottom: 5px; }   */
  .list p.text { background: url('/images/cdi/bgline.gif') bottom repeat-x; padding: 0 0 20px 8px; margin-top: 0; }

.listfull { clear: both; background: url('/images/cdi/bgline.gif') bottom repeat-x; }
  .listfull p.title { padding: 0; margin: 0 0 5px 0; }
  .listfull p.text { padding: 0; margin: 0; }

  .listfull .row1, .listfull .row2 { clear: both; margin: 0; padding: 15px 10px; min-height: 140px; }
  .listfull .row1 { background: #f3f3f3 url('/images/cdi/bgline.gif') top repeat-x; }
  .listfull .row2 { background: url('/images/cdi/bgline.gif') top repeat-x; }

.listing { color: #cdcdcd; padding: 10px 15px; }
  .listing p { margin: 0; padding: 0; }
  .listing a, .listing strong { padding: 0 3px; }
  .listing strong { color: #000; }
  .listing span { color: #000; }

.gallery { }
  .gallery p { margin: 0; padding: 5px 0; }
  .gallery a img { border: 2px solid #cfcfd0; margin: 0 9px 0 0; max-width: 135px; max-height: 105px; }
  .gallery a:hover img { border: 2px solid #404040; }
  .gallery a.lightcolor { font-size: 95%; }

.smallgallery { padding: 0;  }
  .smallgallery p { margin: 0; padding: 0; }
  .smallgallery a img { border: 2px solid #cfcfd0; margin: 0 3px 0 0; max-width: 135px; max-height: 105px; }
  .smallgallery a:hover img { border: 2px solid #404040; }
  .smallgallery a.lightcolor { font-size: 95%; }

.enquiry {}
body.zeleznicar .enquiry { padding-top: 5px; }
  .enquiry p.answer { margin-bottom: 5px; }
  .enquiry p.answer a { color: #000; }
  .enquiry p.answer span { color: #969696; }
  .enquiry p.noodle { margin-top: 0; }
  .enquiry p.noodle span { background: #009cdf; display: block; height: 7px; overflow: hidden; }
  body.zeleznicar .enquiry strong { font-size: 145%; color: #000; }
  body.zeleznicar .enquiry p.noodle span { background: #92d400; }

.otherlinks { padding-top: 5px; }
.otherlinks select { font-size: 100%; width: 192px; }

.extrabox { padding: 20px; background: #efefef; }
.extrabox h2, .extrabox h3, .extrabox h4, .extrabox h5, .extrabox h6 { margin-top: 0; margin-top: 0; color: #000; }
.extrabox p, .extrabox ul { margin-bottom: 0; margin-bottom: 0; }

.extraboxl { float: left; width: 190px; padding: 20px; background: #efefef; margin-right: 15px; margin-bottom: 5px;}
.extraboxl h2, .extraboxl h3, .extraboxl h4, .extraboxl h5, .extraboxl h6 { margin-top: 0; margin-top: 0; color: #000; }
.extraboxl p, .extraboxl ul { margin-bottom: 0; margin-bottom: 0; }

.extraboxp { float: right; width: 190px; padding: 20px; background: #efefef; margin-left: 15px; margin-bottom: 5px;}
.extraboxp h2, .extraboxp h3, .extraboxp h4, .extraboxp h5, .extraboxp h6 { margin-top: 0; margin-top: 0; color: #000; }
.extraboxp p, .extraboxp ul { margin-bottom: 0; margin-bottom: 0; }

  form { margin: 0; padding: 0; }
  input[type=text], input[type=password] { border: 1px solid #d9d9da; background: #fff; color: #000; padding: 0.5em 1em; }
  input[type=submit] { font-size: 95%; border: 1px solid #808080; background: #364149; color: #fff; padding: 0.5em 1em; }
  input[type=submit]:hover { background: #0b0f13; cursor: pointer; }

  select { padding: 0.25em; border: 1px solid #ccc; }

  /* uni styly s rozmery pro ruzne doladeni vsemoznych prvky */
  .w10 { width: 10px; }
  .w20 { width: 20px; }
  .w25 { width: 25px; }
  .w30 { width: 30px; }
  .w40 { width: 40px; }
  .w50 { width: 50px; }
  .w60 { width: 60px; }
  .w70 { width: 70px; }
  .w80 { width: 80px; }
  .w90 { width: 90px; }
  .w100 { width: 100px; }
  .w120 { width: 120px; }
  .w130 { width: 130px; }
  .w140 { width: 140px; }
  .w150 { width: 150px; }
  .w160 { width: 160px; }
  .w180 { width: 180px; }
  .w200 { width: 200px; }
  .w220 { width: 220px; }
  .w240 { width: 240px; }
  .w250 { width: 250px; }
  .w255 { width: 255px; }
  .w260 { width: 260px; }
  .w280 { width: 280px; }
  .w300 { width: 300px; }
  .w320 { width: 320px; }
  .w340 { width: 340px; }
  .w350 { width: 350px; }
  .w360 { width: 360px; }
  .w380 { width: 380px; }
  .w400 { width: 400px; }
  .w420 { width: 420px; }
  .w440 { width: 440px; }
  .w460 { width: 460px; }
  .w470 { width: 470px; }
  .w480 { width: 480px; }
  .w500 { width: 500px; }
  .w550 { width: 550px; }
  .w600 { width: 600px; }
  .w650 { width: 650px; }
  
  .h14 { height: 14px; }
  .h15 { height: 15px; }
  .h16 { height: 16px; }
  .h17 { height: 17px; }
  .h18 { height: 18px; }
  .h19 { height: 19px; }
  .h20 { height: 20px; }
  .h22 { height: 22px; }
  .h24 { height: 24px; }
  .h45 { height: 48px; }
  .h75 { height: 80px; }
  
  .m5 { margin: 5px; }
  .m8 { margin: 8px; }
  .m10 { margin: 10px;}
  
  .p2 { padding: 2px;	}
  .p5 { padding: 5px;	}
  .p8 { padding: 8px;	}
  .p10 { padding: 10px; }
  
  .ptop5 { padding-top: 5px; }
  .ptop10 { padding-top: 10px; }
  .ptop15 { padding-top: 15px; }
  
  .p2x { padding: 0 2px;	}
  .p5x { padding: 0 5px;	}
  .p8x { padding: 0 8px;	}
  .p10x { padding: 0 10px; }
  
  .p2y { padding: 2px 0;	}
  .p5y { padding: 5px 0;	}
  .p8y { padding: 8px 0;	}
  .p10y { padding: 10px 0; }

  /* ---- odkazy a jejich ikonky ---- */
  #main ul li.pdf { background: url( '../images/cdi/ico_pdf.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; margin-left: -1em; list-style-type: none; }
  #main a.pdf { background: url( '../images/cdi/ico_pdf.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; }
  
  #main ul li.doc { background: url( '../images/cdi/ico_doc.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; margin-left: -1em; list-style-type: none; }
  #main a.doc { background: url( '../images/cdi/ico_doc.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; }
  
  #main ul li.docx { background: url( '../images/cdi/ico_doc.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; margin-left: -1em; list-style-type: none; }
  #main a.docx { background: url( '../images/cdi/ico_doc.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; }
  
  #main ul li.dotx { background: url( '../images/cdi/ico_doc.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; margin-left: -1em; list-style-type: none; }
  #main a.dotx { background: url( '../images/cdi/ico_doc.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; }
  
  #main ul li.xls { background: url( '../images/cdi/ico_xls.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; margin-left: -1em; list-style-type: none; }
  #main a.xls { background: url( '../images/cdi/ico_xls.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; }
  
  #main ul li.xlsx { background: url( '../images/cdi/ico_xls.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; margin-left: -1em; list-style-type: none; }
  #main a.xlsx { background: url( '../images/cdi/ico_xls.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; }
  
  #main ul li.gif { background: url( '../images/cdi/ico_gif.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; margin-left: -1em; list-style-type: none; }
  #main a.gif { background: url( '../images/cdi/ico_gif.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; }
  
  #main ul li.tiff { background: url( '../images/cdi/ico_tif.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; margin-left: -1em; list-style-type: none; }
  #main a.tiff { background: url( '../images/cdi/ico_tif.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; }
  
  #main ul li.rtf { background: url( '../images/cdi/ico_doc.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; margin-left: -1em; list-style-type: none; }
  #main a.rtf { background: url( '../images/cdi/ico_doc.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; }
  
  #main ul li.jpg { background: url( '../images/cdi/ico_jpg.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; margin-left: -1em; list-style-type: none; }
  #main a.jpg { background: url( '../images/cdi/ico_jpg.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; }
  
  #main ul li.zip { background: url( '../images/cdi/ico_zip.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; margin-left: -1em; list-style-type: none; }
  #main a.zip { background: url( '../images/cdi/ico_zip.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; }
  
  #main ul li.ppt { background: url( '../images/cdiico_ppt.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; margin-left: -1em; list-style-type: none; }
  #main a.ppt { background: url( '../images/cdiico_ppt.gif' ) left no-repeat; padding: 0.5em 0.5em 0.5em 1.5em; }
  
  /* rating */
  .rating-info {
    /*float: right;*/
    clear: both;
    margin-bottom: 10px;
  }
  .rating-info .rating-info {
    margin-bottom: 0px;
  }
  .rating-info form {
    display: inline-block;
    float: right;
  }
  .clearfix {
    clear: both;
  }
  .social {margin: 2rem auto 0 auto; max-width: 60rem; display: block}
  .social div {display: flex; margin: 1rem 0;}
  .social div i{color:#778899;}
  .social div span {padding-left: 1rem;}
  .social div span a {text-decoration: none; color: #778899; display: block; padding: 0.2rem 0 0rem; line-height: 1.4; border-bottom: 1px solid white; transition: 0.4s ease;}
  .social div span a:hover {border-bottom: 1px solid;}

  #fancybox-wrap { box-sizing: unset !important; }

  /* souteze */
  .cdkviz { }
  
  .kvizerror { display: block; padding: 0.75em; margin: 0.25em 0 0.75em 0; background: red; color: #fff; }
   
  .question { padding: 0.5em 0; line-height: 1.8; }
  .question textarea { width: 100%; max-width: 700px; }
  
  .cdkvizhelp { display: inline-block; padding: 0.25em 1em 0.25em 38px; margin: 0.25em 0 0.5em 0; background: #E7F3FE url('/images/cdin/info.svg') 10px center no-repeat; border: 1px dotted #C8D8E9; color: #778798; font-size: 95%; }
  
  .cdkvizidentity { padding: 1em 0; margin-top: 1em; border-top: 1px solid #ccc;  }
  .cdkvizidentity p { padding: 0.5em 0; }
  .cdkvizidentity p label { display: inline-block; min-width: 80px; }

  /* ankety */
  .enquiry {}
  #main p.answer { padding: 0.25em 0 0.1em 0; }
  #main p.noodle { padding: 0; }


/* dan css pro fragment profese na HP */

.profR {display: flex; flex-wrap: wrap; justify-content: space-between; padding: 1.4rem; margin-bottom: 1.5rem; background-color: white; border-bottom: 1px solid lightgray;}
.profRbox {flex-basis: 48%; position: relative; font-size: 95%;}
.profRbox a {position: absolute; left: 0; right: 0; width: 100%; height: 100%; z-index: 10;}
.profRbox div {padding: 0.8rem; display: flex; align-items: center;}
.profRbox div img { height: 40px; padding-right: 1rem; border-left: 2px solid #009FDA; padding-left: 0.8rem;}
.profRbox:hover div img { border-left: 2px solid #002664;}

.profRbox:hover div p span {color: #009FDA;}

.profRbox div span img { height: 40px; padding-right: 1rem; border-left: 2px solid #ff671f; padding-left: 0.8rem;}
.profRbox:hover div span img { border-left: 2px solid #cd202c;}

/* diskuze */
.discussions { color: #778899; border-top: 1px solid #ccc; margin-top: 0.75em; padding-top: 0.75em; }
.discussions .contentbox { border-top: 1px solid #ccc; margin-top: 0.5em; }
.discussheader { font-size: 110%; }
#main .discussheader a { color: #778899; display: inline-block; padding: 0 0 0 0.25rem; }
.discussheader strong { display: inline-block; padding: 0 0.25rem; color: #364149; }
.discussions em span { color: #B6C7D8; }

.discussions textarea { width: 100%; min-height: 10rem; margin: 0.5rem 0; border: 1px solid #ccc; }
.discussions input[type=submit] { text-transform: uppercase; }

#main .discussions ul { margin-bottom: 0; padding-bottom: 0; padding-left: 0;  }
#main .discussions ul ul, #main .discussions ul ul ul, #main .discussions ul ul ul ul, #main .discussions ul ul ul ul ul, #main .discussions ul ul ul ul ul ul { padding-left: 1em !important; } /* diskuze zalomeni az do 5 urovne, pak uz vsude stejne viz dalsi radek */
#main .discussions ul ul ul ul ul ul ul { padding-left: 0 !important; } 

#main .discussions>ul { padding-left: 0; margin-bottom: 1em; padding-top: 1em; font-size: 100%; border-bottom: 1px solid #ccc; }
#main .discussions>ul>li { list-style-type: none; }
#main .discussions>ul>li>ul { padding-bottom: 0; margin-left: 1em; }
#main .discussions>ul>li>ul>li { list-style-type: square; }
#main .discussions ul strong { color: #364149; }

#main .discussions>ul form { text-align: right; }
#main .discussions>ul form input[type=submit] { background: #959CA4; border: none; font-size: 90%; }
#main .discussions>ul form input[type=submit]:hover { background: #717880; }

#main .discussions .showbutton { cursor: pointer; background: transparent !important; border: none; width: 200px; text-align: right; color: #00ADEF !important; padding: 0; text-decoration: underline; text-transform: none !important; font-size: 100%; }
#main .discussions .showbutton:hover { text-decoration: none; }

.div_disc { padding-top: 0.75em; } 

/* formulare */
form { margin: 0; padding: 0; }
input[type=text], input[type=password] { border: 1px solid #d9d9da; background: #fff; color: #000; padding: 0.45em 1em; }
input[type=submit] { font-size: 95%; border: 1px solid #808080; background: #364149; color: #fff; padding: 0.45em 1.5em; }
input[type=submit]:hover { background: #0b0f13; cursor: pointer; }

select { padding: 0.25em; border: 1px solid #ccc; }

  /* dan css pro fragment CSR akce na HP */
  
  /*.pakceR {display: flex; flex-wrap: wrap; justify-content: center; padding: 1.4rem; margin-bottom: 1.5rem; background-color: white; border-bottom: 1px solid lightgray;}
  .pakceRbox {flex-basis: 40%; position: relative; font-size: 95%;}
  .pakceRbox:first-child {margin: 0 3rem;}
  .pakceRbox h3 {color: #009FDA; padding: 0.3rem 0;}
  .pakceRbox a {position: absolute; left: 0; right: 0; width: 100%; height: 100%; z-index: 10;}*/
  /* .pakceRbox div {padding: 0.8rem; display: flex; align-items: center;} */
  /*.pakceRbox div.block {display: block;}
  .pakceRbox div img { width: 200px; padding-right: 1rem;}
  
  .pakceRbox:hover div p {color: #009FDA;}*/

  /* dan uprava 2 novinky homepage */
  /*.pakceR { justify-content: space-between; padding: 2rem; }
  .pakceRbox { flex-basis: 45%; position: relative; }
  .pakceRbox p { text-align: justify; }
  .pakceRbox div img { width: 270px; padding-right: 0rem; }
  .pakceRbox:first-child { margin: 0rem; }*/
  
  /* JARDA komplet predelani PAKCE */
  .pakceR {display: block; text-align: center; padding: 1.5rem; margin-bottom: 1.5rem; background-color: white; border-bottom: 1px solid lightgray; }
  .pakceRbox { display: inline-block; vertical-align: top; width: 49%; padding: 0 1rem; font-size: 95%; position: relative; text-align: left; }
  .pakceRbox:first-child { padding-left: 0; padding-right: 1em; }
  .pakceRbox:last-child { padding-left: 1em; padding-right: 0; }
  .pakceRbox h3 {color: #009FDA; padding: 0.3rem 0;}
  .pakceRbox a {position: absolute; left: 0; right: 0; width: 100%; height: 100%; z-index: 10;}    
  .pakceRbox div img { width: 270px !important; max-width: 100% !important; padding-right: 1rem;}
  .pakceRbox:hover div p {color: #009FDA;}
  .pakceRbox p {text-align: justify;}
  
  .videohp { }
  .videohp h3 { padding: 1rem 0; }
  .iframehp { } 
  
  .benefity {}

@media (max-width: 1300px){

  /* header */
  .headerTop input { width: 350px; }
  .searchBox { padding: 0.5em 0; }  

   fieldset.filtr { margin-left: 1em; margin-right: 1em; width: auto; } 

}

@media (max-width: 1100px){

  /* header */
  .headerTop { display: block; margin: 1rem 0 0 1rem;}
  .headerTop div { margin: 0.5rem 0; }
  .headerTop input { width: 250px; } 
  
  .linkSign > span:first-child { flex-basis: 50%; padding-left: 0; }
  .linkSign > span:last-child { flex-basis: 50%; }       
  
  /* top infoboxes */
  .infoboxes { flex-wrap: wrap; justify-content: center;  }
  .infoboxes .box {flex-basis: 24%; min-width: 200px; margin: 0.7rem; transition: none;}

/* top infoboxes2 pro testovaci homepage*/
  .infoboxes2 { flex-wrap: wrap; justify-content: center;  }
  .infoboxes2 .box {flex-basis: 24%; min-width: 200px; margin: 0.7rem; transition: none;}
  
  /* news right */
  .newsRbox {flex-basis: 100%; border-bottom: 1px solid lightgray; margin-bottom: 1rem;}
  /* banner */
  .banner {margin: 1rem 0;}
  
  #cols12 { flex-basis: 65%; }
  #col3 { flex-basis: 30%; }
     
  #col1 { flex-basis: 40%; } /* levé menu */ 
  #col2 { flex-basis: 55%; } /* ten je kdyz je to hlavni obsah a ma vlevo menu */       

  .newarticles { width: 48%; }
  .linkslist { width: 47%; }
  
  .profR {border-bottom: none; padding: 0;}
  .profRbox {flex-basis: 100%; border-bottom: 1px solid lightgray; margin-bottom: 0;}
  .profRbox div {padding: 1.3rem 0.8rem;}

  /*.pakceR {border-bottom: none; padding: 0;}
  .pakceRbox {flex-basis: 100%; border-bottom: 1px solid lightgray; margin-bottom: 0;}
  .pakceRbox:first-child {margin: 0;}
  .pakceRbox h3 { padding: 0 0 0.3rem 0;}
  .pakceRbox div {padding: 1.3rem 0;}
  .pakceRbox div img { width: 150px; padding-bottom: 1.3rem;}  */

  .pakceR { padding: 0; }
  .pakceRbox { display: block; width: 100%; padding: 1.5rem; margin-bottom: 1.5rem; border-bottom: 1px solid lightgray; }
  .pakceRbox:first-child { padding: 0 1.5rem 1.5rem 1.5rem; }
  .pakceRbox:last-child { padding: 0 1.5rem 1.5rem 1.5rem; margin-bottom: 0; border-bottom: none; }

  .videohp { padding: 0 1rem 0 2rem; }
  .iframehp { padding: 0 1rem 0 2rem; }  
  .benefity { padding: 0 1rem 0 2rem; }
       
}

@media (max-width: 800px){

  header { border: 0; }

  #menubox { padding: 1.5rem 0; }

  /* menu */
  html.js #menu { display: none; }
  #menu { margin: -1px 0 0 0; padding: 0; }
  #menu li { display: block; }
  #menu li a { border: none; border: none; border-top: 1px dotted gray; padding: 1rem 1.5rem; }

  html.js #submenu { display: none; }
  #submenu { margin: 0; padding: 0; }
  #submenu li { display: block; }
  #submenu li a { border: none; border: none; border-bottom: 1px dotted gray; padding: 1rem 1.5rem; }
  
  #menucloser { display:none; }
  html.js #menucloser { display: block; }  
  
  html.js .menuoverlap { display: none; }  
  
  /* top infoboxes */
  .infoboxes { margin: 1rem 0;}
  .infoboxes .box {flex-basis: 32%; margin-bottom: 0.7rem;}

/* top infoboxes2 pro test homepage */
  .infoboxes2 { margin: 1rem 0;}
  .infoboxes2 .box {flex-basis: 32%; margin-bottom: 0.7rem;}
  
  /* search box */
  input.search {margin-right: 0.8rem;}

#col1alone {margin-top: 0;}

/* kontakty zadavaci formular */
  #col1alone form table, #col1alone form th, #col1alone form td, #col1alone form tr, #col1alone form thead, #col1alone form tbody { display: block; border: none;}
  #col1alone form td {text-align: left;}
  #col1alone form td, #col1alone form td input, #col1alone form td select  {width: 100%;}
  #col1alone form td input, #col1alone form td select {margin-bottom: 0.9rem; min-height: 2rem;}
  #col1alone form td select {margin-left: 0;}
  
  /* footer */
  footer {justify-content: space-around;}
  footer div {flex-basis: 32%; margin-bottom: 1.5rem;}
  
  #cols { padding-top: 0; }
  
  #cols12 { flex-basis: 100%; padding-top: 0; }
  #col3 { flex-basis: 100%; padding: 0 1em; }
  
  #col1 { flex-basis: 100%; order: 1; } /* levé menu */ 
  #col2 { flex-basis: 100%; padding-right: 1em; } /* ten je kdyz je to hlavni obsah a ma vlevo menu */    
  
  .filtr { margin: 2em 1.5em 0 1.5em; } 
  .filtr .col1, .filtr .col2, .filtr .col3, .filtr .col4, .filtr .col5 { display: block; width: 100%; padding: 0.5em; }    

  .newarticles { display: block; width: 99%; }
  .linkslist { display: block; width: 99%; }  
  
}

@media (max-width: 600px){

  /* header */
  .headerTop input { width: auto; }
  .searchBox { display: block; padding: 0.5em 0; } 
  input { display: inline-block; margin: 0; }
  .search { display: inline-block; margin: 0 0 0 -5px; }

  /* main */
  .main {display: block;}

  /* top infoboxes */
  .infoboxes { display: block; margin: 0; margin: 0.8rem; }
  .infoboxes .box {margin-bottom: 0.5rem; min-height: 0; padding: 0.5rem;}

/* top infoboxes2 pro test homepage */
  .infoboxes2 { display: block; margin: 0; margin: 0.8rem; }
  .infoboxes2 .box {margin-bottom: 0.5rem; min-height: 0; padding: 0.5rem;}

  /* right news */
  .newsRbox { margin-bottom: 0;}
  .newsRbox div { padding-top: 0.4rem;}
  .newsRbox h3 { padding: 0.5rem 0 0 0.8rem; background-color: white; }
  .respPad {padding: 0 1em;}
  .allNews a {margin: 0.8rem;}
  .allNews  {margin-top: 0.8rem;}
  
  .allNewsdown {margin: 1rem 0.8rem;}
  
.profRbox {margin-bottom: 0;}    

/* videa soutěž */
  .mainRight { padding: 0 1rem;}

  /* footer */
  
  footer div {flex-basis: 48%; margin-bottom: 1.5rem;}

} 

@media (max-width: 480px){

  input { width: 96% !important; display: block; margin: 0; }
  .search { width: 96% !important; display: block; margin: -1px 0 0 0; text-align: left; }

  .videohp { padding: 0 2rem; }
  .iframehp { padding: 0 2rem; } 
  .benefity { padding: 0 2rem; } 

}

@media (max-width: 350px){

    footer div {width: 100%; flex-basis: 100%;}

}


.mainLeft .news.ITpod {border: none;}
.mainLeft .news.ITpod div {padding: 0.2rem 1rem 0rem;}
.mainLeft .news.ITpod div h3 {font-size: 100% !important;}
.mainLeft .news.ITpod div p {padding: 0rem 0rem 1rem !important;;}
.mainLeft .news.ITpod:first-child div {padding: 1.8em !important;}
.mainLeft .news.ITpod:nth-child(2) div {padding-top: 2em !important;}
.mainLeft .news.ITpod:first-child div h3 {font-size: 140% !important;}


/* Dan archiv zeleznicar */

/* archiv zeleznicar posledni tri cisla */
.archBoxesFirst { display: flex; flex-wrap: wrap; gap: 1em;}
.archBoxesFirst .archBox { display: flex; flex-direction: column; align-items: center; border: 1px solid #003b79;}
.archBoxesFirst .archBox div:first-child { background-color: #003b79; padding: 0.5em 1em; color: #fff; font-weight: 700; width: 100%; text-align: center;}

/* archiv zeleznicar */
.archBoxes { display: flex; flex-wrap: wrap; gap: 1em;}
.archBoxes .archBox { display: flex; flex-direction: column; flex-basis: 32%; align-items: center; border: 1px solid #003b79;}
.archBoxes .archBox div:first-child { background-color: #003b79; padding: 0.5em 1em; color: #fff; font-weight: 700; width: 100%; text-align: center;}
.archBoxes .archBox div:nth-child(2) { padding: 1em;}
.archBoxes a.pdf { line-height: 2em;}


@media (max-width: 1111px){

    .archBoxes .archBox { flex-basis: 48%;}
}

@media (max-width: 600px){
    .archBoxesFirst .archBox { flex-basis: 100%;}

    .archBoxes .archBox { flex-basis: 100%;}
}