/* CSS Document */

/* CSS Document */

/* =============== resetovani css =============== */

html, body, div, span, applet, object, iframe,

h1, h2, h3, h4, h5, h6, p, blockquote, pre,

a, abbr, acronym, address, big, cite, code,

del, dfn, em, img, ins, kbd, q, s, samp,

small, strike, strong, sub, sup, tt, var,

b, u, i, center,

dl, dt, dd, ol, ul, li,

fieldset, form, label, legend,

table, caption, tbody, tfoot, thead, tr, th, td,

article, aside, canvas, details, embed,

figure, figcaption, footer, header,

menu, nav, output, ruby, section, summary,

time, mark, audio, video {

    margin: 0;

    padding: 0;

    border: 0;

    font-size: 100%;

    font: inherit;

    vertical-align: baseline;

}

/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure,

footer, header, menu, nav, section {

    display: block;

}

body {

    line-height: 1;

}

ol, ul {

    list-style: none;

}

blockquote, q {

    quotes: none;

}

blockquote:before, blockquote:after,

q:before, q:after {

    content: '';

    content: none;

}

table {

    border-collapse: collapse;

    border-spacing: 0;

}

/* =============== Hlavni =============== */



html {height: 100%; font-size: 62.5%; /*color:#7c7c7c;*/ color: #59595b; font-family: 'Open Sans', sans-serif; font-weight: 400; background-color: #3a393a;}

body {height: 100%; text-align: center; margin: 0; padding: 0;}



img { border:0; }

h1 {font-size: 3em; line-height: 150%; color: #dc214c;  font-weight: 900; text-transform: uppercase;/* margin-bottom: 1em;*/ /*margin-top: 1em;*/}

h2 {color: #2d2d2e; font-size: 1.8em; font-weight: 900; /*text-transform: uppercase;*/}

h3 {color: #dc214c; font-size: 1.8em;  font-weight: 400; line-height: 150%;}

ol li { /*margin-bottom: 7px; margin-top:7px; font-size:16px; line-height: 20px;*/}

ul li {/*padding-left:15px; font-size: 14px; line-height: 28px;*/}

strong {font-weight:bold;}

b {font-weight: bold; color: #2d2d2e }

em {font-style:italic;}

p {margin-top: 1em; margin-bottom: 1em; font-size:1.4em; line-height: 120%;}



.cleaner {clear: both; height: 0; font-size: 0; visibility: hidden;}

.content {padding-left:8.064516129032258%; padding-right:8.064516129032258%;}

.vcontent {padding-top: 7em;  padding-bottom: 7em;}

.vcontent_top {padding-top: 7em;}

.vcontent_bottom {padding-bottom: 7em;}

.right {float:right;}

.left {float:left;}

.center {text-align: center;}



a:link, a:visited {color: #007ba5;}

a:hover{color: #3972a5}



.wrap {/*obal*/ text-align: left; margin: 0 auto; background-color: white; }

@media screen and (max-width: 1239px) {.wrap{width: 100%}}

@media screen and (min-width: 1240px) {.wrap{width: 1240px;}}



a.button1 {color:#2d2d2e; text-decoration: none; background-color:#f2a05b; text-align:center; line-height: 250%;

    padding-top: 0.7em; padding-bottom: 0.7em; text-transform: uppercase;

    cursor: pointer;  padding-left: 1.5em; padding-right: 1.5em; font-weight: 900; }

a.button1:hover {background: #efcf95; }



a.button { text-decoration: none; text-align:center; width: 41px; height: 41px; background-image:url("../images/arrow.png"); display: block; background-repeat: no-repeat; background-color: transparent; cursor: pointer;}

a.button:hover {}



#header { padding: 0; text-align: center; min-height: 35px; padding-top: 20px; background-color: #c23858; }

#header img {margin: 0; padding: 0; position: absolute; top: 1em; }

#header .logo {text-align: center;}

#header .navigace {position: relative; text-align: left;}

#header .left {width: 25%; text-align: left; }

#header .right {width: 75%; text-align: left;}

#header .left p {margin-top: 2.7em; margin-bottom: 0.8em;}

#header .left p span {background: #d93611; padding: 10px; padding-left: 20px; padding-right: 20px; color: white; text-transform: uppercase}



#header  {position: relative;}

#header .fb {width: 83.8%; position: absolute; text-align: right; top: 12px;}

#header .fb a{display: inline-block; width: 30px; height: 30px; background-image: url("../images/fb.jpg"); background-repeat: no-repeat; background-position: top left; color: transparent; line-height: 30px; z-index: 500; position: absolute; }

#header .fb a:hover {text-decoration: none;}





.slide {background-image: url("../images/tanecni-kurzy-top.jpg"); background-repeat: no-repeat; background-position: top center; background-size: cover; min-height: 369px;}

.slide h2 {font-size: 3em; color: #c23858; line-height: 120%; margin-bottom: 0.5em;  text-transform: uppercase; font-weight: 900;}

.slide p.title { color: #2d2d2e;  font-size: 2em; line-height: 150%; font-weight: 400; margin-top: 0.5em;}

.slide  a{ color: #2d2d2e;  font-size: 1em; font-weight: 900; border-radius: 5px; /*margin-top: 1em;*/ display: inline-block; padding-top: 0.5em; padding-bottom: 0.5em; padding-left: 1em; padding-right: 1em;}

.slide p strong { font-size: 2.2em;}

.slide .left {width: 25%; text-align: left; }

.slide .right {width: 75%; text-align: left;}



.slide .fb a {display: inline-block; width: 38px; height: 35px; background-image: url("../images/fb.png"); background-repeat: no-repeat; background-position: bottom left; color: transparent; line-height: 36px; ; margin-left: 5px; color: transparent;margin-top: 0; background-size: contain; }

.slide span.tlac {float: left; width: auto;}

.slide span.fb {float: left; width: 61px;}





.kurzy-info1, .kurzy-info {margin-top: 1em;}

.page .kurzy-info1 .right h2 {margin:0; font-size: 1.8em; color: #f2a05b; font-weight: 900; text-transform: uppercase;}

.page .kurzy-info1 .right h3 {font-size: 1.6em; color: #2d2d2e; font-weight: 600; }

.page .kurzy-info1 .right p {font-size: 1.2em; margin-top: 0.5em; margin-bottom: 0.5em; }

.page .kurzy-info1 .right ul  {margin-top: 2em;}

.page .kurzy-info1 .right ul li  {margin-top: 1em;}

.kurzy-info1 .left {padding-right:4%;}

.kurzy-info1 .right {background-image: url("../images/line.png"); background-repeat: no-repeat; background-position: top left; padding-left:4%; }

.kurzy-info .left ul li {padding-left: 65px; background-image: url("../images/icon-tanecni-kurzy.png"); background-repeat: no-repeat; background-position: top left; padding-bottom: 0.8em;}





.page .tanecni-kurzy {padding-left: 65px; background-image: url("../images/icon-tanecni-kurzy.png"); background-repeat: no-repeat; background-position: top left; padding-bottom: 0.8em; min-height: 50px;}





.page .infotip {background-image: url("../images/icon-info.png"); background-repeat: no-repeat; background-position: top left; padding-left: 65px; margin-top: 2em; margin-bottom: 2em; min-height: 50px;}







.lektori li {display: inline-block;float: left; width: 40%; padding: 5px; border: 1px solid #dddbdc; text-align: center; padding-top: 15px; padding-bottom: 15px; margin-right: 20px; ackground-color: #dddbdc; border-left: 5px solid #f2a05b;}

.lektori li header {float: left; width: 50%; }

.lektori li footer {float: right; width: 50%; text-align: left; }

.lektori li h3 {font-size: 1.6em; color: #2d2d2e; margin-bottom: 0;margin-top: 0.5em; font-weight: 900;}

.lektori li p {margin-top: 0.5em;}



.page .banner { background-color: #f2a05b; color: #2d2d2e; margin-top: 1em; margin-bottom: 1em;}

.page .banner .text.left {width: 60%; padding-left: 4%;}

.page .banner .img.right {width: 30%; background-image: url("../images/jake-tanecni-boty.jpg"); min-height: 242px; background-repeat: no-repeat; background-size: cover;}



.page .banner .text.right {width: 64%; padding-left: 2%; padding-right: 2%}

.page .banner .img.left {width: 30%; background-image: url("../images/jake-tanecni-obleceni.jpg"); min-height: 242px; background-repeat: no-repeat; background-size: cover;}



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

    .slide .left {margin-right: 5%; width: 20%; }

    .page .banner .text.left {width: 92%; padding: 4%; }

    .page .banner .img.right {width: 100%;}

    .page .banner .img.right {background-position: left bottom;}



    .page .banner .img.left {width: 100%;}

    .page .banner .text.right{width: 92%; padding: 4%; }



    .page-text ul.lektori li {display: block; float: none; width: 98%; margin: 0; margin-top: 1em; margin-bottom: 1em; }

}

@media screen and (min-width: 430px) and  ( max-width: 630px) {



}



@media screen and (min-width: 630px) and  ( max-width: 1030px) {



}



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

   .slide .left {width: 100%; margin-right: 0; float: none; margin-bottom: 2em;}

   .slide .right {width: 100%; margin-right: 0; float: none;}

}



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

    .top img {max-width: 100%;}

}





.text-blok {padding-top: 1em;}







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

    #header .logo {width: 100%; margin-bottom: 2em; }



}



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

    #header .logo {width: 100%; margin-bottom: 2em; }



}

/*

.menu_products {background-color: white; border-top: 1px solid #dddfdf; border-bottom: 1px solid #dddfdf; margin-bottom: 3em; padding-left: 5.5em;}

.menu_products ul{list-style-type: none; width: 100%;}

.menu_products ul li {display: inline-block; float: left; text-align: center;}

.menu_products ul li:nth-child(6n){clear: both; padding-left: 4em;}

.menu_products ul li a {color: #262727; font-size: 1.4em; display: block; width: 100%; line-height: 3em; text-decoration: none; padding-left:1em; padding-right: 1em; }

.menu_products ul li a:hover {color: #00387b;}

*/



.page {width: 100%; background-color: #f7f7f1; background-repeat: repeat;}

.page p {margin-top: 1em; margin-bottom: 1em; padding: 0; line-height: 150%;}

.page h2 {margin-top: 1em; margin-bottom: 1em;}

.page .left {width: 62%;}

.page .right {width: 30%;}

.page-text {}

.page .page-text p {font-size: 1.4em;}

.page .page-text a {/*text-decoration: none;*/}

.page-text ul {list-style-type: disc; margin-top: 1em; margin-bottom: 1em;}

.page-text ul li{margin-left: 40px; line-height: 150%; font-size: 1.4em; }

.page-text ol {list-style-type: decimal; margin-top: 1em; margin-bottom: 1em;}

.page-text ol li{margin-left: 40px; line-height: 150%; font-size: 1.4em; }

.page-text ul li.noli p {font-size:1em;}

.page .page-text ul li p {font-size:1em;}

.page-text ul li h2 {font-size:1.4em;}

.page-text ul li.noli {list-style-type: none;}

.page-text img {max-width:100%;height:auto;}

.page .page-text table tbody td p {margin: 0; padding: 0; font-size: 1em; line-height: 21px;}

.page table tbody td {padding:5px;}

.page table.tab1 tbody td {border: 1px solid #d1d2cd;padding:5px;}

.page table tbody td, .table_1 thead th {font-size: 1.4em; }

.page table tbody td a:link {font-size: 1em;}

.page table tbody td a.download:link {margin: 0; padding: 0; font-size: 0;}

.page table tbody td ul li {font-size: 1em;}

.page table img {max-width:100%;height:auto;}





.blok3 {background-image: url("../images/dluhove-poradenstvi.jpg"); background-repeat: no-repeat; background-position: top right; padding-right: 20%; background-size: cover;}



.blok {background-color: rgba(52, 49, 54, 0.73); width: 100%; color:#000000;}

.blok2 {background-color: #005370;  text-align: center; }

.blok2 h2 {font-size: 3em; color: #f6f7f1;; text-transform:uppercase; font-weight:100; }

.blok2 p {color: #f6f7f1; font-size: 1.4em; margin-bottom: 2em;}

.blok2 a:link, .blok2 a:visited {color:#f6f7f1;}







.icons li{ float: left; display: inline-block; width: 21%; padding-left: 2%; padding-right: 2%;}

.icons li img {max-width: 100%; height: auto;}

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

    .icons li {width: 46%; }

    .icons li:nth-child(2n+1){clear: both;}

}

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

    .icons li {width: 96%; float: none; }

}







.news_all ul {list-style-type: none;}

.news_all ul li {float: left; display: inline-block; width: 25%; padding:3em; margin-left: 3em; border: 1px solid #d1d2cd; margin-top: 1.5em; min-height: 47em; }

.news_all ul li:nth-child(1n){}

.news_all ul li:nth-child(3n+1){clear: both; margin-left: 0;}

.news_all ul li:nth-child(3n){margin-right: 0;}

.news_all ul li:first-child{}

.news_all a h2 {color: #1f1f1f; font-size: 1.4em;  font-weight: 700; text-transform: uppercase;}

.news_all ul li a {text-decoration: none;}





.news {/*background-color: #e8d5a0; */padding: 3em; margin-left: 5em; border: 10px solid #edefef; margin-top: 1.5em;}

.news h2 {color: #da251c; font-family: 'Oswald', sans-serif; font-weight: 700; margin-top: 0; font-size: 1.8em; text-transform: uppercase; text-align: center; border-bottom: 1px solid;}

.news h3 {color: #1f1f1f; font-size: 1.4em; font-family: 'Oswald', sans-serif; font-weight: 700; text-transform: uppercase;}

.news p {color: #1f1f1f; font-size: 1.2em; }

.news img {margin-top: 1em;}



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

    .page .left, .page .right {float: none; width: 100%;}

    .page .right .news {max-width: 230px;}

}



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

    .hp .page .left, .hp .page .right {float: none; width: 100%;}

    .hp .page .right .news {max-width: 230px; margin: auto;}

}



.galerie.blok {background-color: rgb(203, 203, 201);}



.galerie ul {list-style-type: none; margin-bottom: 0;}

.galerie ul li {float: left; display: inline-block; width: 23.5%; padding:1%;}

.galerie ul li:nth-child(1n){}

.galerie ul li:nth-child(4n+1){clear: both; padding-left: 0;}

.galerie ul li:nth-child(4n){padding-right: 0;}

.galerie ul li:first-child{}



.galerie h1, .galerie h2 {margin: 0;}



/*

.page a:link, .page a:visited {font-size: 1em;}

.page a:hover {}

.page .left a:link, .page .right a:link {font-size: 1em;}

.page ul {list-style-type: decimal; margin-left: 3%;}

.page ol {list-style-type: disc; margin-left: 4%;}

.page ul li {font-size: 1.4em; line-height: 150%; padding-left: 1%;}

.page ul li ol li {font-size: 1em; padding-left: 1%;}*/





.form1 {margin-top: 20px; margin-bottom: 20px;}

.form1 input:not([type=submit]){ font-size: 1.4em; line-height: 150%;  width: 100%; margin-bottom: 14px; padding-left: 5px; color:#828282;}

.form1 select {font-size: 1.4em; line-height: 150%; padding-left: 5px; margin-bottom: 14px; height: 28px; color:#828282; }

.form1 textarea {width: 100%; height: 200px; margin-bottom: 22px;}

.form1 label {font-size: 1.4em; line-height: 150%; padding-right: 10px;}

.form1 input[type=submit]{ color:#ffffff; text-decoration: none; background-color:#02adef;  text-align:center; line-height: 250%;

    text-transform: uppercase; cursor: pointer; border: 0;font-size: 0.8em; font-weight: 600; border-radius: 5px; margin-top: 1em; display: inline-block; padding-top: 0.5em; padding-bottom: 0.5em; padding-left: 1em; padding-right: 1em;}

.form1 input[type=submit]:hover {background: #efcf95; }

.form1 input[type=checkbox]{width: auto;}







#contactform {text-align: center;}

#contactform form {margin-top: 3em;}

#contactform form input:not([type=submit]){ background-color: transparent; border: 1px solid #919294; padding: 1%; }

#contactform form input[type=text]{ font-size: 1.4em;  line-height: 120%; margin-bottom: 0.7em; color: black; width: 90% ;}

#contactform form input.cc{display: none;}

#contactform textarea {height: 6.5em; width: 98%; border: 1px solid #919294; padding: 1%; font-size: 1.4em; font-family: 'Roboto', sans-serif;

    margin-bottom: 2em; background-color: transparent;}

#contactform input[type=submit] {color:white; font-weight: 700; text-decoration: none; background-color:#dc214c;  text-align:center; line-height: 250%;

    text-transform: uppercase; cursor: pointer; border: 0; font-size: 1.6em; font-weight: 600; border-radius: 5px; margin-top: 1em; display: inline-block; padding-left: 1.5em; padding-right: 1.5em; margin: auto;}

#contactform input[type=submit]:hover {background: #89787e;  }

#contactform a:link, #contactform a:visited {text-decoration: none; color: white;}

#contactform a:hover {text-decoration: underline;}

#contactform h2 {margin: 0; line-height: 100%; text-transform: uppercase;color: #1c1c1d}

#contactform p {margin: 0; }

#contactform table {width: 100%;}

#contactform table td {vertical-align: top; width: 60%;}

#contactform .left {width: 50%; padding-top: 17px; text-align: left;}

#contactform .right {width: 50%; text-align: left;}

#contactform .label {padding-right: 10px; font-size: 1.2em;}

#contactform td.label {width: 10%}

#contactform form .dd input[type=text]{visibility: hidden; height: 0; font-size:0; margin-bottom: 0; }

#contactform form .dd input:not([type=submit]){padding: 0; }

#contactform form .dd td {color: transparent;}



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

    #contactform .left {width: 100%;float:none;}

    #contactform .right {width: 100%; float: none;}

}





#footer {width: 100%; background-color: #343136; color: #a1a1a2; position: relative;}

#footer ul li {display: block; float: left; width: 50%; line-height: 150%;}

#footer ul.count2 li{width: 50%;}

#footer ul.count3 li{width: 33%;}

#footer ul.count4 li{width: 25%;}

#footer ul li ul li {display: block; float: none; width: 100%; }

#footer ul.count2 li ul li {width: 100%;}

#footer ul.count3 li ul li {width: 100%;}

#footer ul.count4 li ul li {width: 100%;}

#footer ul li ul li {display: block; float: none; width: 100%; }

#footer ul li header, #footer ul li header a {color: #a1a1a2; font-size: 1.2em; text-transform: uppercase;  padding-bottom: 1em;

    text-decoration: none; font-weight: 700;}

#footer ul li ul li a, #footer ul li ul li  {color: #a1a1a2; font-size: 1.2em; text-decoration: none; font-weight: 400;}

#footer ul li ul li a {font-size: 1em;}

#footer ul li ul li a:hover {text-decoration: underline;}





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



    #footer ul li {width:100%; text-align: center; margin-bottom: 2em;}

    #footer ul.count2 li{width:100%;}

    #footer ul.count3 li{width:100%;}

    #footer ul.count4 li{width:100%;}

}









.webdesign {width: 100%; padding-top: 3.5em; padding-bottom: 2.5em; background-color: #202021; text-align: center; }

.webdesign, .webdesign a {color: #6b6c6a; text-decoration: none; }

.webdesign p { margin: 0;font-size: 1.2em;}





.table_cela {width: 100%;}

.table_1 tbody tr:hover {background: #ddd;}

.table_1{ border: none; border-collapse:collapse;}

.table_1 thead tr { border-bottom: 1px solid #c2c1c1; background: #c2c1c1; }

.table_1 thead th { border: 1px solid #999; padding: 15px; height: 25px; white-space: nowrap; line-height: 150%; }

.table_1{ border: none; border-collapse:collapse;}

.table_1 tbody tr { border-bottom: 1px solid #c2c1c1; cursor: pointer; }

.page .table_1 tbody td { border: 1px solid #c2c1c1; text-align:left; padding: 10px; vertical-align: middle; }

.table_1 tbody td.top {vertical-align: text-top;}

.table_1 tbody td p {margin: 0; padding: 0; font-size: 1.4em; line-height: 21px;}

.table_1 tbody td, .table_1 thead th {font-size: 1.4em; }

.table_1 tbody td a:link {font-size: 1em;}

.table_1 tbody td a.download:link {margin: 0; padding: 0; font-size: 0;}



.tab2 {width: 100%; border: 1px solid #f2a05b;}

.tab2 tbody td p {margin: 0; padding: 0; font-size: 1em; line-height: 21px;}

.tab2 tbody td h2 {margin: 0; padding: 0; font-size: 1.3em; line-height: 150%;}

.tab2 tbody td h3 {margin: 0; padding: 0; font-size: 1.1em; line-height: 150%;}

table.tab2 tbody td {padding:15px;}

.tab2 tbody td, .table_1 thead th {font-size: 1.4em; }

.tab2 tbody td a:link {font-size: 1em;}

.tab2 tbody td a.download:link {margin: 0; padding: 0; font-size: 0;}

.tab2 tbody td ul li {font-size: 1em;}

.tab2 img {max-width:100%;height:auto;}

.tab2 td {border-left:  1px solid #f2a05b; border-right:  1px solid #f2a05b; }



/* =============== flashMessage =============== */

#flashmessage {color: black; background: #a09f43;}

div.flash { color: black; text-align: center; width: 100%; font-size: 1.4em; line-height: 150%; padding-top: 1em; padding-bottom: 1em;}



/* =============== KONEC flashMessage =============== */



@media print

{

    .noprint {display:none;}

}







.pagination { border:0; margin:0; padding:0;text-align:center; margin-top: 4em;}

.pagination li { border:0; display: inline-block;margin:0; padding:0;font-size:11px;list-style:none;margin-right:2px;}

.pagination li a { border:solid 1px #f14b3e; background-color:white; }

.pagination li.active a { background:#f14b3e;color:#FFFFFF;/*font-weight:bold;*/}

.pagination .previous-off,

.pagination .next-off, .pagination li.disabled a { border:solid 1px #DEDEDE;color:#888888; background-color:white;/*font-weight:bold*/;margin-right:2px;padding:3px 4px; }

.pagination li.disabled a {display:block;padding:3px 6px;text-decoration:none;}

.pagination .next a,

.pagination .previous a{ /*font-weight:bold;*/}

.pagination a:link,

.pagination a:visited { color:#f14b3e;display:block;padding:3px 6px;text-decoration:none;}

.pagination a:hover{ border:solid 1px #f14b3e;}



.page .pagination li {line-height: 100%; padding-left: 0;}



/* =================== navigace newww =============*/

nav.menu {

    display: block;

    background: transparent;

    width: 100%;

    padding-left: 0;

    z-index: 300;

}

nav.menu ul {

    list-style-type: none;

    margin:0;

    padding:0;

    position: absolute;

    background: transparent;

    display: none;/*skryvani menu*/

    width: 100%;

    text-align: center;

}

nav.menu ul li {

    width: auto;

    text-align: left;

    margin-left: 20px;

    margin-right: 20px;

}

nav.menu a {

    display: block;

    color: #f7f7f1;

    text-decoration: none;

    font-family: sans-serif;

    font-size: 1.4em;

    font-weight: 600;

    line-height: 3em;

    padding: 0 5px;

    cursor: pointer;

    width: auto;

    text-transform: uppercase;

    position: relative;

    border-bottom: 2px solid transparent;



}



/*Style for dropdown links*/

nav.menu li:hover ul a {

    background: rgba(255,255,255,0.8);

    color: #2d2d2e;

    height: 40px;

    line-height: 40px;

    font-weight: 400;

    text-align: left;



}





/*Hide dropdown links until they are needed*/

nav.menu li ul {

    display: none;

    width: auto;

    padding: 0;

    padding-top: 17px;

    background: transparent;

}



/*Make dropdown links vertical*/

nav.menu li ul li {

    display: block;

    float: none;

    width: auto;

    margin-left: 0;

    margin-right: 0;

}



/*Prevent text wrapping*/

nav.menu li ul li a {

    width: auto;

    min-width: 100px;

    padding: 0 20px;

}



/*Display the dropdown on hover*/

nav.menu ul li a:hover + .hidden, nav.menu .hidden:hover {

    display: block;

}







nav.menu a span {position: relative; display: block; width: 100%; text-align: left;}

nav.menu a:hover {

   border-bottom: 2px solid #f6f7f1;

}

nav.menu ul li#activetop a {  border-bottom: 2px solid #f6f7f1}

/*skryvani menu */

/*Display 'show menu' link*/

.show-menu {

    display:block;

    text-decoration: none;

    color: #fff;

    background: #f2a05b;

    text-align: left;

    font-size: 1.4em;

    font-family: sans-serif;

    line-height: 2em;

    padding: 0 15px;



}

/*Hide checkbox*/

input[type=checkbox]{

    display: none;

}

/*Pointer on Hover, so that the user knows of an active link*/

.show-menu:hover {

    cursor:pointer;

}

.show-menu {background-image: url("../images/menu-line.png"); background-repeat: no-repeat; /*background-position: left 10px center;*/ padding-left: 40px;}

/*Show menu when invisible checkbox is checked*/

input[type=checkbox]:checked ~ #menu {

    display: block;

}

/*Center the text*/

li ul li a {

    text-align:center;

}





@media screen and (min-width: 601px) {

    nav.menu {

        background: transparent;

        position: relative;

    }

    nav.menu ul {display: block;}/*skryvani menu*/

    nav.menu ul li {

        width: auto;

        background: transparent;

        display: inline-block;

        text-align: center;



    }

    nav.menu a {

        line-height: 120%;

        padding: 0 5px;

    }

    /* skryvani menu Style 'show menu' label button and hide it by default*/

    .show-menu {

        display: none;

    }



}

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

    nav.menu a {width: 100px;}

}





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

    nav.menu { padding-bottom: 0em;}

    /*Make dropdown links appear inline*/

    nav.menu   ul {

        position: static;

        display: none;

    }

    /*Create vertical spacing*/

    nav.menu    li {

        margin-bottom: 1px;

    }

    nav.menu li a { min-width: 140px;

        padding-left: 0px; padding-right: 0px;}



    /*Make all menu links full width*/

    nav.menu   ul li, nav.menu li a {

        width: 100%;

    }

    /*Display 'show menu' link*/

    .show-menu {

        display:block;

    }

}





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

    nav.menu ul li {margin-left: 0; margin-right: 0;}

    .show-menu {background-color: transparent; color: transparent; padding-left: 0;}

    nav.menu ul li ul li  {font-size: 0.8em;}

}