@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,800,300&subset=latin,latin-ext');
@import url('https://fonts.googleapis.com/css?family=PT+Serif&subset=latin,latin-ext');

body { margin: 0; padding: 0; background: #fff; overflow-x: hidden;
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; font-size: 14px; line-height: 1.43; color: #333;}

h1, h2, h3, h4, h5, h6, p, label, .btn, a { font-family: "Open Sans"; font-weight: 400;}
h3 {font-weight: 800; font-size: 1.75em; margin:0.8em 0;}
textarea { font-family:Arial, Helvetica, sans-serif;}

.img-responsive { max-width: 100%; height: auto;}
.img-circle { border-radius: 50%;}

.center-block { display: block;  margin-right: auto;  margin-left: auto;}
.statement-bloc-text {
    line-height: 38px;
    font-style: italic;
    font-size: 28px;
    text-align: center;
    font-weight: lighter;
}

.text-center { text-align: center;}
.tc-white {  color: #fff;}
.tc-glaucous { color: #5583BB;}

.sec { width:98%; height:auto; overflow:hidden; padding:4vh 1%;}
.sec h1 {text-align: center;}

.bgc-white { background-color: #ffffff;}
.bgc-white-smoke {  background-color: #F5F5F5;}
.bgc-glaucous {color: rgba(255,255,255,.7); background-color: #5583BB;}
.bgc-outer-space {color: rgba(255,255,255,.7); background-color: #47454B;}
.ruky { background:url(../images/uvod-obraz-ruky.jpg) no-repeat; background-position: center center; background-size:cover;}

.btn {
    display: inline-block;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.33;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    border: 1px solid transparent;
	margin: 0 5px 5px 0;
    padding: 10px 16px;
    border-radius: 6px;
}

a, button {
    transition: all .3s ease-in-out;
    outline: none!important;
}
a {
    color: #337ab7;
    text-decoration: none;
}
a.c {cursor:pointer;}

.btn-glaucous {background: #5583BB;color: #FFFFFF;}
.btn-glaucous:hover { background:#336199;}
.btn-group-lg>.btn, .btn-lg {}

.btn-gray {background:#999;color:#fff;}
.btn-gray:hover {background:#555;}

.btn-next {  display: block; width:140px; height:auto; overflow:hidden;  padding: 8px 12px; text-align:center;
    font-size: 16px;    font-weight: 600;    line-height: 1.33;    text-align: center;    white-space: nowrap;    vertical-align: middle;
    cursor: pointer;    border: 1px solid transparent;	margin: 5px auto 5px auto;    border-radius: 6px;	background: #5583BB;color: #FFFFFF;}
.btn-next:hover { background:#336199;}

nav { width:96%; height:auto; padding:.5% 2%; overflow:hidden; border-bottom:1px solid #5583BB; background:#fff; }
nav a { font-weight:400; display:inline-block; padding:6px 12px;}
nav a:hover, nav a.active {background: #5583BB; color:#fff;}

#sec1 { padding-top:6vh; text-align: center}
.podpis { width:30%; height:auto; text-align:center;}

#sec2 { padding-top:6vh;}
.bubbles {width:540px; height:auto; overflow:hidden; margin:0 auto;}
.bubbles p { font-size:1.2em; margin:0.5em 0;} .bubbles p.small { font-size:.9em;}
.bubbles span { font-size:1.4em; font-weight:bold;}
.bubbles h2 { font-size:1.4em; margin:0.5em 0;}
.bgc-bubble-a, .bgc-bubble-b {  overflow:hidden; float:left; color: #fff; }
.bgc-bubble-a {width:auto; height:110px; padding:15px 40px 40px 40px;  background: url(../images/bubble_01.png) no-repeat center center; background-size: contain;}
.bgc-bubble-b {width:200px; height:auto; padding:35px 0 50px 30px; margin-top:70px; margin-left:-80px;  background: url(../images/bubble_02.png) no-repeat center center; background-size: contain;}

#sec3 { text-align: center; padding-bottom:0;}
#sec3 h1 {font-size: 3em; font-family: "Open Sans"; font-weight: 600; margin-top: 10px; margin-bottom: 20px; line-height: 1.1;color: #5583BB;}
#sec3 h2 {font-size: 2.25em; font-family: "Open Sans"; font-weight: 800; margin-top: 10px; margin-bottom: 20px;line-height: 1.1;}
#sec3 h3 {font-size: 1.75em; font-family: "Open Sans"; font-weight: 600; margin-top: 10px; margin-bottom: 20px; line-height: 1.1;color: #5583BB;}

#sec4 h3 {text-align: center;font-size: 1.75em; font-family: "Open Sans"; font-weight: 600; margin-top: 10px; margin-bottom: 20px; line-height: 1.1;color: #5583BB;}

#sec5 { padding-top:7vh;}

#sec6 { padding-top:8vh; padding-bottom:7vh;}
#sec6 h3 {font-size: 1.75em; font-family: "Open Sans"; font-weight: 600; margin-top: 10px; margin-bottom: 20px; line-height: 1.1;color: #5583BB; font-weight:bold;}
#sec6 p { font-size: 16px; line-height: 150%; color: rgba(0,0,0,.5);}

#sec8 { padding-bottom:150px;}

#sec9 { height:50vw; max-height:700px;}
#sec9 h2 { color:#fff; font-size:6vw; margin-top:20vw; text-align:center; transition:all .5s ease-in-out;}
#sec9 h2:hover {font-size:6.5vw;}

.col-sm-3 {width:24%; height:auto; overflow:hidden; margin-right:1%; float:left;}

.vad {width:100%; height:auto; overflow:hidden; }
.vad .btn { position:fixed; left:50%; bottom:0; margin-left:-90px; border:1px solid #fff; opacity:.7;}

#vzm {width:96vw; height:34.8vw; overflow:hidden; position:relative; background-image:url(../images/farebny_svet_o.png); background-repeat:no-repeat; background-size:contain; }
#vo { width:9.95vw; height:9.95vw; overflow:hidden; border:2px solid #000; position:absolute; left:0; top:0; z-index:111; cursor:move; background-color:#fff; opacity:0.5;}

#mzb {width:100%; height:auto; overflow:hidden; position:relative;}
#ldg {width:100px; height:100px; overflow:visible; z-index:-1; position:absolute; top:200px; left:207px; margin-left:15vw; background-image:url(../images/loading.gif); display:none;}

#mza {width:514px; height:auto; overflow:hidden; position:relative; float:left; margin-top:15px; margin-left:15vw;}
#mzk {width:180px; height:auto; overflow:hidden; position:relative; float:left; margin-top:50px; margin-left:40px; }
#mzf {width:450px; height:auto; overflow:hidden;  margin:50px auto 0 auto;  }

#mkc { width:100%; height:auto; overflow:auto; max-height:388px; margin-bottom:3px;}

#vad { background-position: 50% 0%; background-repeat:no-repeat; text-shadow:2px 5px 5px #000;}
#pic {width:433px; height:433px; overflow:hidden; position:relative; float:left;  }
#pfs {width:4196px; height:1514px; overflow:hidden; position:absolute; left:0; top:0; background-image:url(../images/fs.png); background-repeat:no-repeat; background-size:cover;
z-index:100; }
#dio {width:150px; height:auto; min-height:20px; overflow:hidden; color:#fff; background-color:#3C9; padding:5px 15px; position:fixed; top:0; left:0; opacity:0.85; display:none;
-moz-transition: all .5s ease;  -webkit-transition: all .5s ease;  -o-transition: all .5s ease;  transition: all .5s ease; z-index:123; border:1px solid #fff;}
.kam {width:18px; height:18px; overflow:hidden; position:relative; float:left; z-index:111; color:#FC0; font-size:13px; text-align:center; background-color: rgba(255,255,255,.6); cursor:pointer; }
.kam:hover {background-color: rgba(255,255,255,0);}
.kmd {width:18px; height:18px; overflow:hidden; position:relative; float:left; z-index:111; }
.kos {width:18px; height:18px; overflow:hidden; position:relative; float:left; z-index:111; font-size:13px; text-align:center; color:#E00; cursor:pointer; }
.kos:after { content:"❤";}


#mbu, #mbl, #mbr, #mbd { width:auto; height:auto; overflow:hidden; float:left; background: #5583BB; color:#fff; font-weight:bold; cursor:pointer; font-size:1.5em;}
#mbu:hover, #mbl:hover, #mbr:hover, #mbd:hover { background-color:#333;}
#mbu, #mbd { padding:0 30px 4px 30px;}
#mbl, #mbr { padding:21px 8px 21px 7px; }
#mbu { margin:0 200px 4px 220px; }
#mbd { margin:4px 200px 0 220px;}
#mbl { margin:179px 4px 0 0;}
#mbr { margin:179px 0 0 4px;}

#mbo { width:200px; height:28px; overflow:hidden; font-size:11px; position:absolute; right:0; top:6px;  }
#mbo label { cursor:pointer;}

#mes { width:1px; height:1px; overflow:hidden; border:1px solid #000; background:#fff; opacity:.4; position:absolute; left:0; top:0; z-index:133; display:none;}

.bl { width:100%; height:auto; overflow:hidden;}

.item { width:100%; height:auto; overflow:hidden; margin:4px 0; vertical-align:middle;}
.item img { display:inline-block; width:28px; height:28px; float:left; margin-right:15px;}
.item span { display:inline-block; width:95px; height:28px; float:left; font-size:1.1em; line-height:28px; text-align:justify; }
.item .del { display:inline-block; width:auto; height:28px; float:left; margin-left:10px;color:#aaa; font-size:1.8em; line-height:28px;  cursor:pointer;}
.item .del:hover {color:#c00; }

.item input[type=text], .item textarea { margin:5px 0; padding:8px 8px; border:1px solid #5583BB; font-size:1em;}
.item.h { display:none;}

.kosik { width:96%; height:auto; overflow:hidden; margin:4px 0; padding:2%; vertical-align:middle; background-color: #F5F5F5; text-align:center;}
.kosik img { display:inline-block; width:28px; height:28px;  margin-right:10px; border:1px solid #fff; vertical-align:top;}
.kosik span { display:inline-block; font-size:1.2em; padding:3px 0; margin-right:15px; elevation:top;}
.kosik p { margin:0.2em 0;}

#dary { width:0; height:0; overflow:hidden; display:none;}

#mzf .item label { display:block;float:left; width:160px; height:auto; overflow:hidden;margin:8px 0; line-height:28px;}
#mzf .item label.f { width:100%;}
#mzf .item label.cb { width:100%; display:inline-block; float:none;}
#mzf .item input[type=text], #mzf .item textarea {display:block; float:left;}
#mzf .item input[type=text].k { width:100px}
#mzf .item input[type=text].d, #mzf .item textarea.d { width:260px}
#mzf .item textarea.d { height:60px;}

.tabs { display:block;  width: 100%; height:auto; min-height:250px; overflow:visible; float: none; list-style: none; position: relative;  margin:0;  text-align: left; text-indent:0; padding:0}
.tabs li { float: left; width:auto; height:auto; overflow:visible;  text-indent:0; padding:0; margin:0 10px 0 0; }
.tabs input[type="radio"].ius { position: absolute; top: -9999px; left: -9999px; visibility:hidden;}
.tabs label.lus {  display: block; position: relative; padding: 6px 12px 8px 12px; margin-right: 2px;
  border: 2px solid #ccc;  border-radius: 5px 5px 5px 5px;  color:#333;   cursor: pointer;
  -moz-transition: all 0.2s ease-in-out;  -o-transition: all 0.2s ease-in-out;  -webkit-transition: all 0.2s ease-in-out;  transition: all 0.2s ease-in-out;
}
.tabs label.lus:hover {  background: #ccc; }
.tabs .tab-content { z-index: 2;  display: none; position: absolute; top:53px; left:0;  width: 100%; height:auto; overflow: visible;}
.tabs [id^="tab"]:checked + label.lus {/* background: #ccc;  color:#000;*/  background: #ccc;}
.tabs [id^="tab"]:checked ~ [id^="tab-content"] { display: block;}

.cb input { display:none;}
.cb span { width:17px; height:17px; display: inline-block; overflow:visible; margin:2px 8px -4px 0; padding:0!important; background:#FFF; border:1px solid #333; cursor:pointer; }
.cb input:checked + span {background:url(../images/chck.png);}

.err { padding:0.6em 1em; font-weight:bold; color:#fff; background-color:#c00;}

.video { width:100%; height:auto; overflow:hidden;}
.video iframe { width:100%; height:55.5vw;}

#footer  { font-size:0.8em; font-weight:normal;} #footer h3 { margin:0 0 0.5em 0;}
#footer p { margin:0.4em 0;}
#footer a { color:#0DE;}
#footer a:hover { color:#FFF;}
#footer #c1 {width:22%;height:auto; overflow:hidden; margin-right:3%; float:left;}
#footer #c2 {width:14%;height:auto; overflow:hidden; margin-right:2%; float:left;}
#footer #c3 {width:41%;height:auto; overflow:hidden; margin-right:3%; float:left;}
#footer #c4 {width:13%;height:auto; overflow:hidden; float:left;}


@media (min-width: 1400px){
#wrapper {width:1400px; margin:0 auto;}
#vzm {width:1372px; height:497px;}
#vo { width:142px; height:142px; overflow:hidden; border:2px solid #000; position:absolute; left:0; top:0; z-index:111; cursor:move;}

#sec9 h2 {font-size:80px; margin-top:320px; }
#sec9 h2:hover {font-size:90px;}
.video iframe { width:1400px; height:792px;}
}



@media (min-width: 992px){
#sec1 h3, #sec5 h3 { margin-left: 15%; margin-right:15%;}

}

@media (max-width: 1000px){
#footer #c1 {width:70%; margin-right:3%;}
#footer #c2 {width:27%; margin-right:0;}
#footer #c3 {width:70%;margin-right:3%; }
#footer #c4 {width:27%;}
}

@media (max-width: 800px){
.podpis { width:50%;}
#footer #c1, #footer #c2, #footer #c3, #footer #c4 {width:100%; margin-right:0; float:none; margin-bottom:1em;}

}