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

/* all */
.flLeft {float:left;}
.flRight {float:right;}
.both {clear:both;}
.red, .err {color:#E20513;}
.green, .info {color:#0C3;}
.blue {color:#006CB0;}
.err, .info {margin:15px 0;}
  .err a {color:#B50012;}
.bold {font-weight:bold;}
.noBold {font-weight:normal;}
.right {text-align:right;}
.center {text-align:center;}
.left {text-align:left;}
.none {display:none;}
.pointer {cursor:pointer;}
.top {vertical-align:top;}
.uppercase {text-transform:uppercase;}
.nowrap {white-space:nowrap;}

.fullwidth {width:100%;}
.rwd300 {width:100%; max-width:300px;}
.rwd400 {width:100%; max-width:400px;}
.rwd900 {width:100%; max-width:900px;}

/* layout ... 14px */
html {font-size:100%; line-height:1.7;}
body {font-family:'Trebuchet MS', Arial, sans-serif; font-size:0.9em; background:#FFF;
    color:#535353; overflow:auto; /*cursor:default;*/ text-align:center;
    -webkit-tap-highlight-color: rgba(0,0,0,0);}
input, textarea, select {font-family:'Trebuchet MS', Arial, sans-serif; font-size:1em;}
.maxWebWidth {max-width:1100px; margin:0px auto; text-align:left;}
.content {padding:0 10px; min-height:300px;}
p {padding:4px 0px;}
p.indent, .indent {text-indent:2em;}
.indentTop {text-indent:2em; margin-top:10px;}
a {color:#535353;}
a:hover {color:#006CB0;}
a, span, div {-webkit-transition:color 0.5s, background 0.5s, opacity 0.5s; transition:color 0.5s, background 0.5s, opacity 0.5s,}

a.blue {color:#006CB0;}
a.blue:hover {color:#004671;}
.imgBorder {border:solid #C3C3C3 1px;}

h1 {font-size:2.4em; color:#006CB0; margin:15px 0; font-weight:normal;}
  h1 span {font-size:80%;}
h2 {font-size:1.5em; color:#006CB0; margin:15px 0 7px 0; font-weight:normal; text-transform:uppercase;}
h3 {font-size:1.3em; color:#006CB0; margin:15px 0 7px 0; font-weight:normal;}
  h3 a {color:#006CB0; text-decoration:none;}
  h3 a:hover {color:#2693FF;}
h4 {font-size:1em; margin:15px 0 2px 0; font-weight:bold;}
ul, ol {margin-left:1.5em;}

.mobil, .email, .address, .mobilb, .emailb, .addressb, .addressoth {display:inline-block; padding-left:25px;}
  .mobilb {background:url('/images/icons/phoneb.svg') no-repeat 8px center; background-size:auto 20px;}
  .mobil {background:url('/images/icons/phone.svg') no-repeat 8px center; background-size:auto 20px;}
  .mobil:hover {background:url('/images/icons/phonef.svg') no-repeat 8px center; background-size:auto 20px;}
  .emailb {background:url('/images/icons/emailb.svg') no-repeat left center; background-size:auto 10px;}
  .email {background:url('/images/icons/email.svg') no-repeat left center; background-size:auto 10px;}
  .email:hover {background:url('/images/icons/emailf.svg') no-repeat left center; background-size:auto 10px;}
  .addressb {background:url('/images/icons/addressb.svg') no-repeat 8px 2px; background-size:auto 21px;}
  .address {background:url('/images/icons/address.svg') no-repeat 8px top; background-size:auto 21px;}
input, textarea, select {border:dotted #7A7A7A 1px; background:#FFF; padding:2px; border-radius: 5px; color:#535353;}
input, select {height:1.7em;}
select {height:1.75em;}
textarea {overflow:auto; padding:3px 2px;}
input.sbmt {cursor:pointer; color:#FFF; background:#7A7A7A; padding:3px 15px;}
input.sbmt:hover {color:#FFF; background:#5A5A5A;}
input.radio {border:none; background:#FFF;}
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus {
  border: 1px solid #7A7A7A; -webkit-text-fill-color: #5F5F5F; -webkit-box-shadow: 0 0 0px 50px #FFF inset;}/* autocomplete */
label span {display:inline; width:auto; white-space:normal; margin:0; padding:0; color:#C00; padding-right:3px;}

ul.list {list-style-type:none; list-style-image:url('/images/icons/list.svg');}
ul.listf {list-style-type:none; list-style-image:url('/images/icons/listf.svg');}

a.sbmt {display:inline-block; text-decoration:none; cursor:pointer; color:#FFF; background:#7A7A7A; 
  padding:2px 15px; border-radius: 5px;}
a.sbmt:hover {color:#FFF; background:#5A5A5A;}

/* topBar ---------------------------------------------------------------------------------------------*/
#topBar {background:#006CB0; color:#FFF; font-size:90%; padding:3px 0;}
#topBar .maxWebWidth {padding:5px 10px; text-align:right;}
#topBar a {color:#FFF; text-decoration:none; opacity:0.9;}
#topBar a:hover {color:#FFF; opacity:1;}
#topBar .mobil, #topBar .email {margin-left:25px;}

/* header ---------------------------------------------------------------------------------------------*/
#header .maxWebWidth {position:relative; line-height:1; padding:70px 0 15px 0;}
#header img.logo {position:absolute; top:30px; left:10px;}
.shBl {display:none; border-top:dotted #BBB 1px; background:#F7F7F7;}
.shBl img {cursor:pointer; margin:5px 0;}
#mainMenu {list-style-type:none; text-align:right; margin:0;}
#mainMenu li {display:inline-block; padding:0 15px; white-space:nowrap;}
#mainMenu li a {color:#535353; font-size:90%; font-weight:bold; text-decoration:none; text-transform:uppercase; letter-spacing:0.03em;}
#mainMenu li a:hover, #mainMenu li a.act {color:#006CB0;}

/* rotator ---------------------------------------------------------------------------------------------*/
.container {width:100%; height:450px; position:relative;}
.container #rotator {width:100%; height:100%; margin:0;}
.container #rotator li {width:100%; height:100%; min-height:100%; position:absolute; bottom:0; left:0;
  background-size:cover; background-repeat:no-repeat;}
.container #rotator li p {position:absolute; font-size:40px; line-height:1.3; padding:0 10px;}
.container ul#controls {position:absolute; bottom:5px; left:50%; list-style-type:none;}
.container ul#controls li {border:solid #FFF 1px; width:10px; height:10px; display:inline-block; position:relative; left:-50px;
  border-radius:50%; -moz-border-radius:50%; -webkit-border-radius:50%; cursor:pointer;}
.current {background:#FFF;}
#rotator li#front1 {background-image:url('/images/front/front-9.jpg'); background-position:center center;}  
  #rotator li#front1 p {text-align:right; color:#FFF; text-shadow:5px 5px 4px #333; bottom:40px; right:30px; }
#rotator li#front2 {background-image:url('/images/front/front-1.jpg'); background-position:bottom center;}
  #rotator li#front2 p {text-align:right; color:#FFF; text-shadow:5px 5px 4px #333; top:15%; right:12%;}
#rotator li#front3 {background-image:url('/images/front/front-4.jpg'); background-position:bottom center;}
  #rotator li#front3 p {text-align:left; color:#FFF; text-shadow:5px 5px 4px #333; top:60px; left:30px;}
#rotator li#front4 {background-image:url('/images/front/front-5.jpg'); background-position:top right;}
  #rotator li#front4 p {text-align:left; color:#FFF; text-shadow:5px 3px 4px #333;top:20%; left:50px;}
#rotator li#front5 {background-image:url('/images/front/front-6.jpg'); background-position:center center;}
  #rotator li#front5 p {text-align:right; color:#FFF; text-shadow:5px 5px 4px #333; top:35%; right:50px;}
#rotator li {display:none;}
#rotator li#front1 {display:block;}

/* banner ---------------------------------------------------------------------------------------------*/
#banner {height:300px; background-repeat:no-repeat; background-size:cover; /*background-attachment:fixed;*/}
.banner0 {background-image:url('/images/front/front-2.jpg'); background-position:bottom center;}
.banner2 {background-image:url('/images/front/front-3.jpg'); background-position:bottom center;}
.banner3 {background-image:url('/images/front/front-13.jpg'); background-position:bottom center;}
.banner4 {background-image:url('/images/front/front-8.jpg'); background-position:bottom right;}
.banner5 {background-image:url('/images/front/front-10.jpg'); background-position:center center;}
.banner6 {background-image:url('/images/front/front-7.jpg'); background-position:bottom right;}
.bannerDef {background-image:url('/images/front/front-11.jpg'); background-position:center center;}

/* footer ----------------------------------------------------------------------------------------------*/
#footer {background:#006CB0 url('/images/bcg-footer.jpg') no-repeat center bottom / cover; background-attachment:fixed;
  color:#CACAD9; margin-top:30px;}
#footer a {color:#D5D5E1; text-decoration:none;}
#footer a:hover, #footer a.act {color:#FFF;}
#footer h4 {color:#FFF; font-weight:normal; margin:10px 0 0 2px; text-transform:uppercase;}
.links {padding:30px 10px; white-space:nowrap;} 
.links div.footerWeb {float:left;}
.links div ul {margin-bottom:10px; text-transform:uppercase; float:left; margin-right:100px;} 
.links div ul li.listfT {margin-top:10px;} 
.links li.devi {list-style-image:none; padding-top:15px;}
#footer .mobil, #footer .email, #footer .address {margin-left:15px;}
#footer .footerContact {float:right;}
#copy {clear:both; background:#004671; padding:7px 0 50px 0; font-size:90%;} 
#copy .maxWebWidth {text-align:right; padding:0 10px;}

/* home */
.bannerAdv {color:#006CB0; font-style:italic; font-size:120%; margin:15px auto; width:100%; max-width:600px;}

/* underfloor-heating ----------------------------------------------------------------------------------------------*/
.undH {list-style-type:none; margin-left:0;}
.undH h4 {font-size:110%; margin:10px 0 0 0; font-style:italic; color:#006CB0;}
.undH li h4 + p {padding-left:1px;}
div.undHimgBox {text-align:center;}
div.undHimg {display:inline-block; margin:10px 1%; line-height:1; width:47%; max-width:360px;}
div.undHimg img {width:97%;}
div.undHimg p {padding:0 15px; margin-top:3px; line-height:1.4; border-top:dotted #535353 1px;}
div.undHimg p span {color:#006CB0; display:block;}
.undHimg2 {float:right; width:300px; margin:20px 0 20px 20px;}

/* safety ----------------------------------------------------------------------------------------------*/
.imgSafety {float:right; margin:0 0 15px 15px; width:300px;}

/* products ----------------------------------------------------------------------------------------------*/
/*
div.divProd {border:dotted #A3A3A3 1px; background:#F7F7F7; margin:15px 0; padding:10px; width:49%; text-align:center;}
div.divProd.Odd {float:left; clear:both;}
div.divProd.Even {float:right;}
div.divProd h3 {margin:0; float:right; width:80%; text-align:left;}
div.divProd h3 a {color:#006CB0; text-decoration:none;}
div.divProd h3 a:hover {color:#2693FF;}
div.divProd img {width:20%; float:left; padding:0 10px 10px 0;}
div.divProd p {clear:right; text-align:left;}
div.divProd ul {text-align:left;}
div.divProd ul li {display:inline; padding:0 3px 0 10px; background:url('/images/icons/list.svg') no-repeat left center;}
div.divProd a.infoPr {display:block; width:10em; background:#006CB0; color:#FFF; text-decoration:none; clear:left; margin:7px auto 0 auto;}
*/
div.divProdTable {display:table; width:100%;border-collapse:separate; border-spacing:10px;}
div.divProdTable .divProd {display:table-cell; vertical-align:top; border:dotted #006CB0 1px; padding:10px; padding-bottom:2.5em; width:50%; 
  position:relative; border-radius:5px;}
div.divProd h3 {margin:0; float:right; width:80%; text-align:left;}
div.divProd img {width:20%; float:left; padding:0 10px 10px 0;}
div.divProd ul {}
div.divProd ul li {display:inline; padding:0 3px 0 10px; background:url('/images/icons/list.svg') no-repeat left center;}
div.divProd a.infoPr {display:inline-block; background:#006CB0; color:#FFF; text-decoration:none; padding:1px 30px;
  position:absolute; bottom:10px; right:30%; width:40%; text-align:center; white-space:nowrap; border-radius:5px;}
div.divProd a.infoPr:hover {background:#1A6FFB;} 

/* projects ----------------------------------------------------------------------------------------------*/
ul.locality {margin:0 0 25px 0; height:150px; overflow:auto; border:dotted #EAEAEA 1px; padding:5px 0 5px 10px; 
  border-radius:5px; background:#FAFAFA;}
ul.locality li {display:inline-block; padding:0 10px; list-style-type:none; color:#006CB0;
  background:url('/images/icons/list.svg') no-repeat left center;}
ul.locality li span {font-size:85%; color:#535353;}
.scroll::-webkit-scrollbar {width:10px;}
.scroll::-webkit-scrollbar-track {box-shadow:inset 0 0 5px #006CB0; border-radius:5px;}
.scroll::-webkit-scrollbar-thumb {background:#006CB0; border-radius:5px;}

div.project {border:dotted #006CB0 1px; margin-bottom:15px; padding:10px; float:left; width:100%; position:relative;  border-radius:5px;}
div.project h3 {margin:0 0 10px 0; float:right; width:85%; line-height:1.5;}
div.project h3.all {float:none; width:100%}
p.lsite {font-size:110%;font-style:italic;}
div.project .imgBox {float:left; padding:0 15px 5px 0; width:15%; line-height:1;}
div.project .imgBox img {width:100%;}
div.project div.gallery {clear:left; width:100%; white-space:nowrap; overflow:hidden; line-height:1;}
div.project div.gallery img {margin:3px; width:100px;}
div.project div.viewBox {position:absolute; bottom:10px; left:0px; width:100%; padding:0 10px; text-align:right;}
a.view {display:inline-block; background:#006CB0; color:#FFF; text-decoration:none; padding:1px 30px;
  text-align:center; white-space:nowrap; border-radius:5px; margin-left:10px;}
a.view:hover {background:#1A6FFB;}

/* contact ----------------------------------------------------------------------------------------------*/
div.divCont {float:left; padding-right:15px; width:29%;}
div.divCont H4 {color:#006CB0;}
.map {float:right; width:35%;}
.addressb strong {color:#006CB0; font-size:115%;} 
.mobilb a, .emailb a {text-decoration:none;}

/* project ----------------------------------------------------------------------------------------------*/
.back {border-bottom:dotted #7A7A7A 1px}
.back a {color:#006CB0; text-decoration:none;}
.back a:hover { color:#535353;}
.back a span {text-transform:uppercase; font-size:80%;}
.projectImg {float:left; margin:0 15px 10px 0; width:15.5%;}
.gallery {clear:left;}
.gallery img {margin:5px 0.5%; width:15.5%;}

/* sitemap */
.stmp {margin-top:10px;}

/* TOP */
#back-top img {position:fixed; bottom:30px; right:30px; opacity:0.8; z-index:1100;}

/* paginate ----------------------------------------------------------------------------------------------------*/
.paginate {margin:7px 0;}
.paginate a, .paginate span {font-size:85%; text-decoration:none; display:inline-block; line-height:1; border-radius:50%; 
  width:1.8em; padding:0.4em 0; text-align:center;}
.paginate a:not(.bnn):hover {background:#E0E0E0; color:#535353;}
.paginate span {border-radius:50%; background:#737373; color:#FFF;}

/* modal-thumb ----------------------------------------------------------------------------------------------*/
a.mod {cursor:pointer;}
img.imgModal {visibility:hidden; position:absolute; top:0; left:0; overflow:hidden; cursor:pointer; border:solid #9F9F9F 1px; z-index:1000;} 
a.noModal {cursor:default;}
#overlay {display:none; position:fixed; overflow:hidden; top:0; left:0; width:100%; height:100%; 
  z-index:500; text-align:left; background:#FFF; opacity:0.5; filter:alpha(opacity = 50);}


/* LOADER */
#loader {display:none; position:absolute; border: 8px solid #F3F3F3; border-top: 8px solid #4D546E;
  border-radius: 50%; width: 45px; height: 45px; animation: spin 2s linear infinite;}
  @keyframes spin {
      0% {transform: rotate(0deg);}
      100% {transform: rotate(360deg);}
  }

/* errordocument ----------------------------------------------------------------------------------------------*/
.errordocument {width:100%; max-width:800px; text-align:left; margin:0px auto; padding:0 10px;}
.errordocument ul {margin:3px 0 3px 25px; list-style-type:none; list-style-image:url('/images/icons/list.svg');}
.errordocument img {float:right; margin:15px 0 20px 0; width:90%; max-width:200px;}

/* gallery.php */
/* galéria 
    #topDivGal ... height ... $thumbs+6
    .gallTh ... opacity a filter podľa opacityThumb
*/
.boxGall {text-align:left; background:#737373; box-sizing: border-box;}
.boxGall * {box-sizing: border-box;}
#divImg {text-align:center; overflow:hidden; position:relative; padding:0px; border-top:solid #CCC 1px; padding:2px 0 0 0;}
#inDivImg {display:table-cell; vertical-align:middle;}
.countP {position:absolute; top:10px; right:10px; text-align:right; color:#CCC; font-family:arial;}
/*width photo-next = padding+widthImg => 30+23*/
#photo-next, #photo-prev, #lleft, #rright {position:absolute; cursor:pointer;}
#photo-next {right:0px; padding:20px 10px 20px 20px;}
#photo-prev {left:0px; padding:20px 20px 20px 10px;}
#lleft, #rright {padding:7px 3px; top:17px;}
#lleft {left:3px;}
#rright {right:3px;}
#topDivGal {width:100%; height:66px; position:absolute; left:0px; bottom:0px;}
#divGall {margin:0 20px; overflow:hidden; text-align:center; white-space:nowrap;}
.gallTh {border:solid #FFF 1px; margin:3px 1px; cursor:pointer; opacity:0.4; filter:alpha(opacity = 40);}
.thumbsNone {display:none;}
.thumbsView {display:block;}

/* modal galéria */
#modal_window, #modal_window * {box-sizing: border-box;}
#modal_overlay {display:none; position:fixed; overflow:hidden; top:0; left:0; width:100%; height:100%; 
  z-index:8888; text-align:left; background:#000; opacity:0.3; filter:alpha(opacity = 30);}
#modal_window {display:none; position:absolute; overflow:hidden; z-index:9999; text-align:left;  border-radius:7px;
  border:7px solid #737373; background:#737373;}
#modal_bar {height:2em; padding:0px; background:#737373; overflow:hidden;}
#modal_bar h3 {border:none; background:#737373; font-size:120%; font-style:italic; color:#FFF; margin:0;}
#modal_close {cursor:pointer; position:absolute; top:3px; right:7px; opacity:0.5;
  -webkit-transition:opacity 0.5s; transition:opacity 0.5s;}
  #modal_close:hover {opacity:1;}
#modal_content {overflow:hidden;}
#modal_image_wrapper {display:none; position:relative; overflow:hidden;}

/* RWD ===========  960px 768px 640px 480px 320px  ========================================================================================== */
@media screen and (max-width:960px) {
  /* header */
  #header .maxWebWidth {padding:0px; text-align:center; padding:0px;}
  #header img.logo {position:static; margin:20px 0; width:100%; max-width:230px;}
  #mainMenu {text-align:center; margin-bottom:15px;}
  /* rotator */
  .container {height:430px;}
  /* products */
  div.divProd img {width:30%;}
  div.divProd h3 {width:70%;}
  /* projects */
  div.project .imgBox {width:20%;}
  div.project h3 {width:80%;}
  /* project */
  .projectImg {width:19%;}
  .gallery img {width:19%;}
}
@media screen and (max-width:768px) {
  /* header */
  #mainMenu li {padding:0 8px;}
  /* rotator */
  .container {height:390px;}
  .container #rotator li p {font-size:30px;}
  /* footer */
  .links div ul {margin-right:30px;}
  /* underfloor-heating */
  .undHimg2 {width:40%; max-width:300px;}
  /* products */
  div.divProd a.infoPr {right:25%; width:50%;}
  /* project */
  div.project .imgBox {width:25%;}
  div.project h3 {width:75%;}
  /* contact  */
  div.divCont {float:none; width:auto;}
  .map {width:50%; margin-top:15px;}
}
@media screen and (max-width:640px) {
  /* layout */
  h1 {font-size:2.0em;}
  /* header */
  .shBl {display:block;}
  #mainMenu {display:none; border-top:dotted #BBB 1px; margin:0;}
  #mainMenu li {display:block; padding:12px 0px; border-bottom:dotted #BBB 1px;}
  /* rotator */
  .container {height:340px;}
  .container #rotator li p {font-size:25px;}
  /* footer */
  .links div ul {margin-right:10px; float:none;}
  .links div.footerWeb, #footer .footerContact {width:50%;}
  /* underfloor-heating */
  div.undHimg {display:block; margin:10px auto; width:100%; max-width:360px;}
  /* safety */
  .imgSafety {width:50%; max-width:300px;}
  /* products */
  div.divProdTable {display:block;}
  div.divProdTable .divProd {display:block; width:100%; margin:10px 0;}
  div.divProd a.infoPr {right:35%; width:30%;}
  div.divProd img {width:25%;}
  div.divProd h3 {width:75%;}
  /* projects */
  div.project .imgBox {width:30%;}
  div.project h3 {width:70%;}
  /* project */
  .projectImg {width:24%;}
  .gallery img {width:24%;}
  /* galéria */
  #modal_bar h3 {font-size:100%;}
}
@media screen and (max-width:480px) {
  /* rotator */
  .container {height:300px;}
  /* footer */
  .links {text-align:center;}
  .links div.footerWeb, #footer .footerContact {float:none; margin:0 auto; text-align:left;}
  #footer .footerContact {margin-top:15px;}
  /* underfloor-heating */
  .undHimg2 {float:none; width:90%; max-width:230px; margin:0 0 0 10%;}
  /* safety */
  .imgSafety {float:none; width:60%; max-width:300px; margin:15px 0 15px 20%;}
  /* products */
  div.divProd img {width:35%;}
  div.divProd h3 {width:65%;}
  div.divProd a.infoPr {right:25%; width:50%;}
  /* projects */
  div.project .imgBox {width:35%;}
  div.project h3 {width:65%;}
  /* project */
  .projectImg {width:32%;}
  .gallery img {width:32%;}
  /* contact  */
  .map {width:100%;}
}
