/*reset*/
* {border:0; padding:0; margin:0; outline: 0; box-sizing: border-box;/* width = border+padding+content */}

/* all */
.flLeft {float:left;}
.flRight {float:right;}
.red, .err {color:#B50012;}
.green, .info {color:#0C0;}
.err, .info {margin:10px 0;}
.bold {font-weight:bold;}
.noBold {font-weight:normal;}
.right {text-align:right;}
.center {text-align:center;}
.left {text-align:left;}
.none {display:none;}
.top {vertical-align:top;}
.fontMinus {font-size:90%;}
.fontPlus {font-size:110%;}
.nowrap {white-space:nowrap;}
.fullwidth {width:100%;}

/* LAYOUT ============================================================================================================================== */
html {font-size:100%;/*16px*/ line-height:1.4;}
body {font-family:Calibri, Candara, Segoe, 'Segoe UI', Optima, Arial, sans-serif; font-size:0.88em;/*14px*/ 
    background:#FFF; color:#7D7F7E; overflow:auto; cursor:default; text-align:center;}
p {padding:3px 0px; text-indent:2em;}
p.noindent {text-indent:0;}
a {text-decoration:none; color:#7D7F7E;}
a:hover {color:#B50012;}
a, a span, a strong {-webkit-transition:color 0.5s; transition:color 0.5s;} /*pre a:hover, a:hover span, a:hover strong*/

h1 {font-size:1.79em;/*25px*/ color:#B50012; margin-bottom:15px;}
h2 {font-size:1.29em;/*18px*/ color:#B50012; margin-top:15px;}
h2:first-child, .contact h2 {margin-top:0px;}
h1 span {color:#333232;}

a img.off {display:block;}  
a img.on {display:none;}
/*a:hover img.off, .offerItem a:hover img.off {display:none;}
a:hover img.on, .offerItem a:hover img.on {display:block;}*/
.maxWebWidth {max-width:1000px; margin:0px auto; text-align:left;}
.lightGray {color:#7D7F7E;}
.darkGray {color:#333232;}
.margin7 {margin:7px 0;}

/* rotácia A 3s, po nadídení
#rot {-webkit-transition: -webkit-transform 3s; transition: transform 3s;}
#rot:hover {-webkit-transform: rotateY(-360deg); transform: rotateY(-360deg);}
*/
/*animácia A */
@-webkit-keyframes rotimg {
  from, to {-webkit-transform: rotateY(0deg); transform: rotateY(0deg);}
  10% {-webkit-transform: rotateY(0deg); transform: rotateY(0deg);}
  25% {-webkit-transform: rotateY(-180deg); transform: rotateY(-180deg);}
  40% {-webkit-transform: rotateY(0deg); transform: rotateY(0deg);}
}
@keyframes rotimg {
  from, to {-webkit-transform: rotateY(0deg); transform: rotateY(0deg);}
  10% {-webkit-transform: rotateY(0deg); transform: rotateY(0deg);}
  25% {-webkit-transform: rotateY(-180deg); transform: rotateY(-180deg);}
  40% {-webkit-transform: rotateY(0deg); transform: rotateY(0deg);}
}
.animA {-webkit-animation:  rotimg 10s linear 1s infinite normal;
      animation: rotimg 10s linear 1s infinite normal;}

/*header*/
#logo {margin-top:15px; position:relative; float:left; width:100%;}
#logo a {text-decoration:none;}
#logo > div {position:relative; font-size:1.5em;/*21px*/line-height:1.2; font-weight:bold; float:right; border-left:solid #7D7F7E 1px;
  padding:0 10px; margin-bottom:5px;}
#logo > div div.a0 {width:50px; height:50px; background:#B50012; float:left;}
#logo > div div.a0 img {width:55%;/*a V DIV*/ margin:40% 0 0 40%;}
#logo > div div.cn {margin-left:60px;/*50+10*/ white-space:nowrap;}
#logo > a img {width:195px; position:absolute; bottom:0px; left:3px;}
#logo .version {position:absolute; bottom:-4px; left:-55px;}
#logo .version img {border:solid #D0D0D0 1px; border-radius:50%;}

/*mainMenu*/
.mainMenu {border-top:solid #7D7F7E 1px; border-bottom:solid #7D7F7E 1px; clear:both; text-align:center; display:none;}
.mainMenu img {margin: 4px auto 0 auto; cursor:pointer;}
#mainMenu {border-top:solid #7D7F7E 1px; border-bottom:solid #7D7F7E 1px; clear:both; float:left; width:100%;
  list-style-type:none; padding:12px 0px; background:#FFF;}
#mainMenu li {float:left; padding:2px 48px;}
#mainMenu li a {text-decoration:none; color:#999; font-weight:bold; font-size:1.21em;/*17px*/}
#mainMenu li a span {color:#999;}
#mainMenu li a:hover, #mainMenu li a.act {color:#333232;}
#mainMenu li a:hover span, #mainMenu li a.act span {color:#B50012;}
#topfix {float:left; width:100%;}
.sticky {position:fixed; top:0; width:100%; max-width:1000px; z-index:1000;}

/*main*/
#main {padding:15px 0; clear:both;}

/*footer*/
#footer {clear:both; border-top:solid #B50012 1px; padding:5px 10px 70px 10px; font-size:0.93em;/*13px*/}

/*submenu*/
#offer {border-top:solid #7D7F7E 1px; clear:both;}
#offer p {text-indent:0;}
.offerItem {width:44%; margin:10px;}
.first {float:left; clear:both; margin-right:0px;}
.second {float:right; margin-left:0px;}
.offerItem a {display:block; border:solid #7D7F7E 1px; margin-left:75px; position:relative; text-decoration:none; color:#7D7F7E;
  min-height:93px; padding:2px 2px 2px 25px;
  -webkit-transition:border-color 0.5s, color 0.5s; transition:border-color 0.5s, color 0.5s;}
.offerItem a:hover {color:#333232; border-color:#B50012;}
.offerItem a strong {color:#7D7F7E;}
.offerItem a:hover strong {color:#B50012;}
.offerItem a img {position:absolute; top:0px; left:-82px; height:85px;}

.offer_div {margin:10px 0 10px 10px;}
#offer .offer a {border-right:none; border-bottom:none; padding-top:40px;}
.offer a strong, a.offer_a strong {color:#7D7F7E; font-size:1.21em;/*17px*/}
.offer a:hover strong, a.offer_a:hover strong {color:#B50012;}

/*home*/
#rot {width:200px; text-align:center; float:left; margin:0 0 30px 10px;}
#rot img {width:200px; margin:0 auto;}
#banner {font-size:3.5em;/*49px*/ font-weight:bold; line-height:1.3; margin:0 0 30px 260px;}
#banner span {display:block;}

/*mainWeb*/
#mainWeb {width:44%; position:relative; float:left; margin:0 0 15px 10px;}
#mainWeb img {width:100%;}
#mainWeb H1 {width:70%; font-size:2.14em;/*30px*/
  margin:0; padding:0 0 7px 15px; position:absolute; bottom:0px; left:0px;
  -webkit-transform:translateX(143%) rotate(-90deg); transform:translateX(143%) rotate(-90deg);
  -webkit-transform-origin:bottom left; transform-origin:bottom left;}
#mainWeb H1 span {display:block; width:100%; color:#FFF; font-weight:normal; text-shadow: 1px 1px #333232;}
#mainWebContent {margin-left:47%; margin-bottom:15px; color:#333232;}
#mainWebContent .map {display:block; width:80px; height:62px; margin-left:10px; position:relative;}
#mainWebContent .map img {position:absolute; top:0px; left:0px;}
#mainWebContent table {border-collapse:collapse;}
#mainWebContent table td {padding:0 5px 0 0;}
#mainWebContent table td a {color:#333232;}
#mainWebContent table td a:hover {color:#B50012;}
#mainWebContent .contact {width:45%; margin-bottom:15px;}
#mainWebContent .contact p {text-indent:0;}
#mainWebContent ul, #mainWebContent ol {margin-left:20px;}
#mainWebContent a {color:#333232; text-decoration:underline;}
#mainWebContent a:hover {text-decoration:none;}
#mainWebContent td a {text-decoration:none;}

/*submenuWeb*/
#submenuWeb {width:41%; float:left; margin:0 0 15px 10px;}
#submenuWeb div {width:150px; height:250px; position:relative; float:right; border:solid #B50012 1px;}
#submenuWeb H1 {color:#AAA; padding:0 0 5px 10px; font-weight:normal; font-size:1.79em;/*25px*/ z-index:100;
  width:200px; line-height:1.1; margin:0; position:absolute; bottom:0px; left:0px;
  -webkit-transform-origin:bottom left; transform-origin:bottom left;
  -webkit-transform:translateX(150px) rotate(-90deg); transform:translateX(150px) rotate(-90deg);}
#submenuWeb strong {display:block; margin:6px; color:#B50012;}
#submenuWeb img {position:absolute; top:15px; left:-223px;}
#submenuWebContent {width:55%; float:right; color:#333232; margin-bottom:15px;}
#submenuWebContent a {color:#333232; text-decoration:underline;}
#submenuWebContent a:hover {color:#B50012;; text-decoration:none;}
#submenuWebContent .calendar {height:50px; margin:7px 0 0 5px; position:relative; padding:10px 0 0 60px;}
#submenuWebContent .calendar a {font-weight:bold; text-decoration:none;}
#submenuWebContent .calendar img {position:absolute; top:0px; left:0px;}
#submenuWebContent h4 {margin-top:6px; font-size:100%;/*14px*/}
#submenuWebContent ul, #submenuWebContent ol {margin-left:20px;}
table.tab {border-collapse:collapse; border-top:dotted #7D7F7E 1px; border-left:dotted #7D7F7E 1px; margin:7px 0;}
table.tab td, table.tab th {border-bottom:dotted #7D7F7E 1px; border-right:dotted #7D7F7E 1px; 
  padding:1px 5px; text-align:center; white-space:nowrap;}
.tabpuzzle td {width:10em;}

/*err*/
.fileErr {margin:10px;}
.fileErr h2 {font-style:italic; margin:20px 0 5px 0;}
.fileErr ul {margin:20px;}
.fileErr img {float:right; margin:30px;}
.fileErr p {text-indent:0;}

/*sitemap*/
.sitemap {margin:10px 0;}
.sitemap ul {margin-left:20px; color:#B50012;}

/*offerAll*/
.offerAll {padding:0 10px 15px 10px;}
/*.offerAll strong {color:#B50012;}*/
.offerAll ul {margin-left:1em; list-style-image:url('/images/list.svg');}
.back a {display:block; width:50px; height:70px; border:solid #7D7F7E 1px; position:relative; margin:15px 0 0 75px;
  -webkit-transition:border-color 0.5s, color 0.5s; transition:border-color 0.5s, color 0.5s;}
.back a:hover {color:#B50012; border-color:#B50012;}
.back img {position:absolute; top:-15px; left:-82px;}
.back a strong {color:#7D7F7E; display:block; font-weight:normal;
  -webkit-transform:rotate(-90deg); transform:rotate(-90deg);
  -webkit-transform-origin:bottom left; transform-origin:bottom left;
  position:absolute; top:40px; left:40px;}
.back a:hover strong {color:#B50012;}

/* RWD ================================================================================================================================= */
@media screen and (max-width:870px) {
  /*submenu*/
  .offerItem {width:48%;}
  .offerItem a {min-height:110px;}
  .offerItem a img {top:10px;}
}
@media screen and (max-width:768px) {
  /*logo*/
  #logo > div {font-size:1.29em;/*18px*/}
  #logo > div div.a0 {width:40px; height:40px;}
  #logo > div div.cn {margin-left:50px;}/*40+10*/
  
  /*mainMenu*/
  #mainMenu li {padding:2px 30px;}
  
  /*submenu*/
  .offerItem a {min-height:130px;}
  .offerItem a img {top:25px;}
  
  /*mainWeb*/
  #mainWeb {width:150px; height:300px; overflow:hidden; margin:0; margin-bottom:15px;}
  #mainWeb img {width:auto; height:300px; position:absolute; left:-70px;}
  #mainWeb H1 {font-size:1.76em;/*25px*/ padding:0 0 7px 15px;}
  #mainWeb H1 span {width:300px;}
  #mainWebContent {margin-left:170px;}
  
  /*home*/
  #rot {width:150px; margin:0 0 20px 10px;}
  #rot img {width:150px;}
  #banner {font-size:2.86em;/*40px*/ margin:0 0 30px 190px;}
  
  /*submenuWeb*/
  #submenuWeb {width:100%; overflow:hidden; float:none; margin:10px 0 0 0; padding:0 10px 0 87px;}
  #submenuWeb div {width:inherit; height:100px; position:relative;}
  #submenuWeb img {position:absolute; top:0px; left:-87px; height:90px;}
  #submenuWeb H1 {-webkit-transform:rotate(0deg); transform:rotate(0deg); display:block;
    width:100%; bottom:7px; left:0; text-align:right; padding:0 10px;}
  #submenuWebContent {margin:15px 10px 15px 87px; width:auto; float:none;}
}

@media screen and (max-width:640px) { 
  /*mainMenu*/
  .mainMenu {display:block; background:#F3F3F3;}
  #mainMenu {display:none; border:none; float:none; padding:0px;}
  #mainMenu li {float:none; text-align:center; padding:10px; border-bottom:dotted #DDD 1px; background:#F9F9F9;}
  
  /*submenu*/
  #offer {margin-bottom:10px;}
  .offerItem {width:98%; margin:10px 0 0 0;}
  .offerItem a img {top:0px;}
  .first {float:none;}
  .second {float:none;}
  .offerItem a {min-height:87px;}
  .back a {margin-left:65px;}
  
  /*home*/
  #rot {margin-top:10px;}
  #banner {margin-top:10px; padding-top:10px; font-size:2.64em;/*37px*/}
  
  /*main*/
  #main {clear:both;}
  
  /*mainWeb*/
  #mainWeb {width:100%; height:150px; overflow:hidden; float:none; margin:0;}
  #mainWeb img {width:100%; position:static;}
  #mainWeb H1 {padding:0; -webkit-transform:rotate(0deg); transform:rotate(0deg);
    bottom:0; left:10px;}
  #mainWeb H1 span {width:95%;}
  #mainWebContent {margin:15px 10px;}
  
  /*submenuWeb*/
  #submenuWeb {padding-left:75px;}
  #submenuWebContent {margin-left:75px;}
}

@media screen and (max-width:480px) { 
  /*logo*/
  #logo > div {margin-bottom:10px;}
  #logo > a {clear:both; display:block; border-top:solid #7D7F7E 1px; text-align:center;}
  #logo > a img {position:static; margin:30px auto;}
  
  /*home*/
  #rot {width:100px; margin:10px 0 20px 10px;}
  #rot img {width:100px;}
  #banner {font-size:1.93em;/*27px*/ margin:10px 0 20px 130px; font-weight:normal; padding-top:10px;}
  
  /*submenuWeb*/
  #submenuWeb div {height:130px;}
  #submenuWeb img {top:35px;}
  #submenuWeb H1 {font-size:1.64em;/*23px*/}
}

@media screen and (max-width:420px) { 
  #mainWebContent .contact {width:100%;}
}

@media screen and (max-width:360px) {
  #logo .version {width:25px; left:-30px;}
  /*home*/
  #rot {width:80px; margin:10px 0 10px 10px;}
  #rot img {width:80px;}
  #banner {font-size:1.57em;/*22px*/ margin:0 0 10px 100px;}
}