.lato-light {
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.lato-regular {
  font-family: "Lato", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.lato-bold {
  font-family: "Lato", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.lato-black {
  font-family: "Lato", sans-serif;
  font-weight: 900;
  font-style: normal;
}

body {
font-family: "Lato", sans-serif; }

header {
text-shadow: 0 0 3px #000;
color: white;
background-image: url('../img/bg0.jpg');
background-repeat: no-repeat;
background-position: 50% 0%;
background-size: cover; }

#kostax {
max-width: 100%;
height: auto; }

#eset {
max-width: 35%;
height: auto; }

#paragraph {
font-size: 1.2em; }

.info img {
height: 2em;
width: auto; }

#main {
color: black;
background-image: url('../img/bg1.png');
background-repeat: no-repeat;
background-position: 50% 0%;
background-size: cover; }

.timetable {
color: #08223e; }

.timetable p {
color: #7e7e7e;
font-size: 0.8em; }

.time {
border-right: 5px solid #e5eaf2; }

#form {
color: black;
background-image: url('../img/bg2.png');
background-repeat: no-repeat;
background-position: 50% 0%;
background-size: cover; }

footer {
color: white;
background-image: url('../img/bg3.png');
background-repeat: no-repeat;
background-position: 50% 0%;
background-size: cover; }

footer .col {
font-size: 1.2em; }

footer a {
color: white; }

.button {
font-size: 0.9em;
padding-top: 15px;
padding-bottom: 15px;
color: white;
background-color: #315a9c; }

.button:hover {
color: white;
background-color: #214a8c; }

label {
font-size: 1.2em; }

form input {
margin: 0 auto;
max-width: 80%; }

.map {
text-decoration: none;
color: white;
border-bottom: 1px dotted white; }

footer img {
max-width: 200px;
height: auto; }

@media only screen and (min-width: 768px) {
    #kostax {
        max-width: 60%
    }

    #eset {
        max-width: 18%;
    }

    #main {
        margin-top: -100px;
    }
}

@media only screen and (min-width: 992px) {
    #main {
        margin-top: -180px;
    }
}