.table-resp {
  border-collapse: collapse;

  margin-left: 35%;
  font-size: 20px;
  caption {
    text-align: left;
    width: 95vw;  
     caption-side: top-outside;
    
  }
}
/* td{
    margin-left: 60px;
    padding-left:40px ;
    font-size: 21px;
    text-align: left;} */
    td{
        padding-left: 15px; 
        font-size: 21px;
        text-align: left;
        
    
    }
    .meno{
    position: absolute;
    margin-left: 15px;
    }
   .funkcia{
   
   text-align: left;
   padding-left: 15px;
   
   }
    
    th
    {
    margin-left: 50px;
    
    
    
    }
    thead tr th{
      padding: 0;
      margin: 0;
      text-align: center;
    
    
    }
    
    @media (max-width: 560px){
    .table-resp{
      margin-left: 15%
    
    }
    
    }

@media (min-width: 768px) {
   sm, md, lg
  .table-resp {
    margin-top: 3em;
    position: relative;   position: absolute context
    caption {
      position: absolute; width: 95vw above
      top: -2em;
      margin-bottom: 0.75em;
    }
    thead {
      text-align: left;
      background-color: #333;
      color: white;
    }
    tbody {
      tr {
        &:nth-child(odd) {
           background-color: hsl(0, 0%, 94%);
        }
        &:nth-child(even) {
           background-color: hsl(0, 0%, 88%);
        }
      }
    }
    td,
    th {
      padding: 0.25em 1.5em;
      &:nth-child(2) {
        border-left: 3px solid #fff;
      }
    }
  }
}

@media (max-width: 767px) /* xs */ {
  thead {
    display: none;
  }
  .table-resp {
    display: block;
    margin-top: 1em;
  }
  td {
    display: block;
  }
  td:first-child {
    font-weight: 700;
    margin-top: 0.75em;
    margin-bottom: 0;
  }
  td:nth-child(2) {
    margin-top: 0;
  }
}

/* Uninteresting stuff below here */

html {
  font: 18px "Iowan Old Style", serif;
}