/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    line-height: 34px;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}

body {
    line-height: 34px;
}

ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* site */

@font-face {
    font-family: 'LetterGothicStd-Bold';
    src: url('/fonts/lettergothicstdbold.eot');
    src: url('/fonts/lettergothicstdbold.eot?#iefix') format('embedded-opentype'),
    url('/fonts/lettergothicstdbold.woff') format('woff'),
    url('/fonts/lettergothicstdbold.ttf') format('truetype'),
    url('/fonts/lettergothicstdbold.svg#lettergothicstdbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

body, textarea, input {
    font-family: "Roboto", Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
}

body, #box {
    background: #1f1f1f;
    color: #B8B8B8;
}

body.home {
}

body.home #box { /*padding: 14px; position: relative; top: -14px; !*left: -14px; *!border: 0;*/
}

body.about {
}

body.about #box {
}

body.news {
}

body.news #box {
    overflow: auto;
}

body.prints {
}

body.prints #box {
}

body.prints .pages {
    margin-top: 50px;
}

body.prints .pages p {
    font-weight: 100;
    padding-bottom: 0;
}

body.contact {
}

body.contact #box {
}

body.contact .pages p {
    margin-top: 20px;
    margin-bottom: 0;
}

body.contact .contact-label {
    font-size: 16px;
    font-weight: 100;
    line-height: 34px !important;
}

.bar1, .bar2, .bar3 {
    width: 35px;
    height: 5px;
    background-color: #fff;
    margin: 6px 0;
    transition: 0.4s;
}

.change .bar1 {
    -webkit-transform: rotate(-45deg) translate(-9px, 6px);
    transform: rotate(-45deg) translate(-9px, 6px);
}

.change .bar2 {
    opacity: 0;
}

.change .bar3 {
    -webkit-transform: rotate(45deg) translate(-8px, -8px);
    transform: rotate(45deg) translate(-8px, -8px);
}

.header-content .ham {
    display: none;
}

.ham-menu {
    display: none;
    visibility: hidden;
}

.mobile-menu-home {
    display: none;
    visibility: hidden;
}

.mobile-menu {
    display: none;
    visibility: hidden;
}

.about .about-color {
    color: #FFFFFF !important;
}

.home .home-color {
    color: #FFFFFF !important;
}

.gallery .gallery-color {
    color: #FFFFFF !important;
}

.news .news-color {
    color: #FFFFFF !important;
}

.prints .prints-color {
    color: #FFFFFF !important;
}

.contact .contact-color {
    color: #FFFFFF !important;
}


@media only screen and (max-width: 1200px) {
    /*   .ham-menu {
           position: fixed;
           width: 100%;
           height: 100%;
           background: black;
           z-index: 1000;
           text-align: center;
       }

       .ham-menu a {
           display: block;
           font-weight: 100;
           font-size: 22px;
           color: #888888;
           margin: auto;
           width: 100%;
           padding: 30px;
       }

       .ham-menu a:hover {
           color: #ffffff;
           text-decoration: none;
       }

       .header-content a {
           display: none;
       }

       .header-content .ham {
           display: block;
           cursor: pointer;
           float: right;
           padding: 10px 20px;
       }*/
    .header-content a {
        display: none;
    }

    .header-content img {
        display: block;
        margin: auto !important;
    }

    .home .mobile-menu {
        display: none;
        visibility: hidden;
    }

    .mobile-menu-home {
        display: block;
        visibility: visible;
        padding-top: 90px;
        margin: auto !important;
    }

    .mobile-menu-home a {
        font-size: 32px;
        padding: 10px;
        margin: auto;
        color: #888888;
    }

    .mobile-menu-home a:hover {
        color: #ffffff;
        text-decoration: none;
    }

    .mobile-menu {
        display: block;
        visibility: visible;
        padding-top: 66px;
        margin: auto !important;
    }

    .mobile-menu a {
        font-size: 32px;
        padding: 10px;
        margin: auto;
        color: #888888;
    }

    .mobile-menu a:hover {
        color: #ffffff;
        text-decoration: none;
    }

    .menu-list {
        text-align: center;
    }

    .contact p {
        font-size: 24px !important;
    }

    .contact input {
        height: 70px !important;
        font-size: 24px;
    }

    .category a.category_title {
        font-size: 24px !important;
    }

    #header {
        height: 100px !important;
    }

    #header img {
        height: 90px;
        max-width: 100%;
    }
}

a {
    color: #6983A9;
    text-decoration: none;
    outline: none;
}

a:hover {
    text-decoration: underline;
}

h1 {
    padding-bottom: 15px;
}

h1.category_name {
    font-size: 32px;
    font-weight: 100;
    color: #ffffff;
    text-transform: uppercase;
    padding-bottom: 43px;
}

h1 a {
    color: #888888;
}

h1 a:hover {
    color: #ffffff;
    text-decoration: none;
}

h1.page_title {
    font-size: 32px;
    font-weight: 100;
    color: #ffffff;
    font-family: "Roboto", Verdana, Arial, Helvetica, sans-serif;
}

.clear {
    clear: both;
    font-size: 0;
    line-height: 0;
}

.error, .msg {
    font-size: 13px;
    padding-bottom: 20px;
}

.error {
    color: #b00000;
}

.msg {
    color: #4AD000;
}

#container {
    max-width: 1500px;
    margin: auto;
}

#header {
    height: 64px;
    background-color: #000000;
    font-size: 22px;
}

.header-content {
    font-weight: 100;
    max-width: 1740px;
    margin: 0 auto;
}

.header-content img {
    padding: 3px;
    margin-left: 3%;
}

#header a {
    float: right;
    padding: 21px 21px;
    text-decoration: none;
    color: #888888
}

#header a:hover {
    color: #ffffff;
}

#header a.home {
}

#header a.gallery {
}

#header a.about {
}

#header a.news {
}

#header a.prints {
}

#header a.contact {
}

#main {
    padding-top: 56px;
}

#box {
    min-height: 490px; /*padding: 47px 20px 0 50px;*/
}

#footer {
    color: #888888;
    font-size: 12px;
    padding: 60px 0;
    text-align: center;
}

.category {
    display: inline-block;
    width: 332px;
    padding: 76px 40px 0 0;
    text-align: initial;
}

.category_list {
    margin: auto;
    text-align: center;
}

.category_list img {
    width: 332px;
    height: 332px;
    padding-top: 28px;
}

.category a {
    width: 332px;
    padding-bottom: 14px;
}

.category a.category_title {
    color: #888888;
    font-size: 16px;
    font-weight: 100;
    text-transform: uppercase;
    text-decoration: none;
}

.category a.category_title:hover {
    color: #ffffff;
}

.category:hover > a.category_title {
    color: #ffffff;
}

.category.portrait {
    height: 332px;
}

.category.portrait a { /*height: 40px;*/
}

table.images {
    margin: 0 auto;
    min-width: 100%;
}

table.images tbody {
    max-width: 1500px;
}

table.images td {
    vertical-align: middle;
    padding: 0 55px 55px 0;
    width: 332px;
    text-align: center;
}

table.images img {
    width: 332px;
}

table.images .vertical-thumb {
    width: auto;
    height: 332px;
}

table.images .vertical-thumb img {
}

@media only screen and (max-width: 1600px) {
    .category {
        display: inline-block;
        width: 332px;
        padding: 76px 10% 0 10%;
    }

    h1.page_title {
        margin-left: 10%;
    }

    h1.page_title {
        margin-left: 10%;
    }

    h1.category_name {
        margin-left: 10%;
    }

    .pages {
        margin-left: 10%;
        margin-right: 10%;
    }

    .article {
        margin-left: 10%;
        margin-right: 10%;
    }

    .contact #main {
        margin-left: 10%;
        margin-right: 10%;
    }

    .contact #main h1 {
        margin-left: auto;
    }

    .contact #main .pages {
        margin-left: auto;
    }

    table.images td {
        vertical-align: middle;
        text-align: center;
        padding: 0 5% 55px 5%;
        width: 40%;
        float: left;
    }

    table.images td:nth-child(2n) {
        display: block;
    }

    table.images td:nth-child(odd) {
        padding-bottom: 0;
    }

    table.images img {
        width: 100%;
    }

    table.images tbody {
        margin-left: 10%;
        margin-right: 10%;
    }

    table.images .vertical-thumb {
        width: 66%;
        height: auto;
    }
}

#slideshow {
    width: 633px;
    height: 422px;
    background: no-repeat;
    position: relative;
    margin: auto;
}

#slideshow span {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#slideshow span#layer1 {
    z-index: 102;
}

#slideshow span#layer2 {
    z-index: 101;
}

#slideshow span#layer3 {
    z-index: 100;
}

.article {
    padding: 0 20px 10px 0;
    font-weight: 100 !important;
    font-size: 16px !important;
    line-height: 34px !important;
}

.article:first-of-type {
    padding-top: 60px;
}

.article h2 {
    color: #888888;
}

.article h2 span {
    color: #B8B8B8;
}

.article img {
    float: left;
    border: 1px solid #1d2831;
    margin: 0 20px 5px 0;
}

.article div {
}

.article p {
    padding-bottom: 0;
}

.pages {
    padding-right: 20px;
}

.pages p {
    padding-bottom: 15px;
    line-height: 34px !important;
    font-size: 16px !important;
    font-weight: 100 !important;
}

.page_image_1, .page_image_2 {
    border: 1px solid #1d2831;
}

.page_image_1 {
    float: right;
    margin: 0 0 30px 40px;
}

.page_image_2 {
    float: left;
    margin: 0 40px 20px 0;
}

.contact {
}

.contact input, .contact textarea {
    color: #ffffff;
    border: 0;
    padding: 0 10px;
    margin-bottom: 35px;
    border-radius: 2px;
}

.contact input {
    width: 100%;
    max-width: 650px;
    height: 45px;
    background-color: #000000;
}

.contact input.submit {
    width: 193px;
    height: 44px;
    background-color: #6983A9;
    cursor: pointer;
}

.contact textarea {
    width: 100%;
    max-width: 1500px;
    height: 452px;
    padding: 10px;
    background-color: #000000;
    resize: none;
}

.highslide-overlay {
    display: none;
}

.my-overlay {
    right: -167px !important;
    bottom: -136px !important;
}

.my-overlay .highslide-overlay {
    display: flex !important;
}

.my-overlay .expand, .my-overlay .expand_disabled {
    display: block;
    margin-bottom: 30px;
    padding-top: 25px;
    padding-right: 23px;
    order: 1;
}

.my-overlay .expand_disabled {
    color: #3A3A3A;
    text-decoration: none;
    padding-top: 25px;
    padding-right: 23px;
    order: 1;
}

.my-overlay .expand {
    display: none;
    font-size: 14px;
    font-weight: 100;
    color: #B8B8B8;
    padding-top: 25px;
    padding-right: 23px;
    order: 1;
}

.my-overlay .next {
    float: left;
    width: 30px;
    height: 40px;
    order: 2;
    padding-right: 30px;
    background: url(/images/new-arrow-left.png) no-repeat;
    background-size: contain;
    margin-top: 20px;
}

.my-overlay .next.disabled {
    background-image: url(/images/new-arrow-left-disabled.png);
}

.my-overlay .prev {
    float: right;
    width: 30px;
    height: 40px;
    order: 3;
    background: url(/images/new-arrow-right.png) no-repeat;
    background-size: contain;
    margin-top: 20px;
}

.my-overlay .prev.disabled {
    background-image: url(/images/new-arrow-right-disabled.png);
}

@media only screen and (max-width: 700px) {
    .my-overlay {
        left: 26%;
        bottom: -130px !important;
    }

    .szabozsolt {
        padding: 20px 80px 120px 20px !important;
        left: 20% !important;
    }

    .highslide-outline {
        display: none !important;
    }

    .my-overlay .expand {
        display: none;
        font-size: 14px;
        font-weight: 100;
        color: white;
        padding-top: 25px;
        padding-right: 23px;
        order: 2;
    }

    .my-overlay .next {
        float: left;
        width: 30px;
        height: 40px;
        order: 1;
        padding-right: 30px;
        background: url(/images/new-arrow-left.png) no-repeat;
        background-size: contain;
    }

    .my-overlay .next.disabled {
        background-image: url(/images/new-arrow-left-disabled.png);
        background-size: contain;
    }

    .my-overlay .prev {
        float: right;
        width: 30px;
        height: 40px;
        order: 3;
        background: url(/images/new-arrow-right.png) no-repeat;
        background-size: contain;
    }

    .my-overlay .prev.disabled {
        background-image: url(/images/new-arrow-right-disabled.png);
        background-size: contain;
    }
}

@media only screen and (max-width: 600px) {
    .my-overlay .expand {
        display: none;
        font-size: 10px;
        font-weight: 100;
        color: white;
        padding-top: 25px;
        padding-right: 23px;
        order: 2;
    }
}