@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,600,700&subset=latin-ext');

 a#menubutton {display: none;}
* {box-sizing: border-box;}

a{color: #008dc9}
a:hover{color:#153250}
.text-left{text-align: left !important;}
.text-left .autor{font-size: 1.5em;}

.blok-modry a{color: #fff;}
.IN-widget{position: relative; top:-5px;}

.blok-evha a{text-decoration: none; color: #777777}
.certimg img{ margin: 1em; box-shadow: 0 0 5px #ccc; padding: 1em}

body, .input, .btn{font-family: 'Montserrat', sans-serif;font-size: 16px;font-weight: 400;}
.btn{cursor: pointer;white-space: normal;}
body, html{margin: 0; padding: 0;}
body{padding-top: 60px;overflow-x: hidden;}
body.open{padding-top: 0;}
strong{font-weight: 600;}
.sw3 td{width: 33.33%}
.sw4 td{width: 25%}
.notd td{border: 0 !important; background: #fff}

.mt0{margin-top: 0.3em;}

.pg-index h1{text-align: left;}
h1{text-align: left;}
.h2black{font-size: 1.563em;color: #000;line-height: 1.6em;}

.hd{display: none;}

.fb-video {
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
    border: 1px solid #ccc;
}

.fb-video iframe {
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}



/*pg index */
 p{line-height: 2em; margin: 2em 0}
.pg-index .header .bigger{font-size: 1.563em;line-height: 1.4em;}

.princip{padding: 1.5em 0;}

.princip .col{float: left; width: 33%; margin: 0 !important; padding: 0 !important;}
.crt{float: left; width: 33%; text-align: center }
.crt p{text-align: center; font-style: italic;   padding: 0 1em;}


.nobotpad{padding-bottom: 0 !important;}

h3{font-weight: 300; font-size: 1.5em; color: #888; margin-top: 2em}
h2{font-size: 2.250em;font-weight: 300;letter-spacing: -0.03em; color: #008dc9;}
h1{font-size: 3em !important;font-weight: 300;letter-spacing: -0.03em; color: #008dc9;}
h2.h1{text-align: left; font-size: 2.5em !important;}

.pg-index .header h1{font-size: 4em;font-weight: 300;letter-spacing: -0.03em; color: #fff;}
.pg-index .header h1 span{font-weight: 700;color: #008dc9;display: block;  }
.pg-index .header .btn{ margin-top: 1.5em; margin-bottom: 8em;}
.pg-index h2, .pg-index .h2, .h2prod h2{color: #008dc9;font-size: 1.875em;font-weight: 300;}
.pg-index h2 a, .h2prod h2 a{color: #008dc9; text-decoration: none; border-bottom: 1px solid #008dc9;}
.pg-index h2 a:hover, .h2prod h2 a:hover{color: #153250; border-bottom: 1px solid #153250;}
.pg-index .h2.grey, .h2prod .h2.grey{color: #777777; line-height: 1.4em; margin: 0; padding: 0; margin-bottom: 3em}

.blok-bily{padding: 6em 0 ;border-bottom: 1px solid #ccc;}
.blok-zena{padding: 6em 0 12em 0; background: url('bg-woman.png') right bottom no-repeat; }
.blok-modry{padding: 6em 0 ; background: #008dc9; color: #fff; text-align: center; position: relative;  background: #008dc9 url('bg-eco.png') right bottom no-repeat;}
.blok-modry h2{color: #fff; font-size: 3em; margin-bottom: 2em;}
.blok-kontakt{padding: 4em 0 8em 0; background: #eeeeee;}
.blok-grey{padding: 4em 0 8em 0; background: #eeeeee;}

.blok-intro{padding: 4em 0 8em 0; background: #fff;}
.blok-intro h2{font-size: 1.563em; color: #000; line-height: 1.6em;}

.bg-kostky-down{background: #fff url('bg-kostky.jpg') bottom center no-repeat;}
.bg-kostky-up{background: #fff url('bg-kostky-2.jpg') center top no-repeat;}


.kde-vyuzijete h3{
  margin: 0.5em 0 0.5em 0;
}

.kde-vyuzijete p{
  margin: 0 0 5em 0;
  line-height: 1.5em;
}

.onas-lide img{border-radius: 100%; max-width: 20%; border: 5px solid #fff; background: #fff;box-shadow: 0 0 10px rgba(0,0,0,0.2)}
.tym img{border-radius: 100%; max-width: 40%; border: 5px solid #fff; background: #fff;box-shadow: 0 0 10px rgba(0,0,0,0.2)}

.onas-txt .vpravo, .onas-txt .vlevo {padding-top: 5em}

.stat{position: fixed; top: 0; z-index: 65000; left: 0;  text-align: center; width: 100%; padding: 1.5em;
  -webkit-animation: seconds 1.0s forwards;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-delay: 3s;
  animation: seconds 1.0s forwards;
  animation-iteration-count: 1;
  animation-delay: 3s;
}

.stat.s300{
-webkit-animation-delay: 5s;
  animation-delay: 5s;
}

@-webkit-keyframes seconds {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    left: -9999px; 
  }
}
@keyframes seconds {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    left: -9999px; 
  }
}



.stat *{color: #fff !important; margin: 0; padding: 0;}
.stat h3{font-weight: 400}

.s200{background: #080;}
.s300{background: #800;}

.blok-intro .btn{margin: 2em 0;}

.blok-evha{padding: 4em 0; background: #ffffff;}
.blok-evha table{color: #777777;font-size: 1.500em;font-weight: 300;}
.blok-evha img{margin-right: 2em;}
.max50{max-width: 870px !important}
.blok-kontakt .cols{ margin: 0 -1em;}
.blok-kontakt .col50{ padding: 0 1em;}
.blok-kontakt h2{text-align: center; font-size: 2.250em; margin: 2em 0}
.blok-kontakt .btn{font-size: 1.5em; display: block-inline; min-width: 50%;  margin: 2em auto;}


.input{border: 0px; border-radius: 4px; background: #fff; font-size: 16px; padding: 1em; width: 100%; margin-bottom: 1em; resize: none}
textarea.input{height: 10em}


.paticka{background: #153250; color: #a3abb1; font-size: 0.750em; padding: 5em 0;}
.paticka p{ line-height: 1.4em !important; margin: 1em 0 1em 0;}
.paticka a{color: #fff; text-decoration: none;}
.paticka a:hover{text-decoration: underline;}

.paticka .col1, .paticka .col2,.paticka .col3,.paticka .col4,.paticka .col5{float: left; width: 20%; padding: 0 1em;}
.paticka .col1 img{max-width: 80%;}

.blok-kontakt, .blok-bily, .blok-zena, .blok-modry{
 overflow: hidden;
}

.blok-modry .btn{background: #153250; margin-top: 2em}

.noborder{border: 0;}


.postup{text-align: left; max-width: 700px; margin: auto; padding: 2em 0; clear: both; border-bottom: 1px solid #eee;}
.postup-vetsi .postup{max-width: 100% !important;}
.postup img{float: left; padding-top: 2em; display: block;}

.last{border-bottom: 0}

.vpravo, .vlevo{clear: both}
.vlevo img{float: left; margin: 0 5em 3em 0;}
.vpravo img{float: right;margin: 0 0 2em 5em;}

img{max-width: 100%;}

.zvyrazneni{color: #008dc9; border-top: 2px solid #008dc9; border-bottom: 2px solid #008dc9; padding: 1em 0; margin: 2em 0; font-size:1.400em; text-align: center;}
.zvyrazneni a{color: #000; text-decoration: underline; margin-left: 1em;}

.ic-vlastnost{float: right; display: block;margin: -0.2em 0 0em 1em}

.col50{
  width: 50%;
  float: left;
  padding: 0px 4em;
}

.col33{
  width: 33%;
  float: left;
  padding: 0px 4em;
}

.cols{
  margin: 0 -4em;
}

.col33special{margin: 0 0em}
.col33special .col33{padding: 0 2em !important;}

.cols.ref-1 .col33{ margin: 0 auto; float: none;width: 60%;}

.t-reference p{
  line-height: 1.4em;
  font-style: italic;
}

.t-reference img{
  margin-bottom: 2em;
}


.poz{font-weight: 600;}



.fb{background: url('fb-0.png') center center no-repeat; margin-left: 1em; position: absolute; top: -0.4em; padding: 1em}
.fb:hover{background-image: url('fb-1.png');}

.scrolldown span{display: none}
.scrolldown{width: 64px;height: 64px;overflow: hidden;background: url('down-0.png') no-repeat;display: block;position: absolute;bottom: 50px;left: 50%; margin-left: -32px;}
.scrolldown:hover{background-image: url('down-1.png');}

.header{
  background: #152e4d;
  color: #fff;
  background-image: url('https://www.eco-stations.eu/data/uploads/bg-space-robot.png');
  background-position: 80% 50%; 
  background-size: cover;
  position: relative;
  padding: 3em 0 0 0;
}

.bg-cosmo{
  width: 100%;
  height: 100%;
  background: url('bg-ecostations2.png') 90% center no-repeat;
  position: absolute;
  z-index: 0;
}


.header .txt{position: relative; width: 65%;}


.c60{width: 65%; float: left}
.c40{width: 35%; float: right; padding-left: 3em;}

.c70{width: 75%; float: left}
.c30{width: 25%; float: right; padding-left: 3em;}



.wrap{
  width: 90%;
  max-width: 1280px;
  margin: auto;
}

.btn{
  font-size: 1.5em;
  font-weight: 600;
  color: #fff;
  text-transform: uppercase;
  background: #008dc9;
  display: inline-block;
  padding: 0.7em 2em;
  text-align: center;
  text-decoration: none;
  border: 1px solid #008dc9;
}

table .btn{font-size: 1em; padding: 0.5em 1em;}

.center{
  text-align: center !important;
}

.w50{
  width: 70%;
  margin: auto;
}

.btn:hover{
  background: #fff;
  color: #008dc9;
}


.fixm{
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  z-index: 10000;
  background: #fff;
  box-shadow: 0 0 2px #000;
  padding: 5px 0 ;
  min-height: 60px;
}

.imgreference{
  margin-top: 5em
}


.m0-bot{margin: 0; padding-bottom: 0;}
.m0-top{margin: 0; padding-top: 0;}
.m40{margin: 8em 0;}
.m20{margin: 4em 0;}
.m10{margin: 2em 0;}

.cat a{ display: block;}

.minblog{min-height: 600px; margin-top: 2em;}
.minblog .c30 .search-results li{border-top: 0px;}
.minblog .c30 img{ display: none;}
.minblog .c30 .search-results .search-entry-date{display: none}

.blogdetail ul{margin-left: 0; padding-left: 0;}
.blogdetail h1{font-size: 2em !important}

.blogdetail ul li{
  margin: 0; padding: 0;
  margin-bottom: 1em;
  line-height: 2em;
  list-style: none;
  padding-left: 2em;
  background: url('li.png') left 0.5em no-repeat;
}

.c70{max-width: 45em}


.blog-item img{ float: right; margin-left: 2em}
.search-results { list-style:none; padding: 0 0 0 0.5em; margin: 0;}
.search-results li { border-top: 1px solid #ccc; padding: 2em 0;}
.search-results h3{margin-top: 0;}

.search-entry-excerpt{margin-top: 1em; line-height: 1.5em}
.search-entry-date{color: #888;}
.search-results-paging{margin-top: 2em; margin-bottom: 5em;}
.search-results-paging span{padding: 0.3em 0.7em; display: inline-block;}
.search-results-paging span.current{color: #fff; background: #0088c8; border-radius: 4px;}

.nejnovejsi .search-results li{border-bottom: 0; padding: 0;}
.nejnovejsi .search-results h3{font-size: 1em;}


nav{float: right; position: relative;margin-top: 0.7em;}
nav ul {list-style: none; margin: 0; padding: 0px;  text-align: right;}
nav > ul li{display: inline-block;}
nav > ul ul{position: absolute; z-index: 10000; list-style: none; margin: 1em 0 0 0 ; padding: 0px; display: none; background: #fff;text-align: left; box-shadow: 0 0 10px rgba(0,0,0,0.2);}
nav > ul ul::before{content: " ";position: absolute;top: -12px;background: url('zobacek.png');height: 12px; width: 27px;z-index: 10000;left: 30px;}
nav > ul ul li{float: none;text-transform: none; display: block;}
nav > ul ul a{background: #fff; line-height: 1.5em; display: block;}
nav > ul ul a:hover{background: #f4f4f4; color: #555;}
nav > ul ul a{background: #008dc9; color: #fff;}
nav ul li:hover > ul{display:block;}
nav li.currentpath ul {font-weight: 300;}
nav li.current, nav li.currentpath {font-weight: 400;}
nav li.current ul{font-weight: normal;}
nav li a {text-decoration: none; padding: 1em 0.7em 1em 0.7em; color: #424648; padding: 1em 0.5em;}
nav ul > li.current > a, nav ul > li.currentpath > a {color: #008dc9;}
nav ul ul > li.currentpath > a {color: #fff;}
nav ul ul > li.currentpath > a:hover {color: #555;}
nav ul ul li.current > a{color: #fff}
.open nav ul ul li.current > a{color: #008dc9;} 
nav ul ul li.current a:hover{color: #555}
nav li a:hover{color: #008dc9;}
nav > ul ul a { padding: 0.5em 1em !important;}

.clear{clear: both;}
.clear span{display: none;}


.max50 ul, .blok-bily ul, .blok-grey ul{
  margin: 0; padding: 0;
  margin: 2em 0;
}

.max50 ul li, .blok-bily ul li, .blok-grey ul li{
  margin: 0; padding: 0;
  margin-bottom: 1em;
  line-height: 2em;
  list-style: none;
  padding-left: 2em;
  background: url('li.png') left 0.5em no-repeat;
}


.srovnani, .parametry{width: 100%;border-collapse: collapse;}

.srovnani td, .srovnani th, .parametry td, .parametry th{
  text-align: center;
  border: 1px solid #cce7f4;
  padding: 0.7em 0.5em;
}

.srovnani td, .srovnani th{
  background: #e8f3f8;
  font-weight: 400;
}

.mark{background: #fff !important; color: #008dc9; font-weight: 700 !important;}

.parametry th{background: #cce7f4}

.parametry tr:nth-child(even) {background: #fff}
.parametry tr:nth-child(odd) {background: #f2f9fc}

.parametry.obracene tr:nth-child(even) {background: #f2f9fc}
.parametry.obracene tr:nth-child(odd) {background: #fff}



.chbox {
  display: block;
  position: relative;
  padding-left: 50px;
  margin-bottom: 20px;
  cursor: pointer;
  font-size: 1em;
  color: #465d6f;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.chbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 32px;
  width: 32px;
  background-color: #fff;
  border-radius: 5px;
}

.chbox:hover input ~ .checkmark {
  background-color: #ccc;
}

.chbox input:checked ~ .checkmark {
  background-color: #2196F3;
}

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.chbox input:checked ~ .checkmark:after {
  display: block;
}

.chbox span{padding-top: 5px; display: block;}

.chbox .checkmark:after {
  left: 9px;
  top: 0px;
  width: 10px;
  height: 20px;
  border: solid white;
  border-width: 0 4px 4px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}


.princip.cols .col33{
padding: 0 1.5em;
}

.princip.cols .col33 h3{margin-top: 0.5em;}

/*nav ul li.blog:hover > ul{display: none !important}*/

nav ul li:hover.blog > ul{display:none;}


.zarizeni img { max-width: 45%; height: auto; padding: 0; margin-top: 3.5em; border-radius: 4px; margin-left: 2em;}
.zarizeni.postup {max-width: 70%;}

@media screen and (max-width: 1280px) {
nav {float: none;}
nav ul{text-align: left; padding: 0.5em 0;}

}

@media screen and (max-width: 1200px) {
	.col33special .col33{ font-size: 0.8em;}
.fixm{ height: auto; position: absolute;}
	.zarizeni.postup {max-width: 700px;}
}

@media screen and (max-width: 1024px) {             

	.fixm{ height: auto; position: fixed;}
 a#menubutton {
    display: block;
    width: 28px;
    border-top: 2px solid #a2a8ae;
    border-bottom: 2px solid #a2a8ae;
    font-size: 0px;
    line-height: 0;
    z-index: 11;
    right: 10px;
    top: 17px;
    background:  url("close.png") no-repeat scroll 0px -999px;
    outline: 0px none;
    }
  a#menubutton:hover{border-top: 2px solid #008dc9;border-bottom: 2px solid #008dc9; background-image: url('close-ov.png')}
  #menubutton:hover span{background: #008dc9;}
  

.open #menubutton, .open a#menubutton:hover {
    border: 0px none;
    background-position: center center;
}

.open .h{display: none !important;}

.open #menubutton span {
  background: none;
}

	#menubutton{
    margin-left: 30px;
		z-index: 50;
    position: absolute;
		right: 20px;
		top:28px;
		width: 100%;
	}
  
   #menubutton span {
    display: inline-block;
    background-color: #a2a8ae;
    width: 100%;
    height: 2px;
    vertical-align: middle;
    margin: 8px 0px;
  }
 nav {display: none;}
 
 
.open *{display: none}
.open .fixm{position: static;}
.open .fixm, .open .fixm *{display: block;}
.open .fixm .blog ul{display: none;}

.open nav{display: block !important;height: 100%;width: 100%;}

.open nav li{display: block !important;text-align: left;}
.open nav li a {background: none;padding: 0; }
.open nav ul {font-size: 1.4em;margin: 0em 0 !important;}
.open nav ul ul {padding-top: 1em;}
.open nav ul li{padding-top: 0.8em; padding-bottom: 0.8em; border-top: 1px solid #ccc;}
.open nav ul ul li{ background: #eee;}
.open nav ul ul ul{padding-top:0; font-size: 1em;}
.open nav ul ul ul li {background: #dedede;}
.open nav ul li li{margin-top: 0;}
.open nav > ul ul{font-size: 0.8em;}
.open nav > ul > li:nth-child(1) ul{margin-left: 0px;}
.open nav > ul ul {display: block;position: static;}
.open nav > ul ul::before {content: '';background: none;}
.open nav{left: 0;width: 100%;}
.open nav > ul {width: 100%;}

.open nav > ul ul a{color: #000}
.open nav ul ul > li.currentpath > a {color: #000;}
.open nav > ul ul a:hover{color: #008dc9; background: none;}

  nav ul ul{box-shadow: none;}

}

@media screen and (max-width: 900px) {             
body {font-size: 13px;}
	
	.col33special .col33{width: 100%; float: none; padding: 0; font-size: 1em;}

.header .txt {width: 100%;}
.w50 {width: 90%;}
.minblog .c30, .minblog .c70{float: none; width: 100%;}
	.minblog .c30{display: none;}


}



@media screen and (max-width: 700px) {
	.crt{float: none; width: 100%; text-align: center }
	.search-results .n{width: 30%;}
	
	.onas-lide img{border-radius: 100%; max-width: 30%; border: 3px solid #fff;}


  .cols {margin: 0;}
  .col50, .col33{width: 100%; float: none; padding: 0;}
  .princip .col{width: 100%; float: none;text-align: center}
  .princip .col img{max-width: 90%; display:inline;}
  .paticka .col1,.paticka .col2,.paticka .col3,.paticka .col4, .paticka .col5{width: 100%; text-align: center; font-size: 1.3em; margin-top: 3em;}
  .paticka .col1{margin-top: 0;}
  h1{font-size: 3em !important;}
  h2{font-size: 1.7em !important;}
  .header{text-align: center;}
  .blok-kontakt .btn{width: 100%;}
  .blok-kontakt .col50{ margin-bottom: 0em}
  
  .blok-zena{background-size: 120%; background: none; padding-bottom: 0}
  .blok-modry .btn{margin-top: 0}
  .postup img{max-width: 25%; }
  .vlevo img{float: left; margin: 0 2em 2em 0;}
  .vpravo img{float: right;margin: 0 0 2em 2em;}
  
  .ecologo{max-width: 82%;}
  
  .c60, .c40{width: 100%; padding: 0; float: none;}
  
  .srovnani img{width: 30px;}
  .srovnani {font-size: 0.8em;}
.blok-kontakt, .blok-bily, .blok-zena, .blok-modry{overflow: visible;}
	nav ul li.blog > ul{display:none !important;}
  .eshoplink{margin: auto}
  
}

.enstudy{display: block; margin-top: 1.5em; color: #0489cc !important; font-size: 0.8em }
.enstudy img{margin-right: 1em; position: relative; top: 0.5em}
.enstudy:hover{color: #000 !important;}


.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}



#loadOverlay{display: none;}
hr{width: 100%;}
.nobordr{border: 0;}


/* NOVE MENU */
nav > ul ul ul {position: static; display: block; margin: 0; box-shadow: none; }
nav > ul ul ul a {background: #00709f; padding-left: 3em !important}
/* */
.blok-intro .blue, .blue{color: #008dc9;}
.tm{margin-top: 2em;}


.pg-index .header .btn.btnno{margin-bottom:0;margin-top: 1em;}
.pg-index .header .btn.green{margin-bottom: 7em;border: 1px solid #00a17c;background: #00a17c;}
.pg-index .header .btn.green:hover{background: #fff;color: #00a17c;}
.eshoplink{text-align: center; margin-top: 2em; display: block; max-width: 80%;background: #00a17c; border-radius: 5px; padding: 10px 5px;}

.blok-intro .btn.btnno{margin-bottom: 0; margin-top: 1em}
.blok-intro .btn.green{margin-bottom: 1em; margin-top: 1em}
.blok-intro .btn.green{margin-bottom: 1em;border: 1px solid #00a17c;background: #00a17c;}
.blok-intro .btn.green:hover{background: #fff;color: #00a17c;}