@font-face {
    font-family: 'MinionPro';
    src: url('fonts/MinionPro-Bold.eot'); /* IE9 Compat Modes */
    src: url('fonts/MinionPro-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('fonts/MinionPro-Bold.woff') format('woff'), /* Modern Browsers */
        url('fonts/MinionPro-Bold.ttf') format('truetype'), /* Safari, Android, iOS */
        url('fonts/MinionPro-Bold.svg#MinionPro-Bold') format('svg'); /* Legacy iOS */
    font-style: normal;
    font-weight: bold;
    text-rendering: optimizeLegibility;
}

@font-face {
    font-family: 'MinionPro';
    src: url('fonts/MinionPro-Regular.eot'); /* IE9 Compat Modes */
    src: url('fonts/MinionPro-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('fonts/MinionPro-Regular.woff') format('woff'), /* Modern Browsers */
        url('fonts/MinionPro-Regular.ttf') format('truetype'), /* Safari, Android, iOS */
        url('fonts/MinionPro-Regular.svg#MinionPro-Bold') format('svg'); /* Legacy iOS */
    font-style: normal;
    font-weight: normal;
    text-rendering: optimizeLegibility;
}

html,
body {
    font-family: 'MinionPro';
    width: 100%;
    background: white;
    padding: 0;
    margin: 0;
    height:100%;
}

.mtb-10 {
    margin: 10px 0;
}

.mb-25 {
    margin-bottom: 25px;
}

.mt-12 {
    margin-top: 12px;
}

.mt-8 {
    margin-top: 8px;
}

.mt-15 {
    margin-top: 15px;
}

.mb-15 {
    margin-bottom: 15px;
}

.dib {
    display: inline-block;
}

.tdn {
    text-decoration: none;
}

.pr-6 {
    padding-right: 6px;
}

.pointer {
    cursor: pointer;
}

.mid-title {
    font-size: 1.2em;
    font-weight: 600;
}

.fw-600 {
    font-weight: 600;
}

.closed {
    display: none;
}

.open {
    display: block;
}

.content-container {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.mobile-separator-line {
    display: none;
}

.language-selector {
    color: white;
    position: absolute;
    top: 20px;
    right: 25px;
    font-size: 0;
    z-index: 2147483647;
}

.si-selector,
.en-selector,
.it-selector {
    cursor: pointer;
    font-size: 18px;
    width: 25px;
    text-align: center;
}

.en-selector {
    border-right: 1px solid white;
    border-left: 1px solid white;
}

.mobile-language-selector {
    color: white;
    font-size: 0;
}

.mobile-si-selector,
.mobile-en-selector,
.mobile-it-selector {
    text-align: center;
    width: 32px;
    font-size: 16px;
}

.mobile-en-selector {
    border-right: 1px solid white;
    border-left: 1px solid white;
}

.navigation {
    color: white;
    position: absolute;
    width: 100%;
    height: 180px;
    top: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    background-image: url('../img/homepage.jpg');
    background-repeat: no-repeat;
    background-size: 100%;
}

.navigation .logo-holder {
    width: 1024px;
    order: 1;
    height: 125px;
    text-align: center;
    margin: 0 auto;
}

.navigation .logo-holder #logo {
    height: 125px;
    display: inline-block;
    padding-top: 15px;
    padding-bottom: 20px;
    box-sizing: border-box;
    cursor: pointer;
}

.navigation .logo-holder #logo img {
    height: 100%;
}
.navigation .links-holder {
    width: 1024px;
    height: 55px;
    order: 2;
    margin: 0 auto;
    border-top: 1px solid white;
}

.navigation .links-holder ul {
    height: 100%;
    text-align: center;
    margin: 0;  
    list-style-type: none;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
}

.navigation .links-holder ul li {
    text-align: center;
    display: inline-block;
    padding: 0 35px;
    font-size: 1em;
    font-weight: 300;
    cursor: pointer;
}

.navigation .links-holder ul li:hover {
    font-weight: 600;
}

.navigation .selected {
    font-weight: 600 !important; 
}

/*** Section common settings ***/

.section-content {
    width: 1024px; 
    padding-top: 180px;
    display: flex;
    align-items: center;
    justify-content: space-around;
}

.columns-wrapper {
    display: flex;
    width: 1024px;
    justify-content: center;
    padding-bottom: 20px;
    padding-top: 20px;
}

.direction-column {
    flex-direction: column;
}

/*** Section 0 ***/

#section-0 {
    flex: 1 0 auto;
    background: url("/assets/img/homepage.jpg");
    display: flex;
    justify-content: center;
    background-repeat: no-repeat;
    background-size: cover;
    /* display: none; */
 }

 /*** Section 1 ***/

 #section-1 {
    flex: 1 0 auto;
    background: white;
    display: flex;
    justify-content: center;
    display: none;
 }

.contact-col-left {
    flex-basis: 30%;
}

.contact-col-right {
    flex-basis: 60%;
}

.detail-info {
    font-size: 0.78em;
}

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

/*** Section 2 ***/

#section-2 {
    flex: 1 0 auto;
    background: white;
    display: flex;
    justify-content: center;
    display:none;
 }

 #presentation-jc {
     justify-content: space-around;
 }

 .presentation-col-lara {
    flex-basis: 45%;
 }

 .presentation-col-sabina {
    flex-basis: 45%;
 }

 .image-lawyer {
    box-sizing: border-box;
    float: left;
    width: 46%;
    padding-right: 12px;
    padding-bottom: 4px;
    z-index: 99;
 }

 .title-line {
    width: 54%;
    border-bottom: 1px solid #464646;
    margin-left: 46%;
    opacity: 0.65;
}

.align-both-sides {
    text-align: justify;
    text-justify: inter-word;
    hyphens: auto;
}

/*** Section 3 ***/

#section-3 {
    flex: 1 0 auto;
    background: white;
    display: flex;
    justify-content: center;
    display: none;
}

.work-areas-col {
    flex-basis: 35%;
}

.work-details-main {
    cursor: pointer;
}

.work-details-expanded {
    display: none;
    padding-left: 27px;
    margin-top: 3px;
}

/*** Section 4 ***/

#section-4 {
    flex: 1 0 auto;
    background: white;
    display: flex;
    justify-content: center;
    display: none;
}

.links-title {
    display: flex;
    justify-content: space-around;
}

.links-title-content {
    flex-basis: 96.67%;
}

.links-wrapper {
    display: flex;
    justify-content: space-around;
}

.links-wrapper a {
    text-decoration: none;
    color: #333
}

.links-col {
    flex-basis: 30%;
}

/*** Section 5 ***/

#section-5 {
    flex: 1 0 auto;
    background: white;
    display: flex;
    justify-content: center;
    display:none;
}

#section-5 .section-content {
    align-items: stretch;
    width: 100%;
    max-width: 1400px;
}

#section-5 .section-content .columns-wrapper {
    width: 100%;
    padding: 0;
}

.gallery-col-1 {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.gallery-col-2 {
    background-image: url("/assets/img/vhodna-vrata.jpg");
    flex: 1;
    background-size: cover;
}

.gallery-col-3 {
    background-image: url("/assets/img/IMG_2458.jpg");
    flex: 1;
    background-size: cover;
}

.inside-row {
    flex: 1;
    background-size: cover;
}

.gallery-col-1 .inside-row:first-child {
    background-image: url("/assets/img/zunanjost-2.jpg");
}

.gallery-col-1 .inside-row:last-child {
    background-image: url("/assets/img/vhod.jpg");
}

/*** footer ***/

.footer {
    flex-shrink: 0;
    background: white;
    color: black;
    height: 60px;
}

.line {
    width: 1024px;
    height: 100%;
    border-top: 1px solid #333;
    margin: 0 auto;
    box-sizing: border-box;
}

#mobile-navigation {
    display: none;
}

@media (max-width: 768px) {

    body {
        -webkit-overflow-scrolling: touch;
        height: auto;
    }

    .mobile-mt-12 {
        margin-top: 12px;
    }

    .navigation {
        display: none;
    }

    .language-selector {
        display: none;
    }

    .mobile-separator-line {
        display: block;
        width: 100%;
        height: 2px;
        box-sizing: border-box;
        margin: 40px 0 40px 0;
        background-color: #333;
    }

    .section-content {
        width: 100%; 
        padding-top: 0;
        display: block;
    }
    
    .columns-wrapper {
        display: block;
        width: 100%;
        padding-bottom: 0;
        padding-top: 0;
    }

    .content-container {
        padding: 0 10px;
    }

    #section-0 {
        display: none;
    }

    #section-1 {
        display: block;
    }

    #section-2 {
        display: block;
    }

    #section-3 {
        display: block;
    }

    #section-4 {
        display: block;;
    }

    .links-title {
        display: block;
    }
    
    .links-wrapper {
        display: block;
    }

    #section-5 {
        display: block;
    }

    .gallery-col-1 {
        display: block;
        height: 500px;
    }

    .inside-row {
        background-size: cover;
        height: 100%;
    }

    .gallery-col-1  .inside-row:first-child {
        background-size: cover;
        height: 50%;
    }

    .gallery-col-1  .inside-row:last-child {
        background-size: cover;
        height: 50%;
    }

    .gallery-col-2 {
        flex: none;
        display: block;
        height: 500px;
        background-size: cover;
    }

    .gallery-col-3 {
        flex: none;
        display: block;
        height: 450px;
        background-size: cover;
    }

    /*** Mobile navigation ***/

    #mobile-navigation {
        background: url("/assets/img/homepage.jpg");
        background-size: cover;
        background-position: center;
        width: 100%;
        display: block;
    }

    #mobile-hamburger {
        padding: 16px;
        position: absolute;
        color: white;
        right: 0;
        display: inline-block;
    }

    #mobile-menu {
        position: fixed;
        height: 70px;
        width: 100%;
        z-index: 9000;
        /* background-image: url("/assets/img/homepage.jpg"); */
        background-repeat: no-repeat;
        background-size: cover;
        background-position: 0 -150px; 
    }

    .mobile-menu-logo {
        position: absolute;
        margin: 0 auto;
        left: 0;
        right: 0;
        top: 1px;
        width: 95px;
        height: 66px;
        background-image:url('/assets/img/Logo_homepage_ENG.svg');
        background-size: cover;
        background-repeat: no-repeat;
        display: none;
    }

    .mobile-navigation-logo {
        background-image:url('/assets/img/Logo_homepage_ENG.svg');
        background-repeat: no-repeat;
    }

    #mobile-logo img {
        height: 125px;
        position: absolute;
        margin: auto;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
    }

    #down-button {
        font-size: 2em;
        color: white;
        cursor: pointer;
        position: absolute;
        margin: 0 auto;
        bottom: 20px;
        left: 0;
        right: 0;
        width: 20px;
    }

    #mobile-navigation-links-holder {
        text-align: center;
        padding-top: 18vh;
        position: fixed;
        top: 0;
        width: 100%;
        background-color: rgba(0, 0, 0, 0.95);
        z-index: 999;
        display: none;
    }

    #mobile-navigation-links-holder a {
        text-decoration: none;
        color: white;
    }
    
    .mobile-menu-line {
        margin: 0 auto;
        width: 23%;
        border-top: 2px solid white;
    }
}