

body {font-family: 'Open Sans', sans-serif; background: #fff;}
@media all and (max-width : 960px) {
    #background, #map {height: 300px; width: 100%;}
    section {background: #fff; padding: 30px; }
    #content {display: none;}
    #content-mobile {display: block;}
    [class^="col"] {padding: 0 .5%; margin: 0 1%; display: block;}
    .col2, .col3, .col4, .col5, .col6, .col9, .col12 {width: 97%; }
    footer { background: #727272; padding: 0 50px; color: #fff;}
    header {background: #fff; text-align: center;}
    header ul {margin: 15px 0;}
    #gallery {position: relative;}
    #certyfikat {padding: 10px; text-align: center; }
    #certyfikat > div {display: inline-block;}
    footer form {text-align: center; padding: 30px 0 10px;}
    footer form label {margin-right: 10px; line-height: 36px;}
    footer form input {padding: 3px; border: none; display: inline-block; height: 30px;}
    footer form button {background: #555; padding:3px 10px ; color: #fff; border: none; display: inline-block; height: 30px;}
    #flashMessage {background: #599642;width: 100%;text-align: center;color: #fff;font-size: 20px; padding: 10px 0;}
    #flashMessage.error {background: #900;}
} 
@media all and (min-width : 961px) {
    #background, #map {position: fixed; top: 0; right: 0; bottom: 0; left: 0;}
    html, body, #background, #map, #gallery, .slides, .slides > li {height: 100%; overflow: hidden; z-index: 0;}
    .slides > li {background-size: 100%; background-position: center; background-repeat: no-repeat;}
    header, footer {position: fixed; left: 0; right: 0; z-index: 10;}
    section {outline: 0;background: #fff; background: rgba(255,255,255,.8); position: fixed; top: 270px; right: 5%; bottom: 60px; left: 60%; overflow: auto; padding: 30px;}
    #content {display: block;}
    #content-mobile {display: none;}
    [class^="col"] {padding: 0 .5%; margin: 0 1%; display: block; float: left;}
    .col2 {width: 13.66%; }
    .col3 {width: 22%; }
    .col4 {width: 30.32%; }
    .col5 {width: 38.66%; }
    .col6 {width: 47%; }
    .col9 {width: 72%; }
    .col12 {width: 96%; }
    footer {bottom: 0; background: #727272; height: 60px; padding: 0 50px; color: #fff;}
    header {top: 0; background: #fff; background: rgba(255,255,255,.6);  text-align: center;}
    header ul {margin: 30px 0;}

    body.gallery header {background: rgba(255,255,255,0); -webkit-transition: all .3s ease;transition: all .3s ease;}
    body.gallery header:hover {background: rgba(255,255,255,.6);}
    body.gallery header ul {opacity: 0; -webkit-transition: all .3s ease;transition: all .3s ease;}
    body.gallery header:hover ul {opacity: 1;}
    body.gallery header .logo {background: rgba(255,255,255,.6); display: block;}
    body.gallery header:hover .logo {background: rgba(255,255,255,0)}

    body.gallery footer {opacity: 0; -webkit-transition: opacity .3s ease;transition: opacity .3s ease;}
    body.gallery footer:hover {opacity: 1;}
    #gallery img {display: none;}

    #certyfikat {position: fixed; bottom: 10%; left: 0; padding: 10px; background: rgba(255,255,255,.7); z-index: 10;}
    
    footer form {padding: 3px 0 10px;}
    footer form label {margin-right: 10px; font-size: 14px; display: block;}
    footer form input {padding: 3px; border: none; display: inline-block; height: 30px;width: 150px;}
    footer form button {background: #555; padding:3px 10px ; color: #fff; border: none; display: inline-block; height: 30px;}
    
    #flashMessage {z-index: 50;position: fixed;background: #599642;width: 100%;text-align: center;color: #fff;font-size: 20px;top: 110px; padding: 10px 0;}
    #flashMessage.error {background: #900;}
}

h1 {font-weight: 300; font-size: 30px; margin-bottom: 20px;}
h2 {font-weight: 300; font-size: 24px; margin: 20px 0 10px;}
p, ul, table {font-size: 14px; line-height: 21px;}
p + p {margin: 15px 0;}

section a {text-decoration: none; color: #d8b95f;-webkit-transition: all .3s ease;transition: all .3s ease; }
section a:hover {background: #d8b95f; color: #fff;}


#content ul {list-style-type: circle; margin: 10px 0 15px 30px;}
.node-info {margin: -10px 0 10px; font-size: .8em; color: #777;}
#background {background: url(../img/bg/01.jpg) no-repeat center; background-size: cover; }

header > a {padding: 20px 10px 10px; display: inline-block;-webkit-transition: all .3s ease;transition: all .3s ease;}
header ul li {display: inline-block; text-transform: uppercase;}
header ul li a {text-decoration: none; color: #2a2a29; padding: 10px 15px 5px; display: block; position: relative; }
header ul li a.promo {font-weight: bold; }
header ul li a:after {content: ''; position: absolute; display: block; margin: 0 auto; height: 2px; background: #d8b95f; bottom: 0;left: 50%;right: 50%; -webkit-transition: all .3s ease; transition: all .3s ease;}
header ul li a:hover:after, header ul li a.selected:after {left: 25px;right: 25px;}

section {z-index: 2;}
section ul {list-style-type: circle; margin: 10px 0 10px 40px;}

footer .contact {text-align: right;}
footer .contact p{line-height: 16px; padding-top: 10px;}
footer .contact p.air{line-height: 14px; font-size: 11px; color: #aaa; padding-top: 0;}
footer .contact p.air a{color: #aaa;}

footer > a {padding-top: 20px; display: inline-block;}
footer a {text-decoration: none;}
footer a:hover {color: #d8b95f;}
footer ul {margin: 10px 0; font-size: 12px;}
footer ul li {display: inline-block; text-transform: uppercase;}
footer ul li a { color: #fff; padding: 10px 20px 5px; display: block; position: relative; }

table tr td {padding: 3px 0;}

/*.pol .show-pl, .eng .show-en {display: block}*/
.pol .show-en, .eng .show-pl {display: none;}


section form label {display: block;}
section form input {display: inline-block; padding: 5px; border: 1px solid #bbb;}
section form button {background: #555; padding:3px 10px ; color: #fff; border: none; display: inline-block; height: 30px;}


.reservation label {margin-top: 10px;}
.reservation input, .reservation textarea {width: 100%;}
.reservation button {padding: 10px 50px; font-size: 20px; margin: 0 auto; height: auto;display: block;}