#wrapper{width:960px;margin:0 auto}.grid1,.grid2,.grid3,.grid4,.grid5,.grid6,.grid7,.grid8,.grid9,.grid10,.grid11,.grid12{float:left;margin-left:10px;margin-right:10px;display:inline}.mod_article [class^=ce_],.mod_article [class*=" ce_"],.mod_article [class^=content-],.mod_article [class*=" content-"],.mod_article [class^=mod_],.mod_article [class*=" mod_"],.mod_article [class^=module-],.mod_article [class*=" module-"]{margin-left:10px;margin-right:10px}.ce_sliderStart>.content-slider{margin-left:0;margin-right:0}.mod_article .mod_newsreader,.mod_article .mod_eventreader{margin-left:0;margin-right:0}.mod_article [class^=layout_]>*,.mod_article [class*=" layout_"]>*,.mod_article [class^=event_]>*,.mod_article [class*=" event_"]>*{margin-left:10px;margin-right:10px}.mod_article.grid1,.mod_article.grid2,.mod_article.grid3,.mod_article.grid4,.mod_article.grid5,.mod_article.grid6,.mod_article.grid7,.mod_article.grid8,.mod_article.grid9,.mod_article.grid10,.mod_article.grid11,.mod_article.grid12{margin-left:0;margin-right:0}#main .inside{overflow:hidden}.grid1{width:60px}.grid2{width:140px}.grid3{width:220px}.grid4{width:300px}.grid5{width:380px}.grid6{width:460px}.grid7{width:540px}.grid8{width:620px}.grid9{width:700px}.grid10{width:780px}.grid11{width:860px}.grid12{width:940px}.mod_article.grid1{width:80px}.mod_article.grid2{width:160px}.mod_article.grid3{width:240px}.mod_article.grid4{width:320px}.mod_article.grid5{width:400px}.mod_article.grid6{width:480px}.mod_article.grid7{width:560px}.mod_article.grid8{width:640px}.mod_article.grid9{width:720px}.mod_article.grid10{width:800px}.mod_article.grid11{width:880px}.mod_article.grid12{width:960px}.offset1{margin-left:90px!important}.offset2{margin-left:170px!important}.offset3{margin-left:250px!important}.offset4{margin-left:330px!important}.offset5{margin-left:410px!important}.offset6{margin-left:490px!important}.offset7{margin-left:570px!important}.offset8{margin-left:650px!important}.offset9{margin-left:730px!important}.offset10{margin-left:810px!important}.offset11{margin-left:890px!important}.offset12{margin-left:970px!important}.mod_article.offset1{margin-left:80px!important}.mod_article.offset2{margin-left:160px!important}.mod_article.offset3{margin-left:240px!important}.mod_article.offset4{margin-left:320px!important}.mod_article.offset5{margin-left:400px!important}.mod_article.offset6{margin-left:480px!important}.mod_article.offset7{margin-left:560px!important}.mod_article.offset8{margin-left:640px!important}.mod_article.offset9{margin-left:720px!important}.mod_article.offset10{margin-left:800px!important}.mod_article.offset11{margin-left:880px!important}.mod_article.offset12{margin-left:960px!important}@media (min-width:768px) and (max-width:979px){#wrapper{width:744px}.grid1{width:42px}.grid2{width:104px}.grid3{width:166px}.grid4{width:228px}.grid5{width:290px}.grid6{width:352px}.grid7{width:414px}.grid8{width:476px}.grid9{width:538px}.grid10{width:600px}.grid11{width:662px}.grid12{width:724px}.mod_article.grid1{width:62px}.mod_article.grid2{width:124px}.mod_article.grid3{width:186px}.mod_article.grid4{width:248px}.mod_article.grid5{width:310px}.mod_article.grid6{width:372px}.mod_article.grid7{width:434px}.mod_article.grid8{width:496px}.mod_article.grid9{width:558px}.mod_article.grid10{width:620px}.mod_article.grid11{width:682px}.mod_article.grid12{width:744px}.offset1{margin-left:72px!important}.offset2{margin-left:134px!important}.offset3{margin-left:196px!important}.offset4{margin-left:258px!important}.offset5{margin-left:320px!important}.offset6{margin-left:382px!important}.offset7{margin-left:444px!important}.offset8{margin-left:506px!important}.offset9{margin-left:568px!important}.offset10{margin-left:630px!important}.offset11{margin-left:692px!important}.offset12{margin-left:754px!important}.mod_article.offset1{margin-left:62px!important}.mod_article.offset2{margin-left:124px!important}.mod_article.offset3{margin-left:186px!important}.mod_article.offset4{margin-left:248px!important}.mod_article.offset5{margin-left:310px!important}.mod_article.offset6{margin-left:372px!important}.mod_article.offset7{margin-left:434px!important}.mod_article.offset8{margin-left:496px!important}.mod_article.offset9{margin-left:558px!important}.mod_article.offset10{margin-left:620px!important}.mod_article.offset11{margin-left:682px!important}.mod_article.offset12{margin-left:744px!important}}@media (max-width:767px){#wrapper{width:auto}.grid1,.grid2,.grid3,.grid4,.grid5,.grid6,.grid7,.grid8,.grid9,.grid10,.grid11,.grid12{float:none!important;display:block!important;width:auto!important}.offset1,.offset2,.offset3,.offset4,.offset5,.offset6,.offset7,.offset8,.offset9,.offset10,.offset11,.offset12{margin-left:10px!important}}
/* =========================================
   BRAKOS / ABOUT US PAGE
   COMPLETE BLACK LUXURY DESIGN
========================================= */

/* RESET */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    background:#050505;
    color:#d4af37;
    font-family:Arial, Helvetica, sans-serif;
    line-height:1.7;
    overflow-x:hidden;
}

/* LINKS */

a{
    text-decoration:none;
    transition:.3s;
}

/* WRAPPER */

#wrapper{
    width:100%;
    min-height:100vh;
}

#container{
    width:100%;
}

/* =========================================
   HEADER / NAVIGATION
========================================= */

#main .inside{
    width:100%;
}

/* FIRST NAVIGATION REMOVE */

.mod_navigation.main-nav{
    display:none;
}

/* TOP BAR */

#article-5{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:0;
    padding:0 60px;
    background:#000;
    border-bottom:1px solid #2a2a2a;
    position:sticky;
    top:0;
    z-index:9999;
    min-height:110px;
}

/* LOGO */

.media--left{
    display:flex;
    align-items:center;
    margin-right:0;
    padding-right:0;
}

.media--left figure{
    margin:0;
    padding:0;
    display:flex;
    align-items:center;
}

.media--left img{
    width:100px;
    height:auto;
    display:block;
    filter:
        drop-shadow(0 0 8px rgba(212,175,55,.4));
}

/* REMOVE EMPTY TEXT */

.media--left .rte{
    display:none;
}

/* =========================================
   NAVIGATION INLINE
========================================= */

#article-5 > #nav{
    margin-left:0;
    padding-left:0;
    flex:1;
}

#article-5 > #nav .rte{
    width:100%;
}

#article-5 > #nav p{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:40px;
    margin:0;
    padding-left:15px;
    flex-wrap:wrap;
}

/* NAV LINKS */

#article-5 > #nav a{
    color:#d4af37;
    text-transform:uppercase;
    font-size:14px;
    letter-spacing:2px;
    font-weight:700;
    position:relative;
    padding:10px 0;
}

/* HOVER EFFECT */

#article-5 > #nav a::after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:0;
    height:2px;
    background:#ff5e00;
    transition:.4s;
}

#article-5 > #nav a:hover{
    color:#ff5e00;
}

#article-5 > #nav a:hover::after{
    width:100%;
}

/* =========================================
   HERO SECTION
========================================= */

#article-2{
    width:100%;
    min-height:90vh;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    position:relative;
    overflow:hidden;
    background:
        linear-gradient(rgba(0,0,0,.75),rgba(0,0,0,.75)),
        url('/files/barkos/90AC9D3A-7DB8-4378-8650-E888CFA3D6E6.png')
        center center / cover no-repeat;
}

/* DARK OVERLAY */

#article-2::before{
    content:"";
    position:absolute;
    inset:0;
    background:
        radial-gradient(circle at center,
        rgba(212,175,55,.12),
        transparent 70%);
}

/* CONTENT */

#article-2 .content-text{
    position:relative;
    z-index:2;
    max-width:1200px;
    padding:40px;
}

/* TITLE */

#article-2 h1{
    color:#d4af37;
    font-size:100px;
    text-transform:uppercase;
    letter-spacing:10px;
    margin-bottom:30px;
    font-weight:900;
    text-shadow:
        0 0 20px rgba(212,175,55,.25),
        0 0 40px rgba(212,175,55,.1);
}

/* IMAGE */

#article-2 h1 img{
    width:100%;
    max-width:1200px;
    height:auto;
    display:block;
    margin:0 auto 40px auto;
    border-radius:12px;
    box-shadow:
        0 20px 60px rgba(0,0,0,.7),
        0 0 30px rgba(212,175,55,.1);
}

/* =========================================
   GOLDEN LUXURY LINES
========================================= */

#article-2::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:60px;
    transform:translateX(-50%);
    width:220px;
    height:2px;
    background:
        linear-gradient(
            to right,
            transparent,
            #d4af37,
            transparent
        );
}

/* =========================================
   ARTICLE SPACING
========================================= */

.mod_article{
    position:relative;
}

/* =========================================
   SCROLLBAR
========================================= */

::-webkit-scrollbar{
    width:10px;
}

::-webkit-scrollbar-track{
    background:#000;
}

::-webkit-scrollbar-thumb{
    background:#d4af37;
}

/* =========================================
   RESPONSIVE
========================================= */

@media(max-width:1100px){

    #article-2 h1{
        font-size:70px;
        letter-spacing:6px;
    }

    #article-5{
        padding:0 30px;
    }

    #article-5 > #nav p{
        gap:25px;
    }

}

@media(max-width:768px){

    /* MOBILE HEADER */

    #article-5{
        flex-direction:column;
        justify-content:center;
        align-items:center;
        padding:20px;
    }

    /* LOGO */

    .media--left{
        width:100%;
        justify-content:center;
        margin-bottom:15px;
    }

    /* NAV */

    #article-5 > #nav{
        width:100%;
    }

    #article-5 > #nav p{
        justify-content:center;
        gap:18px;
        padding-left:0;
    }

    #article-5 > #nav a{
        font-size:12px;
        letter-spacing:1px;
    }

    /* HERO */

    #article-2{
        min-height:75vh;
        padding:60px 20px;
    }

    #article-2 h1{
        font-size:42px;
        letter-spacing:3px;
    }

    #article-2 h1 img{
        border-radius:8px;
    }

}

@media(max-width:480px){

    #article-5 > #nav p{
        flex-direction:column;
        gap:10px;
    }

    #article-2 h1{
        font-size:32px;
    }

}
