@font-face {
  /*  font-family: 'Existence Light';
    src: url('Existence-Light.otf');

       font-family: 'Calibri';*/
  }

a, a:visited {
color:black;
}

a:hover {
color:#fba637;
}

  .hneda{
    background-color: #fee381;
    /*background-color: #317eb4;*/
    color:black;
  }

  .bezova{
    /*background-color: #f5f5dd;*/
    background-color: #f5f0ea;
    color: black;
  }
   

html,body{
    margin: 0px;
    padding: 0px;
    font-family: 'Calibri';
}

h1,h2{text-align: center;}


@media only screen and (min-width: 1024px) {
body{
    font-size: 1.3em;
}

    .art {
        width: 80%;
        margin: auto;
        overflow: hidden;
    }

    .w50 {
        width: 50%;
        float: left;
    }

    .w20 {
        width: 20%;
        float: left;
    }

    .w80 {
        width: 80%;
        float: left;
    }

    .w100 {
        width: 100%;
    }

    .cistyText{
        word-spacing: 0.5em;
        line-height: 1.6em;
    }
}


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

body{ font-weight: bold; }

    .cistyText{
        word-spacing: 0.5em;
        line-height: 1.6em;
    }

    .art {
        width: 90%;
        margin: auto;
        padding-bottom: 2em;
        overflow: hidden;
    }

    .w50,
    .w20,
    .w80 {
        width: 100%;
    }

    .topnav a {
       width: calc(25% - 32px);
    }
}

.topnav {
    width: 100%;
    overflow: hidden;
}

.topnav p {
    float: left;
    color: #f5f5dd;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    float: left;
    margin: 0px;
    
}

.topnav a {
    float: left;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-weight: bold;
    color:#f8855e;
}

.topnav a:hover {
    float: left;
    background-color: #f8b39c;
    color: black;
    transition: ease-in 0.2s;
}

.topnav img {
    float: left;
    color: #f2f2f2;
  /*  height: 45px;
    padding: 4px 5px 0px 5px;*/
}

.cssImgDoTextu {
  display: block;
  margin: auto;
  width: 80%;
}