html {
    background-color: rgb(194, 193, 193);
    background-image: url(./hegy_hatter.jpg);
    background-attachment: fixed;
    background-size: 100%;
}

body {
    width: 80%;
    margin: 60px auto 30px auto;
    background-color: white;
    padding-top: 10px;
    padding-bottom: 40px;
    padding-bottom: 5px;
    border-radius: 40px;
    color: rgb(80, 80, 80);
    font-size: 120%;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    box-shadow: 5px  5px 20px rgb(58, 58, 58), -5px -5px 20px rgb(58, 58, 58);
}

div {
    text-align: justify;
    padding: 40px;
}

div.kedvencek {
    margin-top: 20px;
    background-color: #224a5a;
    color: lightgray;
}

div.vers {
    text-align: center;
    background-color: lightgray;
}

div.zene {
    text-align: center;
    background-color: #224a5a;
    color: lightgray;
}

figure.arckep {
    max-width: 25%;
    float: right;
    padding: 40px;
    margin-left: 40px;
    background-color: rgb(196, 119, 19);
    border-radius: 25px;
    color: white;
    box-shadow: 1px  1px 15px #122a35, -1px -1px 15px #122a35;
}

figure.mese_kep {
    max-width: 45%;
    float: right;
    margin-left: 40px;
    padding: 40px;
    background-color: rgb(134, 59, 24);
    border-radius: 30px;
    box-shadow: 2px  2px 15px rgb(155, 154, 154), -2px -2px 15px rgb(155, 154, 154);
    color: white;
}

img.arckep {
    max-width: 100%;
    border: rgb(161, 98, 15) solid 2px;
}

img.mese_kep {
    max-width: 100%;
    border: rgb(163, 69, 25) solid 2px;
}

h1 {
    text-align: center;
    color: black;
    margin-bottom: 35px;
}

h2 {
    color: black;
}

h2.kedvenc {
    color: white;
}

h3 {
    color: black;
}

h3.zene {
    color: white;
}

hr {
    margin: 0;
    margin-left: 30px;
    margin-right: 30px;
}

ul {
    list-style-image: url(./carabiner_icon2.png);
}

li {
    line-height: 40px;
    margin-left: 20px;
}

p.vissza {
    text-align: center;
}

a {
    color: #628b77;
    text-decoration: none;
}

a:hover {
    color: #395548;
}

a.menu {
    color: rgb(70, 70, 70);
    text-decoration: none;
}

a.menu:hover {
    color: rgb(25, 25, 25);
}

a.mese_link {
    color: rgb(174, 200, 223);
}

a.mese_link:hover {
    color: rgb(132, 160, 185);
}

@media screen and (max-width:1036px) {
    a.menu {
        color: rgb(70, 70, 70);
        text-decoration: none;
        font-size: 80%;
    }
}

table.menu {
    margin-left: auto;
    margin-right: auto;
    padding-left: 30px;
    padding-right: 30px;
    border-spacing: 0;
}

table.zene {
    margin-left: auto;
    margin-right: auto;
    border-collapse: collapse;
}

tr.zene:nth-child(odd) {
    background-color: #336174;
    padding-left: 40px;
    padding-right: 40px;
}

th {
    background-color: #122a35;
    padding: 10px;
    padding-left: 30px;
    padding-right: 30px;
}

td.menu {
    padding: 20px;
}

td.zene {
    margin: auto;
    padding: 10px;
    padding-left: 30px;
    padding-right: 30px;
}

td.menu:hover {
    background-color: whitesmoke;
}
