body {font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight:400; line-height: 1.4em; color:#12456a;}

/* obecné styly */
section {margin-top: 40px}
h2 {}
h3 {font-size: 18px; color: #12456a; font-weight: 600}
h4 {}
.modra {color: #647f97}
.modrab {color: #12456a; font-weight: 600;}
.zlata {color: #c4b179;}
.seda {color: #757575}
.cerna {color: #000}
.bila {color: #fff}

.bg-zlata {background-color: #c4b179;}
.bg-modra {background-color: #12456a;}
.bg-koralova {background-color: #ff7775; color: White}

a {text-decoration: none; color: #12456a}
a:hover {color: #757575}

/* výjimky pro prohlížeče */
@media (max-width: 1400px){
.posun { margin: -3.50rem 0 0 1rem!important;}
.posun2 { margin: 0 0 0 8rem!important;}
#startovaci .hlavni-obrazek .upoutavka-text {top: 180px!important; left: 110px!important}
#startovaci .hlavni-obrazek .upoutavka-text .nadpis {font-size: 4vw!important; }
#startovaci .hlavni-obrazek .upoutavka-text .text {font-size: 3vw!important; width: 35rem!important}
#startovaci .hlavni-obrazek .upoutavka-text-cviceni {padding: 250px 30px 40px 30px!important}
#startovaci .hlavni-obrazek .upoutavka-text-cviceni .nadpis {font-size: 3.5vw!important; margin-bottom: 20px!important }
#startovaci .hlavni-obrazek .upoutavka-text-cviceni .text {font-size: 1.7vw!important;line-height: 2vw!important}

}

@media (max-width: 1200px){
.posun { margin: -3.50rem 0 0 1rem!important;}
#startovaci .hlavni-obrazek .upoutavka-text {top: 140px!important; left: 90px!important}
#startovaci .hlavni-obrazek .upoutavka-text .text {width: 25rem!important}
#startovaci .hlavni-obrazek .upoutavka-text-cviceni {padding: 250px 30px 40px 30px!important}
#startovaci .hlavni-obrazek .upoutavka-text-cviceni .nadpis {font-size: 3.5vw!important; margin-bottom: 20px!important }
#startovaci .hlavni-obrazek .upoutavka-text-cviceni .text {font-size: 2.5vw!important;line-height: 3vw!important}
}


@media (max-width: 992px){  
#menu .odkazy .navbar-nav {position: absolute; right: 0; width: 25vw; text-align: right; background-color: #0d3451; padding: 80px 0 20px 0}
#menu .logo img {height: 50px!important}
#menu {height: 60px!important}
#menu .odkazy .navbar-toggler {top: 70px!important;z-index: 1080}
#menu .odkazy .navbar-nav li a {padding: 20px 10px 10px 30px!important}
.top-lista span {padding:20px 16px 20px 12px!important}
#startovaci .hlavni-obrazek {margin-top: 60px!important}
.posun { margin: 2rem 0 0 0!important;}
.posun2 { margin: 0 0 0 1rem!important;}
#startovaci .hlavni-obrazek .modre-pozadi {height: 80vw }
#startovaci .hlavni-obrazek .upoutavka-text {top: 120px!important; left: 40px!important}
#startovaci .hlavni-obrazek .upoutavka-text-cviceni {padding: 250px 30px 40px 30px!important}
#startovaci .hlavni-obrazek .upoutavka-text-cviceni .nadpis {font-size: 5vw!important; margin-bottom: 20px!important }
#startovaci .hlavni-obrazek .upoutavka-text-cviceni .text {font-size: 2.5vw!important; line-height: 4vw!important;}

#startovaci #predmluva {margin-top: 390px}

}



@media (max-width: 776px){
.posun2 { margin: 0 0 0 0rem!important;} 
#startovaci .hlavni-obrazek .upoutavka-text-cviceni {padding: 240px 30px 40px 30px!important}
#startovaci .hlavni-obrazek .upoutavka-text-cviceni .nadpis {font-size: 6vw!important; margin-bottom: 20px!important }
#startovaci .hlavni-obrazek .upoutavka-text-cviceni .text {font-size: 3vw!important; line-height: 4vw!important;}

#startovaci #predmluva {margin-top: 280px}
#startovaci .hlavni-obrazek .ilustracni-skupinove {height: 400px!important;}
#startovaci .hlavni-obrazek .ilustracni-individualni {height: 400px!important;}
}



@media (max-width: 576px){ 
.nemobil {display: none!important}
#menu .odkazy .navbar-nav {width: 100vw!important;}
.sloupecky { -webkit-column-count: 1!important; -moz-column-count: 1!important; column-count: 1!important;}
.posun { margin: 2rem 0 0 0rem!important;}
#startovaci .hlavni-obrazek .upoutavka-text {top: 60px!important; left: 20px!important}
#startovaci .hlavni-obrazek .upoutavka-text .nadpis {font-size: 5vw!important;}
#startovaci .hlavni-obrazek .upoutavka-text .text {font-size: 2.5vw!important; width: 15rem!important}
.upoutavka {padding: 20px!important}

#startovaci .hlavni-obrazek .upoutavka-text-cviceni {padding: 150px 30px 40px 30px!important}
#startovaci .hlavni-obrazek .upoutavka-text-cviceni .nadpis {font-size: 7vw!important; margin-bottom: 20px!important }
#startovaci .hlavni-obrazek .upoutavka-text-cviceni .text {font-size: 3.5vw!important; line-height: 5vw!important;}
#startovaci #predmluva {margin-top: 330px}
#startovaci .hlavni-obrazek .ilustracni-skupinove {height: 300px!important;}
#startovaci .hlavni-obrazek .ilustracni-individualni {height: 300px!important;}
}


/* menu */
#menu {position: absolute; top: 0; right: 0; left: 0; z-index: 1030;  height: 90px; border-bottom: 1px solid #2a5879}
.top-lista {position: fixed; z-index: 1200; top: 0; right: 0; display: inline-block; font-size: 16px}
.top-lista strong {font-weight: 600;}
.top-lista span {padding:35px 16px 35px 12px;}
.top-lista .fa-2x {font-size: 1.2em;}
.top-lista a {color:White; text-decoration:none;}
.top-lista a:hover {color: #c4b179}

#menu .logo {border-right: 1px solid #597c96}
#menu .logo img {height: 82px}

#menu .navbar {background-color: #12456a;}
#menu .odkazy .navbar-nav li a {color: white; border-right: 1px solid #597c96; padding: 20px 30px}
#menu .odkazy .navbar-nav li a:hover {color: #c4b179}
#menu .odkazy .navbar-toggler {position: absolute; right: 0; top: 20px}
#menu .odkazy .navbar-toggler:focus {background: none;outline: 0; box-shadow: none}
#menu .odkazy .navbar-toggler span {display: block;width: 45px;height: 7px;margin: 6px auto;background: #fff;transition: all .6s cubic-bezier(0.250, 0.100, 0.250, 1.000);}
#menu .odkazy .navbar-toggler:hover span,
#menu .odkazy .navbar-toggler:focus span {background-color: #c4b179;}

#startovaci .hlavni-obrazek {position: relative; margin-top: 90px;}
#startovaci .hlavni-obrazek .modre-pozadi {background-image: url(img/pistorova-slide-pozadi-modre.jpg);background-repeat: no-repeat;background-size: cover;}
#startovaci .hlavni-obrazek .ilustracni-skupinove {background-image: url(img/jana-pistorova-slide-002.jpg);background-repeat: no-repeat;background-size: cover; height: 600px}
#startovaci .hlavni-obrazek .ilustracni-individualni {background-image: url(img/jana-pistorova-slide-003.jpg);background-repeat: no-repeat;background-size: cover; height: 600px}



#startovaci .hlavni-obrazek .upoutavka-text {position: absolute; top: 250px; left: 380px; z-index: 1005}
#startovaci .hlavni-obrazek .upoutavka-text .nadpis {color: #c4b179; font-size: 50px; font-weight: 700; margin-bottom: 60px}
#startovaci .hlavni-obrazek .upoutavka-text .text {color: White; font-size: 30px; font-weight: lighter; width: 35rem; line-height: 35px }


#startovaci .hlavni-obrazek .upoutavka-text-cviceni {padding: 250px 30px 0 300px}
#startovaci .hlavni-obrazek .upoutavka-text-cviceni .nadpis {color: #c4b179; font-size: 50px; font-weight: 700; margin-bottom: 60px}
#startovaci .hlavni-obrazek .upoutavka-text-cviceni .text {color: White; font-size: 30px; font-weight: lighter;  line-height: 35px }

.upoutavka {color: white;  border-radius: inherit!important; border: 0}
.upoutavka a {color: white; text-decoration: none}
.upoutavka a:hover {color: #666666}
.upoutavka .btn {color: White; border-radius: inherit;}
.upoutavka .btn:focus {box-shadow: none;}
.posun { margin: -10.50rem 0 0 -1rem ; position: relative; z-index: 9;}

.sloupecky { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2;}
.posun2 { margin: -10.50rem 0 0 9rem ; position: relative; z-index: 9;}


/* paticka */
#footer {padding-top: 30px; padding-bottom: 30px;border-top: 1px solid silver; font-size:16px;}
#footer strong {font-weight:900;}
#footer span {white-space: nowrap;}