:root{
    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI Variable", "Segoe UI",
                 Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans",
                 "DejaVu Sans", "Cantarell", "Ubuntu", system-ui, sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
                 "Liberation Mono", "DejaVu Mono", "Ubuntu Mono", monospace;
    --font-serif: "Noto Serif", Georgia, "Times New Roman", serif;
  }

  html, body{ font-family: var(--font-sans); }
  h1, h2, h3{ font-family: var(--font-sans); font-weight:700; }
  code, pre, kbd, samp{ font-family: var(--font-mono); }

body {  
   font-size: 18px;
   margin : 0;   
   max-width: 100%;
   overflow-x: hidden;      
}

body.page-index {
   color: #fff;
   background-color : #13182a;
}

body.page-admin {
   color: #13182a;
   background-color : #fff;
}

a                { color: #ed1c24; text-decoration: none; } 
a:hover          { color: #a4a9b9; text-decoration: underline; } 

.header { text-align: center; }
.header a { padding: 50px 0; display: block; font-size: 48px; text-decoration: none; color: #656565; }

textarea {
   font-size: 18px;  
}

p.vsetkynovinky {
  float: right; 
}


.cube { display: inline-block; padding: 0px; margin: 0px; padding-bottom: 40px; padding-top: 20px; width: 33%; max-width: 390px; min-width: 300px; vertical-align: top; text-align: center; margin: 0 auto; } 
.icon_footer  { margin-bottom: 30px; margin-top: 20px; }

div.footer_icon { 
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  background-color: #0067ac;
  width: 50px;
  height: 50px;
  margin: 0px;
  border-radius: 50%;
  padding: 0px;
  transition: 0.6s;
}
div.footer_icon:hover {
  background-color: #ef1c25;
}
img.footer_icon { 
  margin: 14px;
  width: 22px;
  padding: 0px;
}

div.icon { display: inline-block; min-width: 190px; padding: 0px; margin: 0 auto; }
img.icon { width: 170px; padding: 0px; margin: 0px; }
img.icon_footer  { margin-bottom: 30px; }

/* STRUCTURE */
* {
  box-sizing: border-box;
}

#minilogo {
  display: inline-block;
  vertical-align:middle;
  width: 100%;
  height: 100%;
  max-width: 60px;
  padding: 0px;
  margin: 0px;
  padding-right: 15px;
  margin-top: -10px;
}

#nadpis         { padding-top: 40px; font-size: 24px; color: #fff; text-align: left; }
#novinkynadpis  { padding-top: 20px; padding-bottom: 20px; font-size: 24px; color: #0067ac; }

p.novinkatext   { padding: 0px; font-size: 18px; text-align: left;}

div.novinka        { width: 100%; height: 200px; margin-bottom: 20px; }

div.novinka2 {
  width: 100%;
  height: auto; 
}
#novinka2 {
  width: 100%;
  max-width: 1200px;  
  margin: 0px auto;    
  padding: 0px;
  text-align: center;
}

.container {
   display: flex;
   margin: 0px;
}

.section {
   padding: 0px;
   -o-transition:.5s;  -ms-transition:.5s;  -moz-transition:.5s;  -webkit-transition:.5s;  transition:.5s;
   flex: 1; /*grow*/
   border: 0px solid;
}
.section:hover {
  filter:alpha(opacity=60);-moz-opacity:.60;opacity:.60; cursor: pointer; 
}

@media (max-width: 1000px) { /*breakpoint*/
  .container {
    flex-direction: column;
  }
}

.outer {
  position: relative;  
  padding: 0px;
  margin: 0px;
  height: auto;
  width: 100%;
}
.inner {  
  margin: 0 auto;  
  text-align: center;
  padding-top: 0px;  
  padding-bottom: 30px;  
  max-width: 1200px;
  width: 100%;
}

#kdesom1 {    
  width: 100%;
  height: 91px;
  background-color: #0c0f1b;    
  vertical-align: middle;  
  padding: 0px;
  margin: 0px;
}

#kdesom2 {   
  vertical-align: middle;  
  margin: 0 auto;
  padding: 0px;
  width: 100%;
  height: 100%;
  max-width: 1200px;   
}

#scroll {
    position:fixed;
    right:30px;
    bottom:30px;
    cursor:pointer;
    width:50px;
    height:50px;
    background-color:#0067ac; 
    text-indent:-9999px;
    display:none;

}
#scroll span {
    position:absolute;
    top:50%;
    left:50%;
    margin-left:-8px;
    margin-top:-12px;
    height:0;
    width:0;
    border:8px solid transparent;
    border-bottom-color:#fff;
}
#scroll:hover {
    background-color:#0067ac;
    opacity:1;
    filter:alpha(opacity=100);-moz-opacity:.100;opacity:.100;     
}

footer {
  position: relative;
  display: block;
  width: 100%;
  text-align: center;
  margin: 0px auto;  
  background-color: #0a0d1b; background:url(../pictures/bg_prihovor_pattern.webp);  background-repeat: repeat;
  clear: both;
  padding: 0px;
}

h1                        { color: #fff; font-weight: normal; font-size: 34px; padding: 0px; }
h2                        { font-size: 34px; color: #fff; font-weight: normal; }
h3                        { font-size: 34px; color: #fff; font-weight: normal; }
h4                        { font-size: 30px; color: #fff; font-weight: normal; }
p                         { font-size: 14pt; color: #a4a9b9; }
span                      { font-size: 14pt; color: #a4a9b9; }
li                        { font-size: 14pt; color: #a4a9b9; }


p.nadpis                  { font-size: 28px; color: #0067ac; font-weight: normal; }
a.novinky2                { font-size: 16pt; color: #0067ac; text-decoration: none; } 
a.novinky2:hover          { font-size: 16pt; color: #0067ac; text-decoration: none; } 
a.novinky                 { font-size: 14pt; color: #656565; text-decoration: none; text-align: justify; } 
a.novinky:hover           { font-size: 14pt; color: #0067ac; text-decoration: none; text-align: justify;  } 
a.white                   { font-size: 18px; color: #fff; text-decoration: none; }
a.white:hover             { font-size: 18px; color: #fff; text-decoration: underline; }
a.whitebig                { font-size: 24px; color: #fff; padding-top: 5px; text-decoration: none; }
a.whitebig:hover          { font-size: 24px; color: #fff; padding-top: 5px;  text-decoration: underline; }
a.nadpis                  { font-size: 18px; color: #0067ac; text-decoration: none; } 
a.nadpis:hover            { font-size: 18px; color: #0067ac; text-decoration: underline; } 
p.oznam                   { font-size: 17px; color: #0067ac; } 
input.text                { font-size: 15px; color: #0067ac; text-align: center; border: 1px solid #0067ac; background-color: #ffffff; height:40px; min-width: 200px; cursor: pointer; } 
input.text_hover          { font-size: 15px; color: #0067ac; text-align: center; border: 1px solid #0067ac; background-color: #fbf5f7; height:40px; min-width: 200px; cursor: pointer; } 


/************************************************************************************
MEDIA QUERIES
*************************************************************************************/
/* for 1050px or less */
@media screen and (max-width: 1050px) {

.section {  
  margin-top: 0px;
  padding-left: 20px;
  padding-right: 20px;
}

}

/* for 650px or less */
@media screen and (max-width: 650px) {
  
a.kdesom {
  display: none;
}

.prihovor_img{
  width: 100%;
  min-width: 150px;
  max-width: none;
}

.inner {
  padding-bottom: 20px;
}

.icon_footer  { 
  margin-bottom: 0px;
  margin-top: 20px;
  padding: 0px;
}

.section {
  min-width: 300px;
  width: 100%;
}

.cube { padding-bottom: 20px; padding-top: 0px; }

}

/* for 480px or less */
@media screen and (max-width: 480px) {  

a.kdesom {
  display: none;
}


.section {
  margin: 0px;

}

  #minilogo {
     display: inline-block;
     vertical-align:middle;
     width: 100%;
     max-width: 45px;
     margin-left: 18px;
     padding-right: 10px;
  }  

div.icon { min-width: 300px; padding: 0px; margin: 0 auto; }
img.icon { width: 170px; padding: 0px; margin: 0px; }

}

#text {
  margin-bottom: 0px;
}

p.textwhite               { color: #ffffff; }
p.nadpiswhite             { font-size: 15px; color: #ffffff; }
p.copyright               { font-size: 15px; color: #ffffff; }

select {
height: 36px;
padding:0px;
border-radius: 6px; 
-moz-border-radius: 6px; 
-webkit-border-radius: 6px; 
border: 1px solid #03325E;

   margin: 0;
    background: #e5eaee;
    color:#03325e;
        outline:none;
    display: inline-block;

}


td.tip                    { height: 22px; background-color:#ffcc33;}
td.gray                   { height: 22px; background-color:#dddddd;}
a.oznam                   { font-size: 15px; color: #21252a; }
a.oznam:hover             { font-size: 15px; color: #03325e; }
a.selected                { font-size: 15px; color: #ed1c24; font-weight: bold; }
a.selected:hover          { text-decoration: underline; font-size: 15px; color: #03325e; }
a.notselected             { text-decoration: none; font-size: 15px; color: #03325e; }
a.notselected:hover       { text-decoration: underline; font-size: 15px; color: #03325e; }
table.aktivny             { cursor: pointer; }
a.aktivny                 { color: #21252a; font-size: 15px; text-decoration: none; }
a.aktivny:hover           { color: #656565; font-size: 15px; text-decoration: none; }
p.text                    { font-size: 15px; color: #656565; }
textarea                  { font-size: 15px; color: #000000; }
img.hlavna                { border-color:#21252a;  border-style:dashed;  border-width:5px; }
p.zlta15                  { font-size: 15px; color: #03325e; }
p.modra15                 { font-size: 15px; color: #03325e; }
a.modra                   { font-size: 18px; }