@charset "utf-8";
/* CSS Document */

/* Default Responsive */
@media (min-width: 375px) {
    #fileListContents {
        width: calc(100vw - 13.7rem);
    }
}

@media (min-width: 480px) {
    .footerLogo {
        display: flex;
        margin: 0 5px 2.5rem 0;
    }

    .footerTagline {
        margin: 1rem 0 0 1.6rem;
        font-size: 2.6rem;
        line-height: 3.2rem;
        letter-spacing: -.12rem;
    }
}

@media (min-width: 580px) {
    .formOptionImage {
        width: 200px;
    }

    .welcomeChars {
        display: block;
        position: absolute;
        right: 3rem;
        bottom: 3.8rem;
        height: 1.3rem;
    }

    .title36 {
        font-size: 3.6rem;
        line-height: 4.2rem;
        letter-spacing: -.15rem;
    }

    .title48 {
        font-size: 4.8rem;
        line-height: 5.2rem;
        letter-spacing: -.2rem;
    }

    .iArticle01Line {
        display: block;
        width: 6rem;
        height: 3px;
        background: #FF0000;
        margin: 1.2rem 0 0 0;
        flex-shrink: 0;
    }

    .iArticle01Text {
        width: calc(100% - 60px);
    }

    .iArticle02Left {
        display: block;
        flex-grow: 1;
    }

    .iArticle02Right {
        display: block;
        background: #FFFFFF;
        flex-grow: 1;
    }

    .iArticle02BG {
        position: relative;
        width: 100%;
        padding: 20rem 0 0 0;
        background: url(../images/office.jpg) no-repeat top center;
        background-size: 100%;
    }

    .iArticle02Contents {
        position: relative;
        background: #FFFFFF;
        width: calc(100% - 180px);
        padding: 4rem 0 0 5.5rem;
    }

    .iArticle02Line {
        display: block;
        position: absolute;
        left: -8.8rem;
        bottom: 1rem;
        width: 6rem;
        height: 3px;
        background: #FF0000;
    }

    .footerContents, .footerSigContents {
        width: calc(100% - 60px);
        margin: 0 auto;
    }

    .footerLinksColumn {
        width: 50%;
        margin: 0 0 30px 0
    }

    .logo {
        height: 6rem;
    }

    .certLogo {
        height: 2.8rem;
    }

    .footerTagline {
        margin: 1rem 0 0 1.6rem;
        font-size: 2.6rem;
        line-height: 3.2rem;
        letter-spacing: -.12rem;
    }

    .footerLogo {
        display: flex;
        margin: 0 35px 25px 0;
    }
}

@media (min-width: 768px) {
    .topSpacing {
        display: none;
    }

    .headerContainer {
        width: calc(100% - 60px);
    }

    .heroContainer {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        /* height:196.5rem; */
        height: 279.2rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }

    .heroContainerInterpreting {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 196.5rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }

    .heroWhitespaceInterpreting {
        display: block;
        position: absolute;
        bottom: 0;
        background: #FFF;
        width: 100%;
        height: 28.7rem;
    }

    .heroContainerEN {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        /* height:196.5rem; */
        height: 285.2rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }

    .heroWhitespace {
        display: block;
        position: absolute;
        bottom: 0;
        background: #FFF;
        width: 100%;
        height: 28.7rem;
    }

    .heroContentContainer {
        position: relative;
        width: calc(100% - 200px);
    }

    .heroTitle {
        position: absolute;
        margin: 0;
        top: 17rem;
        left: -.2rem;
        font-size: 7.2rem;
        line-height: 6.2rem;
        letter-spacing: -.2rem;
    }

    .heroDivider {
        margin: 0;
        position: absolute;
        top: 33rem;
        left: -36rem;
        height: 1.3rem;
    }

    .heroText {
        margin: 0;
        position: absolute;
        top: 37.5rem;
        font-size: 2rem;
        line-height: 3rem;
        width: 55rem;
    }

    .formContainerOptions {
        margin: 0;
        width: calc(100% - 100px);
        position: relative;
        top: 0rem;
        background: #FFFFFF;
        padding: 1.5rem 5rem 0 5rem;
    }

    .formContainer {
        margin: 0;
        display: block;
        width: calc(100% - 100px);
        position: relative;
        background: #FFFFFF;
        padding: 5rem;
    }

    .formContainerInterpreting {
        margin: 0;
        display: block;
        width: calc(100% - 100px);
        position: relative;
        top: 53rem;
        background: #FFFFFF;
        padding: 5rem;
    }

    .formGuide {
        width: calc(100% - 10rem);
        padding: 3.5rem 5rem 0 5rem;
        background: #FFFFFF;
        margin: 53rem 0 0 0;
    }

    .formDisclaimer, .formDisclaimerEN {
        margin: 0;
        left: 0;
        position: relative;
        top: -4.4rem;
        background: #FFFFFF;
        width: calc(100% - 100px);
        padding: 0 5rem 5rem 5rem;
    }

    .formDisclaimerInterpreting {
        margin: 0;
        left: 0;
        position: absolute;
        top: 167.8rem;
        background: #FFFFFF;
        width: calc(100% - 100px);
        padding: 0 5rem 5rem 5rem;
    }

    .formWhitespace {
        display: none;
    }

    .formDesc {
        margin: 0;
        position: absolute;
        width: 10rem;
        height: 27rem;
        top: 87.8rem;
        left: -10rem;
        border-bottom: 3px solid #FF0000;
    }

    .formDescText {
        position: absolute;
        bottom: 17rem;
        left: -12rem;
        font-size: 1.2rem;
        letter-spacing: .45rem;
        transform: rotate(-90deg);
    }

    .checkContainer {
        padding: 0 0 0 4rem;
    }

    .formButton {
        margin-left: calc(50% - 13rem);
    }

    .welcomeImage {
        width: 100%;
        height: 50rem;
        background: url(../images/welcome.jpg) center;
        background-size: cover;
    }

    .welcomeContent {
        position: relative;
        width: calc(100% - 5rem);
        padding: 5rem 5rem 5rem 0;
        background: #EBEBEB;
    }

    .welcomePadding {
        padding: 0 0 0 5rem;
    }

    .welcomeUnderline {
        width: 18rem;
        margin: 4rem 0;
        height: 3px;
        background: #FF0000;
    }

    .welcomeText {
        width: calc(100% - 5rem);
    }

    .welcomeChars {
        position: absolute;
        right: 5rem;
        bottom: 5.8rem;
        height: 1.3rem;
    }

    .infoContainer {
        position: relative;
        width: 100%;
        margin: 8rem 0 5rem 0;
    }

    .infoContent {
        display: flex;
        justify-content: space-between;
        flex-direction: row;
        width: calc(100% - 60px);
        margin: 0 auto;
    }

    .infoColumn {
        width: 28%;
        padding: 0 2rem 3rem 0;
        background: url(../images/infocolumn_bg.png) bottom no-repeat;
        margin: 0;
    }

    .infoChars {
        position: absolute;
        bottom: 5rem;
        height: 9rem;
        width: 100%;
        background: url(../images/charsbig_01.svg) center no-repeat;
    }

    .iArticle01Container {
        position: relative;
        width: 100%;
        padding: 8rem 0 8rem 0;
        background: #EBEBEB;
    }

    .iArticle01Line {
        width: 9rem;
        height: 3px;
        background: #FF0000;
        margin: 1.2rem 0 0 0;
        flex-shrink: 0;
    }

    .iArticle02BG {
        position: relative;
        width: 100%;
        padding: 25rem 0 0 0;
        background: url(../images/office.jpg) no-repeat top center;
        background-size: 100%;
    }

    .iArticle02Contents {
        position: relative;
        background: #FFFFFF;
        width: calc(100% - 240px);
        padding: 5.5rem 0 0 7rem;
    }

    .iArticle02Line {
        position: absolute;
        left: -12.5rem;
        bottom: 1rem;
        width: 9rem;
        height: 3px;
        background: #FF0000;
    }

    .hoissDivider {
        width: calc(100% - 60px);
    }

    .refContainer {
        width: calc(100% - 60px);
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
    }

    #slider {
        height: 15rem;
        width: 80%;
        overflow: hidden;
    }

    .slide {
        height: 15rem;
    }

    .refDesc {
        height: 15rem;
    }

    .refDescText {
        position: absolute;
        bottom: 8rem;
        left: 3rem;
        font-size: 1.2rem;
        letter-spacing: .45rem;
        transform: rotate(-90deg);
    }

    .img-responsive {
        max-width: 80%;
        max-height: 15rem;
    }

    .footerContents {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        width: calc(100% - 60px);
        margin: 0 auto;
    }

    .footerSigContents {
        display: flex;
        justify-content: space-between;
        width: calc(100% - 60px);
        margin: 0 auto;
    }

    .footerLogo {
        margin: 0;
    }

    .certLogo {
        height: 6rem;
    }

    .pageRowImp {
        display: flex;
        margin: 0;
    }

    .pageImpLeft {
        width: 26rem;
        flex-shrink: 0;
    }

    .pageImpRight {
        width: calc(100% - 26rem);
    }

    #fileListContents {
        width: calc(100vw - 331px);
    }
}

@media (min-width: 768px) {
    .heroContainerEN {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 283.3rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }

}

@media (min-width: 769px) {
    .heroContainerEN {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 281rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }

}

@media (min-width: 770px) {
    .heroContainer {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        /* height:196.5rem; */
        height: 277.2rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }

    .heroContainerEN {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        /* height:196.5rem; */
        height: 281.2rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }
}

@media (min-width: 787px) {
    .heroContainerEN {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 278.9rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }

}

@media (min-width: 792px) {
    .heroContainerEN {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 276.6rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }

}

@media (min-width: 798px) {
    .heroContainerEN {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 276.8rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }

}

@media (min-width: 812px) {
    .heroContainer {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        /* height:196.5rem; */
        height: 275.2rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }

    .heroContainerEN {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 276.6rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }
}

@media (min-width: 813px) {
    .heroContainer {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        /* height:196.5rem; */
        height: 274.7rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }

    .heroContainerEN {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        /* height:196.5rem; */
        height: 276.8rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }
}

@media (min-width: 815px) {
    .heroContainerEN {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 274.4rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }

}


@media (min-width: 819px) {
    .heroContainerEN {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 272.4rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }

}


@media (min-width: 823px) {
    .heroContainer {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        /* height:196.5rem; */
        height: 270.4rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }

    .heroContainerEN {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        /* height:196.5rem; */
        height: 272.4rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }
}


@media (min-width: 837px) {
    .heroContainer {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 100%;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }

}

@media (min-width: 879px) {
    .heroContainerEN {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 270.2rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }
}

@media (min-width: 884px) {
    .heroContainerEN {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 268rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }
}

@media (min-width: 898px) {
    .heroContainerEN {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 267.6rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }
}

@media (min-width: 920px) {
    .headerLinksContainer {
        display: flex;
        align-items: flex-end;
        font-size: 1.4rem;
        font-weight: 700;
        height: 7.5rem;
    }

    .headerLinksContainerSM {
        display: none;
    }

    .iconLang {
        position: absolute;
        right: 0;
        top: 3.2rem;
        width: 32px;
        height: 32px;
    }

}

@media (min-width: 958px) {
    .heroContainerEN {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 267.2rem;
        background: url(../images/hero.jpg) no-repeat top center fixed;
        background-size: auto;
    }
}

@media (min-width: 992px) {
    .headerContainer {
        width: 950px;
    }

    .heroContainer {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 169.3rem; /* Tu mijenjati */
        background: url(../images/hero.jpg) no-repeat top center fixed;
    }

    .heroContainerEN {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 171.3rem; /* Tu mijenjati */
        background: url(../images/hero.jpg) no-repeat top center fixed;
    }

    .heroContainerInterpreting {
        position: relative;
        display: flex;
        justify-content: center;
        width: 100%;
        height: 121rem; /* Tu mijenjati */
        background: url(../images/hero.jpg) no-repeat top center fixed;
    }

    .heroContentContainer {
        position: relative;
        width: 950px;
    }

    .heroWhitespace {
        position: absolute;
        bottom: 0;
        background: #FFF;
        width: 100%;
        height: 25.7rem;
    }

    .heroWhitespaceInterpreting {
        position: absolute;
        bottom: 0;
        background: #FFF;
        width: 100%;
        height: 25.7rem;
    }

    .formContainerOptions {
        display: flex;
        width: 850px;
        flex-direction: row;
        gap: 0;
        justify-content: space-between;
        position: relative;
        background: #FFFFFF;
        padding: 1.5rem 5rem 0 5rem;
    }

    .formContainer {
        display: flex;
        width: 850px;
        justify-content: space-between;
        position: relative;
        top: 0rem; /* Tu mijenjati poziciju */
        background: #FFFFFF;
        padding: 3.5rem 5rem 5rem 5rem;
    }

    .formContainerInterpreting {
        display: flex;
        width: 850px;
        justify-content: space-between;
        position: relative;
        top: 53rem; /* Tu mijenjati poziciju */
        background: #FFFFFF;
        padding: 5rem 5rem 5rem 5rem;
    }

    .formColumn {
        width: 260px;
    }

    .formColumnLinks {
        display: block;
        width: 200px;
    }

    .formDisclaimer {
        background: #FFFFFF;
        width: 850px;
        position: absolute;
        top: 143.5rem; /* Tu podesiti */
        padding: 0 5rem 5rem 5rem;
    }

    .formDisclaimerEN {
        background: #FFFFFF;
        width: 850px;
        position: absolute;
        top: 145.5rem; /* Tu podesiti */
        padding: 0 5rem 5rem 5rem;
    }

    .formDisclaimerInterpreting {
        background: #FFFFFF;
        width: 850px;
        position: absolute;
        top: 95rem; /* Tu podesiti */
        padding: 0 5rem 5rem 5rem;
    }

    .formDesc {
        position: absolute;
        width: 10rem;
        height: 27rem;
        top: 15rem;
        left: -10rem;
        border-bottom: 3px solid #FF0000;
    }

    .welcomeContainer {
        display: flex;
        width: 100%;
    }

    .welcomeImage {
        width: 48%;
        height: auto;
        background: url(../images/welcome.jpg) center;
        background-size: cover;
    }

    .welcomeContent {
        position: relative;
        width: 52%;
        padding: 5rem 5rem 5rem 0;
        background: #EBEBEB;
    }

    .welcomeUnderline {
        width: 18rem;
        margin: 4rem 0;
        height: 3px;
        background: #FF0000;
    }

    .welcomeText {
        width: 48rem;
    }

    .welcomeChars {
        position: absolute;
        right: 5rem;
        bottom: 5.8rem;
        height: 1.3rem;
    }

    .infoContent {
        display: flex;
        justify-content: space-between;
        width: 950px;
        margin: 0 auto;
    }

    .infoColumn {
        width: 28%;
        padding: 0 2rem 3rem 0;
        background: url(../images/infocolumn_bg.png) bottom no-repeat;
    }

    .infoOverflow {
        white-space: normal;
    }

    .iArticle01Contents {
        display: flex;
        width: 950px;
        margin: 0 auto;
    }

    .iArticle01Line {
        width: 16.5rem;
        height: 3px;
        background: #FF0000;
        margin: 1.2rem 0 0 0;
    }

    .iArticle01Text {
        width: 65rem;
    }

    .iArticle02BG {
        position: relative;
        width: 100%;
        padding: 30rem 0 0 0;
        background: url(../images/office.jpg) no-repeat top center fixed;
        background-size: cover;
    }

    .iArticle02Line {
        position: absolute;
        left: -19.5rem;
        bottom: 1rem;
        width: 16.5rem;
        height: 3px;
        background: #FF0000;
    }

    .iArticle02Whitespace {
        height: 67rem;
    }

    .iArticle02Contents {
        position: relative;
        background: #FFFFFF;
        width: calc(760px - 10rem);
        padding: 8rem 0 0 10rem;
    }

    .iArticle02Chars {
        display: none;
    }

    .hoissDivider {
        height: 7.5rem;
        width: 950px;
    }

    .refContainer {
        width: 950px;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
    }

    #slider {
        height: 15rem;
        width: 80rem;
        overflow: hidden;
    }

    .refDescText {
        position: absolute;
        bottom: 8rem;
        left: 3rem;
        font-size: 1.2rem;
        letter-spacing: .45rem;
        transform: rotate(-90deg);
    }

    .footerLinksContainer, .footerSigContainer {
        padding: 5rem 0;
    }

    .footerContents {
        display: flex;
        justify-content: space-between;
        width: 950px;
        margin: 0 auto;
    }

    .footerLinksColumn {
        width: 25%;
    }

    .footerSigContents {
        display: flex;
        justify-content: space-between;
        width: 950px;
        margin: 0 auto;
    }

    .logo, .certLogo {
        height: 7.5rem;
    }

    .footerTagline {
        margin: 1.4rem 0 0 2rem;
        font-size: 3.2rem;
        line-height: 3.8rem;
        letter-spacing: -.12rem;
    }

    #fileListContents {
        width: 229px;
    }
}

@media (min-width: 1200px) {
    .headerContainer {
        width: 1140px;
    }

    .infoContent {
        display: flex;
        justify-content: space-between;
        width: 1140px;
        margin: 0 auto;
    }

    .infoColumn {
        width: auto;
        padding: 0 4rem 3rem 0;
        background: url(../images/infocolumn_bg.png) bottom no-repeat;
    }

    .iArticle01Contents {
        display: flex;
        width: 1140px;
        margin: 0 auto;
    }

    .iArticle01Text {
        width: 75rem;
    }

    .iArticle02BG {
        padding: 50vh 0 0 0;
        background: url(../images/office.jpg) no-repeat top center fixed;
        background-size: cover;
    }

    .iArticle02Contents {
        position: relative;
        background: #FFFFFF;
        width: calc(950px - 10rem);
        padding: 8rem 0 0 10rem;
    }

    .iArticle02Chars {
        display: block;
        position: absolute;
        right: 5rem;
        bottom: 2.2rem;
        height: 1.3rem;
    }

    .hoissDivider {
        width: 1140px;
    }

    .refContainer {
        width: 1140px;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
    }

    #slider {
        height: 15rem;
        width: 99rem;
        overflow: hidden;
    }

    .footerContents {
        display: flex;
        justify-content: space-between;
        width: 1140px;
        margin: 0 auto;
    }

    .footerLinksColumn {
        width: 25%;
    }

    .footerSigContents {
        display: flex;
        justify-content: space-between;
        width: 1140px;
        margin: 0 auto;
    }
}