#logo {
    float: none;
    position: absolute;
    z-index: 1;
    width: auto;
    max-width: 50%;
    height: auto;
    padding-left: 0%;
    margin-top: -100px;
    margin-left: -110px;
}
#logo.frontpage {
    margin-top: -53px;
    margin-left: 0px;
}

.carousel {
    position: absolute;
    margin-top: 0;
}

* {
    box-sizing: border-box;
}

.clearfix::after {
    content: "";
    clear: both;
    display: table;
}

@font-face {
    font-family: worksans-regular;
    src: url("../fonts/WorkSans-Regular.ttf") format('truetype');
}

@font-face {
    font-family: worksans-semibold;
    src: url("../fonts/WorkSans-SemiBold.ttf") format('truetype');
}

@font-face {
    font-family: worksans-light;
    src: url("../fonts/WorkSans-Light.ttf") format('truetype');
}

@font-face {
    font-family: worksans-thin;
    src: url("../fonts/WorkSans-Thin.ttf") format('truetype');
}

@font-face {
    font-family: worksans-bold;
    src: url("../fonts/WorkSans-Bold.ttf");
}

nav.navbar {
    position: relative;
    padding: 0;
    z-index: 999;
}

.nav-item {
    background-image: linear-gradient(#eeeeee, #ffffff);
    border-style: solid;
    border-right-color: lightslategray;
    border-right-width: 0.5px;
    border-left: none;
    border-top-color: white;
    border-top-width: 0.2px;
    border-bottom-color: lightslategray;
    border-bottom-width: 3px;
    width: 142px;
    height: 49px;
    text-align: center;
}

.nav-item:hover {
    background-image: linear-gradient(#ff9c00, #ff9c00);
    border-style: solid;
    border-right-color: lightslategray;
    border-right-width: 0.5px;
    border-left: none;
    border-top-color: white;
    border-top-width: 0.2px;
    border-bottom-color: #a66600;
    border-bottom-width: 3px;
    color: white;
}

.nav-item.active {
    background-image: linear-gradient(#ff9c00, #ff9c00);
    border-style: solid;
    border-right-color: lightslategray;
    border-right-width: 0.5px;
    border-left: none;
    border-top-color: white;
    border-top-width: 0.2px;
    border-bottom-color: #a66600;
    border-bottom-width: 3px;
    color: white;
}

.nav-link {
    padding-left: 0%;
    padding-right: 0%;
    color: black;
    font-family: worksans-regular;
    line-height: 31px;
    min-height: 49px;
}

.nav-link:hover {
    padding-left: 10%;
    padding-right: 10%;
    color: white;
    font-family: worksans-regular;
}

.nav-link.active {
    color: white;
    font-family: worksans-regular;
}

.dropdown-toggle::after {
    display: none;
}

#navbarResponsive {
    justify-content: flex-end;
}
div#carouselExampleFade {
    /*    border-bottom: 10px solid #eee;*/
}
.dropdown-menu {
    background-color: rgba(0, 0, 0, 0.651);
    width: 200px;
}

.dropdown-item {
    color: white;
    padding: 5%;
    font-size: 12px;
}

.dropdown-item-active {
    font-weight: bold;
}

.dropdown-block {
    border-bottom-style: inherit;
    border-bottom-color: black;
    border-bottom-width: 0.5px;
}
.phone-number-wrapper {
    min-height: 73px;
}

.phone-number {
    position: sticky;
    margin: 0;
    margin-top: 0;
    color: #ff9c00;
    font-family: worksans-semibold;
    font-size: 18px;
    z-index: 999;
    text-align: right;
    padding-top: 23px;
}

.card {
    float: none;
    z-index: 1;
    height: auto;
    padding: 10px;
    border-radius: 0;
    border: none;
    width: 400px;
    border-bottom: 4px solid #f0f0f0;
}

.card-text {
    font-family: worksans-light;
    font-size: 18px;
    color: #848484;
    margin-bottom: 8px;
    margin-top: -3px;
}

.card-title {
    margin-bottom: 0;
}

.card-body .btn-warning {
    font-family: worksans-semibold;
    font-size: 12px;
}

.col {
    margin-left: 2.5%;
}

.row1 {
    margin-top: 31.2%;
    text-align: center;
    max-width: 957px;
}

.card-body {
    border-top: 8px solid #ff9c00;
    padding: 9px 22px 1px 22px;
}

.card-img-top {
    max-height: 180px;
    max-width: 380px;
}

.content {
    background: url("../images/background.png");
    height: auto;
    min-height: 600px;
    background-repeat: no-repeat;
    background-size: auto;
    width: 100%;
    text-align: center;
    margin-top: -135px;
    margin-bottom: 105px;
}

.content-text {
    font-size: 18px;
    padding: 220px 10% 0 10%;
}

.content-text .link {
    font-size: 18px;
}
.title {
    color: #ff9c00;
    font-family: worksans-light;
    font-size: 48px;
    padding-bottom: 64px;
}

.link {
    color: #ff9c00;
    font-family: worksans-semibold;
    font-size: 30px;
}

.title b {
    font-family: worksans-bold;
}

.text {
    width: 100%;
    padding: 0 17%;
    font-family: worksans-regular;
}

div#carouselExampleFade, 
div#carouselExampleFade .carousel-inner,
div#carouselExampleFade .carousel-item,
div#carouselExampleFade .carousel-item-banner {
    height: 939px;
    width: 100%;
    background-position: center;
}

.carousel-item-banner-1 {
    background-image: url("../images/first-slide.jpg");
}
.carousel-item-banner-2 {
    background-image: url("../images/second-slide.jpg");
}
.carousel-item-banner-3 {
    background-image: url("../images/third-slide.jpg");
}
.carousel-item-banner-4 {
    background-image: url("../images/fourth-slide.jpg");
}
.carousel-item-banner-5 {
    background-image: url("../images/fifth-slide.jpg");
}
.carousel-item-banner-6 {
    background-image: url("../images/sixth-slide.jpg");
}
.carousel-item-banner-7 {
    background-image: url("../images/seventh-slide.jpg");
}

.btn-warning {
    background-color: #ff9c00;
    border-bottom: #a66600 solid 3px;
    border-radius: 0;
    color: white;
    font-family: worksans-regular;
    /*    padding: 10px 40px;*/
}

.footer-wrapper {
    max-width: 1272px;
    margin: auto;
    display: flex;
    flex-direction: column;
}

.question {
    margin-top: 54px;
    margin-bottom: 54px;
}

@media (min-width: 34em) {
    .card-columns {
        -webkit-column-count: 3;
        -moz-column-count: 3;
        column-count: 3;
    }
}

.realizovani-projekti {
    margin-top: 64px;
    margin-bottom: 75px;
    color: #ff9c00;
    font-family: worksans-light;
    font-size: 48px;
}

.realizovani-projekti b {
    font-family: worksans-bold;
}

.page-footer {
    height: 210px;
    color: #fff;
}

.gallery {
    width: 100%;
    height: auto;
}

#slider {
    margin-top: -10%;
}

footer {
    background-image: url(../images/top_background.png)
}

.social {
    margin-top: 0;
    margin-left: 2px;
}

.info-bar {
    display: flex;
    justify-content: space-between;
    margin-right: 58px;
    margin-left: 58px;
}

.info-bar p {
    margin: 0;
    align-self: center;
}

.info-bar-tel {
    display: flex;
    width: 500px;
}

.info-bar-tel p {
    font-family: worksans-regular;
    font-size: 18px;
}

.info-bar-tel p:first-child {
    padding-right: 40px;
}


.info-bar-tel p b {
    font-family: worksans-semibold;
}

.info-bar-adresa {
    display: flex;
    width: 500px;
    padding-left: 56px;
    padding-right: 67px;
}

.info-bar-adresa p {
    display: flex;
    width: 100%;
    justify-content: space-around;
}
.info-bar-adresa p span {
    font-family: worksans-regular;
}

.info-bar-logo img {
    width: 187px;
}

.social-wrapper {
    align-self: flex-end;
    margin-top: 40px;
    margin-right: 125px;
}

html {
    width: 100%;
    height: auto;
}

.projects {
    width: 100%;
    height: auto;
    max-width: 957px;
}

.card-deck {
    width: 100%;
    margin-top: 24.5%;
    padding-left: 4%;
}

.page-wrapper {
    max-width: 1272px;
    margin: auto;
}

.hline-card {
    border: 1px solid #e6e6e6;
    box-shadow: 1px 1px 4px 0px rgba(13, 14, 14, 0.04);
}

.hline-cards-deck {
    display: flex;
    justify-content: space-between;
    margin-top: 626px;
}

#sliderCarousel .carousel-control-next, 
#sliderCarousel .carousel-control-prev {
    width: 22px;
}

#sliderCarousel .carousel-control-next {
    right: -60px;
}

#sliderCarousel .carousel-control-prev {
    left: -60px;
}
#sliderCarousel .carousel-inner .carousel-item.active,
#sliderCarousel .carousel-inner .carousel-item-next,
#sliderCarousel .carousel-inner .carousel-item-prev {
    display: flex;
}

#sliderCarousel .carousel-inner .carousel-item-right.active,
#sliderCarousel .carousel-inner .carousel-item-next {
    transform: translateX(33%);
}

#sliderCarousel .carousel-inner .carousel-item-left.active, 
#sliderCarousel .carousel-inner .carousel-item-prev {
    transform: translateX(-33%);
}

#sliderCarousel .carousel-inner .carousel-item-right,
#sliderCarousel .carousel-inner .carousel-item-left{ 
    transform: translateX(0);
}

#sliderCarousel {
    width: 1185px;
}

.realizovani-projekti-wrapper {
    margin-top: 183px;
}



@media screen and (max-width: 1024px) {
    .hline-cards-deck {
        flex-direction: column;
    }
    .hline-card .card {
        margin: auto;
    }
}

@media all and (min-width: 600px) {
    .fancybox-custom-layout .fancybox-bg {
        background: #fcfaf9;
    }

    .fancybox-custom-layout.fancybox-is-open .fancybox-bg {
        opacity: 1;
    }

    .fancybox-custom-layout .fancybox-caption {
        background: #f1ecec;
        bottom: 0;
        color: #6c6f73;
        left: auto;
        padding: 30px 20px;
        right: 44px;
        top: 0;
        width: 256px;
    }

    .fancybox-custom-layout .fancybox-caption h3 {
        color: #444;
        font-size: 21px;
        line-height: 1.3;
        margin-bottom: 24px;
    }

    .fancybox-custom-layout .fancybox-caption a {
        color: #444;
    }

    .fancybox-custom-layout .fancybox-caption::before {
        display: none;
    }

    .fancybox-custom-layout .fancybox-stage {
        right: 300px;
    }

    .fancybox-custom-layout .fancybox-toolbar {
        background: #3b3b45;
        bottom: 0;
        left: auto;
        right: 0;
        top: 0;
        width: 44px;
    }

    .fancybox-custom-layout .fancybox-button {
        background: transparent;
    }

    .fancybox-custom-layout .fancybox-navigation .fancybox-button div {
        padding: 6px;
        background: #fcfaf9;
        border-radius: 50%;
        transition: opacity .2s;
        box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12);
        opacity: .7;
    }

    .fancybox-custom-layout .fancybox-navigation .fancybox-button:not([disabled]):hover div {
        opacity: 1;
    }

    .fancybox-custom-layout .fancybox-navigation .fancybox-button[disabled] {
        color: #999;
    }

    .fancybox-custom-layout .fancybox-navigation .fancybox-button:not([disabled]) {
        color: #333;
    }

    .fancybox-custom-layout .fancybox-button--arrow_right {
        right: 308px;
    }
}

.top-navigation {
    height: 180px;
    background-image: url(../images/top_background.png)
}

.top-navigation__inner {
    max-width: 1272px;
    margin: auto;
}

.sub-page .content{
    margin-top: 0;
    background-image: none;
    max-width: 1272px;
    margin: auto;
    display: flex;
    padding-top: 54px;
    flex-direction: row;
    justify-content: space-between;
}

.content.o-nama {
    flex-direction: column;
    padding-top: 66px;
    font-size: 18px;
    font-family: worksans-regular;
}

.content.o-nama .image-holder {
    margin-bottom: 92px;
}

.o-nama-last-p {
    margin-bottom: 140px;
}

.sub-page .content-left {
    max-width: 260px;
}

.sub-page .content-left ul {
    font-size: 14px;
    color: #787370;
    text-align: left;
    font-weight: bold;
    margin-left: 0;
    padding-left: 0;
}

.sub-page .content-left ul li {
    background: url(../images/point.png) no-repeat left center;
    padding: 0px 0px 0px 10px;
    list-style: none;
    margin: 0;
    margin-bottom: 17px;
}

.sub-page .content-left ul li a {
    font-weight: normal;
    color: #787370;
}
.sub-page .content-left ul li a:hover{
    text-decoration: none;
    font-weight: bold;
}

.sub-page .content-inner {
    max-width: 1010px;
    display: flex;
    flex-direction: column;
}

.sub-page .preview-wrapper {
    height: 550px;
    width: 1010px;
}

.sub-page .thumbs-wrapper {
    display: flex;
    padding-top: 20px;
}

.sub-page .content-inner_thumb{
    margin-right: 21px;
}

.sub-page .sub-page-content-text{
    padding-top: 50px;
    text-align: left;
    padding-bottom: 68px;
    border-bottom: 1px solid #E0E0E0;
}

.contact-form {
    display: flex;
    flex-direction: column;
}

.contact-form-row {
    padding-bottom: 30px;
}

.contact-form-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.contact-field .field-wrapper {
    display: flex;
    flex-direction: row;
    padding: 2px;
    border: 1px solid #a5a5a5;
    border-radius: 5px;
    height: 43px;
    width: 278px;
}

.contact-field .input-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.contact-field .input-wrapper input {
    border: none;
    border-left: 1px solid #e5e5e5;
    padding-left: 11px;
    width: 220px;
    font-family: 'Raleway', sans-serif;
    font-size: 18px;
    line-height: 20px;
}

.contact-field .input-wrapper input:focus {
    outline: none;
}

.contact-field .icon-wrapper {
    margin: auto;
    margin-left: 8px;
    margin-right: 10px;
}

.contact-field::-webkit-input-placeholder {
    color: #3e3e3e;
}

.text-wrapper {
    display: flex;
    flex-direction: row;
    padding: 6px 10px 6px 10px;
    border: 1px solid #a5a5a5;
    border-radius: 5px;
    width: 100%;
}

.text-wrapper .icon-wrapper {
    height: 23px;
    border-right: 1px solid #e5e5e5;
    padding-right: 10px;
    margin-top: 1px;
    margin-bottom: 1px;
}

.textarea-wrapper {
    width: 100%;
}

.text-wrapper textarea {
    border: none;
    padding-left: 11px;
    width: 100%;
    font-family: 'Raleway', sans-serif;
    font-size: 18px;
    resize: none;
    height: 227px;
}

.text-wrapper textarea::placeholder {
    color: #3e3e3e;
}

.text-wrapper textarea::-webkit-input-placeholder {
    opacity: 0.8;
}

.text-wrapper textarea:focus {
    outline: none;
}

.posalji-button {
    height: 43px;
    width: 138px;
    background-image: url(../kontakt/images/button.png);
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    font-size: 18px;
    font-family: "Raleway";
    color: rgb(255, 255, 255);
    font-weight: bold;
}

.orange-header {
    background-color: #ff9c00;
    display: flex;
    height: 66px;
}

.orange-header .orange-header-text {
    font-size: 30px;
    font-family: "Work Sans SemiBold";
    color: rgb(255, 255, 255);
    text-align: left;
    max-width: 1272px;
    width: 100%;
    margin: auto;
}

.sub-page.kontakt .content {
    flex-direction: column;
}

.kontakt-up {
    display: flex;
    padding-top: 32px;
}

.kontakt-up .left-side {
    width: 50%
}

.kontakt-up .right-side {
    width: 50%
}

.address-table {
    font-family: "Work Sans";
    margin-left: 150px;
    font-size: 18px;
    margin-top: 50px;
}

.table-labels {
    text-align: left;
    width: 110px;
    font-family: "Work Sans SemiBold";
}

.table-data {
    text-align: left;
}

.table-data span {
    font-family: "Work Sans SemiBold";
}

.address-table-spacer-1 {
    height: 26px;
}

.address-table-spacer-2 {
    height: 26px;
}

.table-data .telefon-1 {
    margin-right: 20px;
}

.contact-form-row.contact-form-row-3 {
    padding-bottom: 15px;
}

.contact-form-row.contact-form-row-4{
    justify-content: flex-end;
}

.contact-form h2{
    font-size: 24px;
    font-family: "Work Sans SemiBold";
    color: rgb(70, 70, 70);
    font-weight: bold;
    line-height: 1.167;
    text-align: left;
    margin-bottom: 31px;
}

.content.materijali {
    display: flex;
    flex-direction: column;
    padding-top: 168px;
    padding-left: 3px;
    padding-right: 3px;
}

.materijali-1 {
    display: flex;
    justify-content: space-between;
}

.materijali-1-left, .materijali-1-right {
    width: 550px;
}

.materijali-2, materijali-3 {
    flex-direction: column;
}

.materijali-2 {
    padding-top: 177px;
    padding-bottom: 70px;
}

.materijali-2 .materijali-logos {
    max-width: 1182px;
    margin: auto;
    display: flex;
    justify-content: space-between;
    margin-top: 83px;
}

.materijali-up {
    display: flex;
}

.materijali-down {
    padding-top: 34px;
    font-size: 18px;
    font-family: "Work Sans";
    color: rgb(70, 70, 70);
    text-align: left;
    line-height: 28px;
}

.materijali-title {
    font-size: 36px;
    font-family: "Work Sans SemiBold";
    color: rgb(70, 70, 70);
    display: flex;
    flex-direction: column-reverse;
    padding-left: 27px;
    margin-bottom: -12px;
}

.materijali-logos {
    display: flex;
}

.materijali-text {
    font-size: 24px;
    font-family: "Work Sans";
    color: rgb(70, 70, 70);
    text-align: center;
    line-height: 30px;
}

.materijali-text-down {
    font-size: 24px;
    font-family: "Work Sans";
    color: rgb(70, 70, 70);
    text-align: center;
}

.materijali-logos-down {
    display: flex;
    justify-content: space-between;
    max-width: 440px;
    margin-top: 6px;
    margin: auto;
    align-items: center;
}

.materijali-3 {
    margin-top: 75px;
    margin-bottom: 100px;
}

.posalji-upit {
    width: 624px;
    margin-bottom: 189px;
}

.posalji-upit label {
    font-size: 18px;
    font-family: "Work Sans";
    color: rgb(45, 45, 45);
    line-height: 1.444;
    width: 100%;
    text-align: left;
    margin-bottom: 5px;
}

.upit-field input {
    border: 1px solid #b9b9b9;
    width: 300px;
    height: 40px;
}

.posalji-upit .zvjezdica {
    color: red;
}

.posalji-upit h2 {
    text-align: left;
    font-size: 36px;
    font-family: "Work Sans Light";
    color: rgb(247, 151, 0);
    text-transform: uppercase;
    line-height: 0.722;
    margin-top: 68px;
    margin-bottom: 36px;
}

.posalji-upit h2 span {
    font-family: "Work Sans SemiBold";
}

.upit-form-wrapper {
    display: flex;
    justify-content: space-between;
    margin-bottom: 23px;
}

.upit-form-wrapper.upit-form-wrapper-2 {
    margin-bottom: 20px;
}

.upit-form .upit-field {
    text-align: left;
}

.upit-pitanje-wrapper {
    width: 100%;
}

.upit-pitanje-modela {
    width: 100%;
    border: 1px solid #b9b9b9;
    resize: none;
    height: 170px;
}

.upit-obavezna-polja {
    font-size: 14px;
    font-family: "Work Sans";
    color: rgb(45, 45, 45);
    line-height: 1.857;
    text-align: right;
    width: 100%;
}

.upit-button {
    height: 48px;
    width: 188px;
    background-image: url('../images/posalji_proizvod.png');
    font-size: 18px;
    font-family: "Work Sans Medium";
    color: rgb(255, 255, 255);
    line-height: 1.444;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.upit-form-wrapper-3 {
    margin-bottom: 7px;
}

.upit-form-wrapper-4 {
    margin-bottom: -5px;
}

.preview-description {
    background-color: #FE9B23;
    width: 100%;
    height: 58px;
}

@media only screen and (max-width: 1350px) {
    .carousel-item img:first-child {
        display: none!important;
        visibility:hidden;
    }
}

span.email-message {
    text-align: left;
    padding-right: 42%;
    padding-top: 50px;
}

