@font-face
{
    font-family: 'Lato Hairline';
    font-weight: 300;
    font-style: normal;

    src: url('./fonts/Lato-Hairline.eot');
    src: local('Lato-Hairline'),
    url('./fonts/Lato-Hairline.eot?#iefix') format('embedded-opentype'),
    url('./fonts/Lato-Hairline.woff2') format('woff2'),
    url('./fonts/Lato-Hairline.woff') format('woff'),
    url('./fonts/Lato-Hairline.ttf') format('truetype'),
    url('./fonts/Lato-Hairline.svg#Lato-Hairline') format('svg');
}

@font-face
{
    font-family: 'Lato';
    font-weight: 300;
    font-style: normal;

    src: url('./fonts/Lato-Light.eot');
    src: local('Lato-Light'),
    url('./fonts/Lato-Light.eot?#iefix') format('embedded-opentype'),
    url('./fonts/Lato-Light.woff2') format('woff2'),
    url('./fonts/Lato-Light.woff') format('woff'),
    url('./fonts/Lato-Light.ttf') format('truetype'),
    url('./fonts/Lato-Light.svg#Lato-Light') format('svg');
}

@font-face
{
    font-family: 'Lato';
    font-weight: 900;
    font-style: normal;

    src: url('./fonts/Lato-Black.eot');
    src: local('Lato Black'), local('Lato-Black'),
    url('./fonts/Lato-Black.eot?#iefix') format('embedded-opentype'),
    url('./fonts/Lato-Black.woff2') format('woff2'),
    url('./fonts/Lato-Black.woff') format('woff'),
    url('./fonts/Lato-Black.ttf') format('truetype'),
    url('./fonts/Lato-Black.svg#Lato-Black') format('svg');
}

@font-face
{
    font-family: 'Lato';
    font-weight: bold;
    font-style: normal;

    src: url('./fonts/Lato-Bold.eot');
    src: local('Lato Bold'), local('Lato-Bold'),
    url('./fonts/Lato-Bold.eot?#iefix') format('embedded-opentype'),
    url('./fonts/Lato-Bold.woff2') format('woff2'),
    url('./fonts/Lato-Bold.woff') format('woff'),
    url('./fonts/Lato-Bold.ttf') format('truetype'),
    url('./fonts/Lato-Bold.svg#Lato-Bold') format('svg');
}

@font-face
{
    font-family: 'Lato';
    font-weight: normal;
    font-style: italic;

    src: url('./fonts/Lato-Italic.eot');
    src: local('Lato Italic'), local('Lato-Italic'),
    url('./fonts/Lato-Italic.eot?#iefix') format('embedded-opentype'),
    url('./fonts/Lato-Italic.woff2') format('woff2'),
    url('./fonts/Lato-Italic.woff') format('woff'),
    url('./fonts/Lato-Italic.ttf') format('truetype'),
    url('./fonts/Lato-Italic.svg#Lato-Italic') format('svg');
}

@font-face
{
    font-family: 'Lato';
    font-weight: 900;
    font-style: italic;

    src: url('./fonts/Lato-BlackItalic.eot');
    src: local('Lato Black Italic'), local('Lato-BlackItalic'),
    url('./fonts/Lato-BlackItalic.eot?#iefix') format('embedded-opentype'),
    url('./fonts/Lato-BlackItalic.woff2') format('woff2'),
    url('./fonts/Lato-BlackItalic.woff') format('woff'),
    url('./fonts/Lato-BlackItalic.ttf') format('truetype'),
    url('./fonts/Lato-BlackItalic.svg#Lato-BlackItalic') format('svg');
}

@font-face
{
    font-family: 'Lato Hairline';
    font-weight: 300;
    font-style: italic;

    src: url('./fonts/Lato-HairlineItalic.eot');
    src: local('Lato-HairlineItalic'),
    url('./fonts/Lato-HairlineItalic.eot?#iefix') format('embedded-opentype'),
    url('./fonts/Lato-HairlineItalic.woff2') format('woff2'),
    url('./fonts/Lato-HairlineItalic.woff') format('woff'),
    url('./fonts/Lato-HairlineItalic.ttf') format('truetype'),
    url('./fonts/Lato-HairlineItalic.svg#Lato-HairlineItalic') format('svg');
}

@font-face
{
    font-family: 'Lato';
    font-weight: 300;
    font-style: italic;

    src: url('./fonts/Lato-LightItalic.eot');
    src: local('Lato-LightItalic'),
    url('./fonts/Lato-LightItalic.eot?#iefix') format('embedded-opentype'),
    url('./fonts/Lato-LightItalic.woff2') format('woff2'),
    url('./fonts/Lato-LightItalic.woff') format('woff'),
    url('./fonts/Lato-LightItalic.ttf') format('truetype'),
    url('./fonts/Lato-LightItalic.svg#Lato-LightItalic') format('svg');
}

@font-face
{
    font-family: 'Lato';
    font-weight: bold;
    font-style: italic;

    src: url('./fonts/Lato-BoldItalic.eot');
    src: local('Lato Bold Italic'), local('Lato-BoldItalic'),
    url('./fonts/Lato-BoldItalic.eot?#iefix') format('embedded-opentype'),
    url('./fonts/Lato-BoldItalic.woff2') format('woff2'),
    url('./fonts/Lato-BoldItalic.woff') format('woff'),
    url('./fonts/Lato-BoldItalic.ttf') format('truetype'),
    url('./fonts/Lato-BoldItalic.svg#Lato-BoldItalic') format('svg');
}

@font-face
{
    font-family: 'Lato';
    font-weight: normal;
    font-style: normal;

    src: url('./fonts/Lato-Regular.eot');
    src: local('Lato Regular'), local('Lato-Regular'),
    url('./fonts/Lato-Regular.eot?#iefix') format('embedded-opentype'),
    url('./fonts/Lato-Regular.woff2') format('woff2'),
    url('./fonts/Lato-Regular.woff') format('woff'),
    url('./fonts/Lato-Regular.ttf') format('truetype'),
    url('./fonts/Lato-Regular.svg#Lato-Regular') format('svg');
}

body
{
    font-family: 'Lato', sans-serif;
    font-size: 14px;

    background: #840010;
}

/* main container */

.container
{
    display: -ms-grid;
    display:     grid;

    max-width: 1100px;
    margin: 0 auto;

    -ms-grid-columns: 223px 847px 30px;
    grid-template-columns: 223px 847px 30px;
    -ms-grid-rows: 100px 1fr;
    grid-template-rows: 100px 1fr;
    grid-template-areas: 'sidebar-1 menu sidebar-2'
    'sidebar-1 content .'
    '. footer .';
}

/* aside left menu */

.left-menu
{
    -ms-grid-row: 1;
    -ms-grid-row-span: 2;
    -ms-grid-column: 1;
    grid-area: sidebar-1;
}

.logo
{
    height: 211px;
}

.left-nav
{
    background: black;
}

.left-nav li
{
    padding: 5px 0 10px 20px;

    border-bottom: 1px solid grey;
}

.left-nav li:hover
{
    background: #f8f8f8;
}

.left-nav li:hover a
{
    color: black;
}

.left-nav span
{
    font-size: 20px;
    font-weight: 700;

    margin-right: 10px;
}

.left-nav a
{
    text-decoration: none;
    color: white;
}

.contact
{
    display: -ms-grid;
    display:     grid;

    height: 60px;

    background: #f8f8f8;

    -ms-grid-columns: 1fr 2fr;
    grid-template-columns: 1fr 2fr;
}

.contact h3
{
    font-size: 1.8em;
    font-style: italic;

    margin: 0;
    padding: 14px 0 0 24px;
}

.phone-img
{
    overflow: hidden;

    padding: 13px;

    text-align: center;

    border-right: 1px solid #d1d1d1;
}

.address
{
    padding: 15px 0 15px 40px;

    color: white;
    background: black;
}
.address p
{
    margin-bottom: 5px;
}
.address a
{
    text-decoration: none;

    color: white;
}
.address a:hover
{
    color: #840010;
}

.form-link
{
    padding: 30px 0 30px 19px;
    text-transform: uppercase;

    background: #f8f8f8;
}

.form-link--en {
    position: relative;
    left: 35px;
}

.form-link--de {
    position: relative;
    left: 20px;
}

.form-link a
{
    text-decoration: none;

    color: black;
}

.form-link a:hover
{
    color: #840010;
}

.shape
{
    width: 0;
    height: 0;

    border-top: 20px solid #f8f8f8;
    border-left: 223px solid transparent;
}

/* header main navigation */

.menu
{
    height: 100px;

    background: black;

    -ms-grid-row: 1;
    -ms-grid-column: 2;
    grid-area: menu;
}

.menu ul
{
    padding: 40px;

    text-align: center;
}

.menu li
{
    display: inline-block;

    padding: 0 20px;

    text-align: center;
}

.menu li:hover a
{
    color: #840010;
}

.menu a
{
    text-decoration: none;
    text-transform: uppercase;

    color: white;
}

/* slider classes */

.mySlides
{
    display: none;

    width: 100%;
    height: 100%;
}

.visible
{
    display: block;
}


/* content */

.content
{
    margin-top: 16px;
    margin-left: 16px;

    -ms-grid-row: 2;
    -ms-grid-column: 2;
    grid-area: content;
}

.content-wrapper
{
    display: -ms-grid;
    display:     grid;

    min-height: 500px;
    padding-right: 20px;
    padding-bottom: 15px;

    background: white;

    -ms-grid-columns: 1fr 297px;
    grid-template-columns: 1fr 297px;
}

.content-wrapper--form
{
    -ms-grid-columns: 270px 1fr;
    grid-template-columns: 270px 1fr;
}

.main-content
{
    padding: 25px;
}

.main-content h3
{
    margin: 18px 0;

    color: #c30c0c;
}

.main-content p
{
    margin-bottom: 5px;
}

.main-content p.about-first-p
{
    color: #c30c0c;
}

/* Nagłówek dla strony głównej */
.main-content h2
{
    font-weight: 600;

    margin-bottom: 35px;

    text-align: center;
}
/* Nagłówek dla podstrony */
.pages h2
{
    font-size: 1.2em;
    font-weight: 400;

    margin-bottom: 12px;
    padding-bottom: 5px;

    text-align: left;

    color: #861b0c;
    border-bottom: 1px solid #861b0c;
}

.pages
{
    text-align: justify;
}

.pages span
{
    color: #ff1f1f;
}

.pages a
{
    text-decoration: none;

    color: black;
}

.pages a:hover
{
    color: #c30c0c;
}


.map
{
    padding: 25px;
}

/* mapa google */

#map
{
    width: 100%;
    height: 416px;
}


{
    width: 100%;
    height: 200px;
}

/* contact form */

.contact-form
{
    padding: 25px;

    text-align: left;

    grid-column: span 2;
}

.form
{
    display: -ms-grid;
    display:     grid;

    -ms-grid-columns: 1fr 2fr;
    grid-template-columns: 1fr 2fr;
}

.form-col input
{
    width: 200px;
    margin: 7px 0;
    padding: 6px 5px;

    resize: none;

    color: #222;
    border: solid 1px;
    border-color: #e6e6e6;
    border-radius: 2px;
    -webkit-box-shadow: 1px 1px 1px #ccc;
            box-shadow: 1px 1px 1px #ccc;
}

.form-col textarea
{
    width: 480px;
    height: 150px;
    margin: 7px 0;
    padding: 6px 5px;

    resize: none;

    color: #222;
    border: solid 1px;
    border-color: #e6e6e6;
    border-radius: 2px;
    -webkit-box-shadow: 1px 1px 1px #ccc;
            box-shadow: 1px 1px 1px #ccc;
}

.button--form
{
    margin-top: 20px;
}

.services
{
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
}

.images
{
    display: -ms-grid;
    display:     grid;

    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: 210px;
    grid-template-rows: 210px;
}

.btn-wrapper
{
    text-align: center;

    grid-column: 2 span;
}

.button
{
    width: 80px;
    height: 25px;

    color: white;
    border: none;
    background: black;
}

/* language sidebar */

.language
{
    padding: 9px 4px;

    background: black;

    -ms-grid-row: 1;
    -ms-grid-column: 3;
    grid-area: sidebar-2;
}

/* Footer */

.footer
{
    height: 75px;
    margin-bottom: 20px;
    margin-left: 16px;
    padding-top: 2px;

    border-top: 20px solid black;
    background: #f8f8f8;

    -ms-grid-row: 3;
    -ms-grid-column: 2;
    grid-area: footer;
}

.footer p
{
    padding: 5px 20px;

    color: #777;
}
