@charset "UTF-8";
@font-face {
  font-family: Glaser;
  src: url(../font/Glaser_Stencil_D_Regular.ttf);
}
p{
    line-height: 23px;
}

html, body{
    padding: 0!important;
    margin:0!important;
    font-family: ; 
    scroll-behavior: smooth;
    height: 100%;
}

b{
    color: #d9ce45;
}

.odjava a{
    font-size:20px!important;
}

#cookie-law { 
    width:100%;
    position:fixed;
    background:#2750a4; 
    bottom:0;
    z-index:10;
}
 
#cookie-law p { 
    padding:10px; 
    font-size:1.2em; 
    text-align:center; 
    color:#fff; 
    margin:15px 0;
}

#cookie-law a { 
    color:#fff;
    font-weight:bold;
}


#cookie-law a:hover { 
    text-decoration:none;
}


.strelica {
     border-color:transparent;
     border-style:solid;
    border-width:0 2em;
    position: absolute;
     display:block;
     height:0;
     top:50em ;
    left: 42%;
    opacity:0.4;
     text-indent:-9999px;
     transform-origin: 50% 50%;
      width:0;
}

/* Navigacija */ /* Navigacija */ /* Navigacija */ /* Navigacija */
*{margin:0;padding:0;text-decoration:none}

body{background:#555;}

header{
    position:fixed;
    width:100%;
    background:#2750a4;
    height: 60px;
    z-index:9999;
}
    

.logo{
    position:relative;
    z-index: 9;
    margin-left: 150px;
    margin-top: 10px;
    float: left;
    left: 0;
    width: 144px;
    height: 40px;
    background-image: url(../slike/logo_plavo_bijeli_tekst_inverzno_40x144.png);
    background-size: cover;
    background-repeat: no-repeat;
}

.logo a{color:#fff;}

nav{
    position:relative;
    width:1280px;
    margin:0 auto;
    height:60px;
    z-index:99999;
}

nav ul{
    float:right;
     z-index:99999;
}

nav ul li ul{
     z-index:99999;

}

#cssmenu,#cssmenu ul,#cssmenu ul li,#cssmenu ul li a,#cssmenu #head-mobile{
    border:0;
    list-style:none;
    line-height:1;
    display:block;
    position:relative;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;}

#cssmenu:after,#cssmenu > ul:after{
    content:".";
    display:block;
    clear:both;
    visibility:hidden;
    line-height:0;
    height:0;}

#cssmenu #head-mobile{
    display:none;
}

#cssmenu{
    font-family:sans-serif;
    background:#2750a4;
}

#cssmenu > ul > li{float:left}

#cssmenu > ul > li > a{
    padding:15px;
    font-size:15px;
    letter-spacing:1px;
    text-decoration:none;
    color:#ddd;
    font-weight:700;
}

#cssmenu > ul > li:hover > a,#cssmenu ul li.active a{
    color:#fff;
}

#cssmenu > ul > li:hover,#cssmenu ul li.active:hover,#cssmenu ul li.active,#cssmenu ul li.has-sub.active:hover{
    background:#05216d !important;
    -webkit-transition:background .3s ease;
    -ms-transition:background .3s ease;
    transition:background .3s ease;
}

#cssmenu > ul > li.has-sub > a{
    padding-right:30px;
}

#cssmenu > ul > li.has-sub > a:after{
    position:absolute;
    top:22px;
    right:11px;
    width:8px;
    height:2px;
    display:none;
    background:#ddd;
    content:'';
}

#cssmenu > ul > li.has-sub > a:before{
    position:absolute;
    top:19px;
    right:14px;
    display:none;
    width:2px;
    height:8px;
    background:#ddd;
    content:'';
    -webkit-transition:all .25s ease;
    -ms-transition:all .25s ease;
    transition:all .25s ease;
}

#cssmenu > ul > li.has-sub:hover > a:before{
    top:23px;
    height:0;
}

#cssmenu ul ul
{position:absolute;
left:-9999px;
}

#cssmenu ul ul li{
    height:0;
    -webkit-transition:all .25s ease;
    -ms-transition:all .25s ease;
    background:#2750a4;
    transition:all .25s ease;
}


#cssmenu ul ul li:hover{}

#cssmenu li:hover > ul{
    left:auto;
}

#cssmenu li:hover > ul > li{
    height:40px;
}

#cssmenu ul ul ul{
    margin-left:100%;
    top:0;
}

#cssmenu ul ul li{

}

#cssmenu ul ul li a{
    border-bottom:1px solid rgba(150,150,150,0.15);
    padding:11px 15px;
    width:280px;
    font-size:14px;
    text-decoration:none;
    color:#ddd;
    font-weight:400;
}

#cssmenu ul ul li:last-child > a,#cssmenu ul ul li.last-item > a{
    border-bottom:0;
}

#cssmenu ul ul li:hover > a,#cssmenu ul ul li a:hover{
    color:#fff;
}

#cssmenu ul ul li.has-sub > a:after{
    position:absolute;
    top:16px;
    right:11px;
    width:8px;
    height:2px;
    display:block;
    background:#ddd;
    content:'';
}

#cssmenu ul ul li.has-sub > a:before{
    position:absolute;
    top:13px;
    right:14px;
    display:block;
    width:2px;
    height:8px;
    background:#ddd;
    content:'';
    -webkit-transition:all .25s ease;
    -ms-transition:all .25s ease;
    transition:all .25s ease}

#cssmenu ul ul > li.has-sub:hover > a:before{
    top:17px;
    height:0;
}

#cssmenu ul ul li.has-sub:hover,#cssmenu ul li.has-sub ul li.has-sub ul li:hover{background:#363636;}

#cssmenu ul ul ul li.active a{
    border-left:1px solid #2750a4;
}

#cssmenu > ul > li.has-sub > ul > li.active > a,#cssmenu > ul ul > li.has-sub > ul > li.active> a{
    border-top:1px solid #2750a4;
    
}

@media screen and (max-width:1300px){
        nav{
            width:1000px;
        }
        
        .logo{
                margin-left: 0px
        }
}

@media screen and (max-width:1020px){
    
       #gore{
        display: block;
        cursor: pointer;
        z-index:999;
        bottom:0;
        right:0;
        border-radius:80px;
        position:fixed;
    }
    
.logo{
    position:absolute;
    top:0;
    left: 0;
    text-align:center;
    padding:10px 0 0 0 ;
    float:none}
    
.logo2{display:none}
    
nav{
    width:100%;
    height:auto;
    padding:0;
}
    
    ul{
        margin-block-end: 0!important;
    }
#cssmenu{
    width:100%;
}
    
#cssmenu ul{
    width:100%;
    display:none;
    margin-top: 15px;
    }
    
#cssmenu ul li{
    width:100%;
    border-top:1px solid #444
    }
    
#cssmenu ul li:hover{
    background:#05216d;
}
    
#cssmenu ul ul li,#cssmenu li:hover > ul > li{
    height:auto;
    margin:0;
    padding:0;
}

#cssmenu ul li a,#cssmenu ul ul li a{
    width:100%;
    border-bottom:0;
}
    
#cssmenu > ul > li{
    float:none;
}
    
#cssmenu ul ul li a{
    padding-left:25px;
}
    
#cssmenu ul ul li{
    background:#2750a4!important;
}
    
#cssmenu ul ul li:hover{
    background:#363636!important;
    }
    
#cssmenu ul ul ul li a{
    padding-left:35px;
    }
    
#cssmenu ul ul li a{
    color:#ddd;
    background:none;
    }
    
#cssmenu ul ul li:hover > a,#cssmenu ul ul li.active > a{
    color:#fff;
    }
    
#cssmenu ul ul,#cssmenu ul ul ul{
    position:relative;
    left:0;
    width:100%;
    margin:0;
    text-align:left
    }
    
#cssmenu > ul > li.has-sub > a:after,#cssmenu > ul > li.has-sub > a:before,#cssmenu ul ul > li.has-sub > a:after,#cssmenu ul ul > li.has-sub > a:before{
    display:none;
}
    
#cssmenu #head-mobile{
    display:block;
    padding:23px;
    color:#ddd;
    font-size:12px;
    font-weight:700;
}
    
.button{
    width:55px;
    height:46px;
    position:absolute;
    right:0;
    top:8px;
    cursor:pointer;
    z-index: 12399994;
}
    
.button:after{
    position:absolute;
    top:22px;
    right:20px;
    display:block;
    height:4px;
    width:20px;
    border-top:2px solid #dddddd;
    padding-bottom:4px;
    border-bottom:2px solid #dddddd;
    content:'';
}
    
.button:before{
    -webkit-transition:all .3s ease;
    -ms-transition:all .3s ease;transition:all .3s ease;
    position:absolute;
    top:16px;
    right:20px;
    display:block;
    height:2px;
    width:20px;
    background:#ddd;
    content:'';
}
    
.button.menu-opened:after{
    -webkit-transition:all .3s ease;
    -ms-transition:all .3s ease;
    transition:all .3s ease;
    top:23px;border:0;
    height:2px;width:19px;
    background:#fff;
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    transform:rotate(45deg);
    padding:0;
}
    
.button.menu-opened:before{
    top:23px;
    background:#fff;
    width:19px;
    -webkit-transform:rotate(-45deg);
    -moz-transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
    -o-transform:rotate(-45deg);
    transform:rotate(-45deg);
    padding-bottom:none;
}
    
#cssmenu .submenu-button{
    position:absolute;
    z-index:99;
    right:0;
    top:0;
    display:block;
    border-left:1px solid #444;
    border-left:1px solid #444;
    height:60px;
    padding: 7px;
    width:60px;
    cursor:pointer}
    
#cssmenu .submenu-button.submenu-opened{
    background:#05216d;
}
    
#cssmenu ul ul .submenu-button{
    height:34px;
    width:34px;
    }
    
#cssmenu .submenu-button:after{
    position:absolute;
    top:30px;
    right:26px;
    width:8px;
    height:2px;
    display:block;
    background:#ddd;
    content:'';
}
    
#cssmenu ul ul .submenu-button:after{
    top:15px;
    right:13px;
    }
    
#cssmenu .submenu-button.submenu-opened:after{
    background:#fff;
    }
    
#cssmenu .submenu-button:before{
    position:absolute;
    top:27px;
    right:29px;
    display:block;
    width:2px;
    height:8px;
    background:#ddd;
    content:'';
}
    
#cssmenu ul ul .submenu-button:before{
    top:12px;
    right:16px;
}
    
#cssmenu .submenu-button.submenu-opened:before{
    display:none;
}
    
#cssmenu ul ul ul li.active a{
    border-left:none;
}
    
#cssmenu > ul > li.has-sub > ul > li.active > a,#cssmenu > ul ul > li.has-sub > ul > li.active > a{
    border-top:none;
}
}

/* Kraj navigacije */ /* Kraj navigacije */ /* Kraj navigacije */

/* Fa font */ /* Fa font */ /* Fa font */ /* Fa font */
i{
    font-size: 20px;
    padding: 5px;
}

#gore{
    display: none;
    cursor: pointer;
}
/* Pozadina */ /* Pozadina */ /* Pozadina */ 
.aktivna{
    background-color: #05216d !important;
    color: #fff !important;
}
/* Pozadina Naslovna */
#pozadina{
    width: 100%;
    margin-top: 0px;
    height:938px;
    background-image: url(../slike/bg_plava.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    text-align: center;
    display: grid;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        ". pozadina_naslov ."
        ". pozadina_tekst ."
        ;
}

#pozadina_naslov{
    grid-area: pozadina_naslov;
}

#pozadina_naslov h1{
    font-size: 15em;
    margin-top: 300px;
    font-weight: bold;
    margin-bottom: -300px;
    color: #fff;
    font-family: Glaser;
;
    
}

#pozadina_tekst{
    grid-area: pozadina_tekst;}
#pozadina_tekst p{


    font-size: 3em;
    line-height: 50px;
    color: #fff;
    font-family: arial;
}

/* Pozadina O nama */
#pozadina_o_nama{
    width: 100%;
    height:200px;
    background-image: url(../slike/o_nama_bg_plava.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    text-align: center;
    display: grid;
    line-height: 110px;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        ". pozadina_naslov_o_nama ."
        ;    
}


/* Pozadina O nama */
#pozadina_nalog{
    width: 100%;
    height:200px;
    background-image: url(../slike/papir.jpg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    text-align: center;
    display: grid;
    line-height: 110px;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        ". pozadina_naslov_o_nama ."
        ;    
}

#pozadina_naslov_o_nama{
    grid-area: pozadina_naslov_o_nama;
}

#pozadina_naslov_o_nama h1{
     font-size: 8em;
    margin-top: 150px;
    font-weight: bold;
    line-height: 80px;
    margin-bottom: -200px;
    color: #fff;
}




/* Pozadina projektiranje */
#pozadina_projektiranje{
    width: 100%;
    height:200px;
    background-image: url(../slike/sucelje.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    text-align: center;
    display: grid;
    line-height: 110px;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        ". pozadina_naslov_projektiranje ."
        ;    
}

#pozadina_naslov_projektiranje{
    grid-area: pozadina_naslov_projektiranje;
}

#pozadina_naslov_projektiranje h1{
     font-size: 7em;
    margin-top: 10px;
    font-weight: bold;
    line-height: 100px;
    margin-bottom: -200px;
    color: #fff;
}


/* Pozadina Narudzbe */
#pozadina_narudzbe{
    width: 100%;
    height:200px;
    background-image: url(../slike/o_nama_bg_plava.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    text-align: center;
    display: grid;
    line-height: 110px;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        ". pozadina_naslov_narudzbe ."
        ;    
}

#pozadina_naslov_narudzbe{
    grid-area: pozadina_naslov_narudzbe;
}

#pozadina_naslov_narudzbe h1{
     font-size: 8em;
    margin-top: 150px;
    font-weight: bold;
    line-height: 80px;
    margin-bottom: -200px;
    color: #fff;
}


/* Pozadina Nadogradnje */
#pozadina_nadogradnje{
    width: 100%;
    height:200px;
    background-image: url(../slike/nadogradnje.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    text-align: center;
    display: grid;
    line-height: 110px;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        ". pozadina_naslov_nadogradnje ."
        ;    
}

#pozadina_naslov_nadogradnje{
    grid-area: pozadina_naslov_nadogradnje;
}

#pozadina_naslov_nadogradnje h1{
     font-size: 8em;
    margin-top: 150px;
    font-weight: bold;
    line-height: 80px;
    margin-bottom: -200px;
    color: #fff;
}


/* Pozadina Narudzbe */
#pozadina_narudzbe{
    width: 100%;
    height:200px;
    background-image: url(../slike/o_nama_bg_plava.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    text-align: center;
    display: grid;
    line-height: 110px;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        ". pozadina_naslov_narudzbe ."
        ;    
}

#pozadina_naslov_narudzbe{
    grid-area: pozadina_naslov_narudzbe;
}

#pozadina_naslov_narudzbe h1{
     font-size: 8em;
    margin-top: 150px;
    font-weight: bold;
    line-height: 80px;
    margin-bottom: -200px;
    color: #fff;
}


/* Pozadina Aplikacije */
#pozadina_aplikacije{
    width: 100%;
    height:200px;
    background-image: url(../slike/kod2.jpeg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    text-align: center;
    display: grid;
    line-height: 110px;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        ". pozadina_naslov_aplikacije ."
        ;    
}

#pozadina_naslov_aplikacije{
    grid-area: pozadina_naslov_aplikacije;
}

#pozadina_naslov_aplikacije h1{
     font-size: 8em;
    font-weight: bold;
    line-height: 100px;
    margin-bottom: -200px;
    color: #fff;
}

/* Pozadina Programi */
#pozadina_programi{
    width: 100%;
    height:200px;
    background-image: url(../slike/o_nama_bg_plava.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    text-align: center;
    display: grid;
    line-height: 110px;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        ". pozadina_naslov_programi ."
        ;    
}

#pozadina_naslov_programi{
    grid-area: pozadina_naslov_programi;
}

#pozadina_naslov_programi h1{
     font-size: 8em;
    margin-top: 150px;
    font-weight: bold;
    line-height: 80px;
    margin-bottom: -200px;
    color: #fff;
}


/* Pozadina Programi */
#pozadina_servis{
    width: 100%;
    height:200px;
    background-image: url(../slike/ram.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 25% 40%;
    text-align: center;
    display: grid;
    line-height: 110px;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        ". pozadina_naslov_servis ."
        ;    
}

#pozadina_naslov_servis{
    grid-area: pozadina_naslov_servis;
}

#pozadina_naslov_servis h1{
     font-size: 8em;
    margin-top: 60px;
    font-weight: bold;
    line-height: 100px;
    margin-bottom: -200px;
    color: #fff;
}



/* Pozadina Proizvodnja */
#pozadina_proizvodnja{
    width: 100%;
    height:200px;
    background-image: url(../slike/ormar.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    text-align: center;
    display: grid;
    line-height: 110px;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        " . pozadina_naslov_proizvodnja . "
        ;    
}

#prazni70{
    display:block;
    height:60px;
    width:100%;
}


.prazni200{
    height:200px;
    width:100%;
}
#pozadina_naslov_proizvodnja{
    grid-area: pozadina_naslov_proizvodnja;
}

#pozadina_naslov_proizvodnja h1{
     font-size: 8em;
    margin-top: 100px;
    font-weight: bold;
    line-height: 80px;
    margin-bottom: -200px;
    color: #fff;
}


/* Pozadina Oprema */
#pozadina_oprema{
    width: 100%;
    height:200px;
    background-image: url(../slike/o_nama_bg_plava.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    text-align: center;
    display: grid;
    line-height: 110px;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        ". pozadina_naslov_oprema ."
        ;    
}

#pozadina_naslov_oprema{
    grid-area: pozadina_naslov_oprema;
}

#pozadina_naslov_oprema h1{
     font-size: 8em;
    margin-top: 150px;
    font-weight: bold;
    line-height: 80px;
    margin-bottom: -200px;
    color: #fff;
}


/* Pozadina Sklapanje */
#pozadina_sklapanje{
    width: 100%;
    height:200px;
    background-image: url(../slike/sklapanje.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    text-align: center;
    display: grid;
    line-height: 110px;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        ". pozadina_naslov_sklapanje ."
        ;    
}

#pozadina_naslov_sklapanje{
    grid-area: pozadina_naslov_sklapanje;
}

#pozadina_naslov_sklapanje h1{
     font-size: 8em;
    margin-top: 60px;
    font-weight: bold;
    line-height: 100px;
    margin-bottom: -200px;
    color: #fff;
}


/* Pozadina Pso*/
#pozadina_pso{
    width: 100%;
    height:200px;
    background-image: url(../slike/o_nama_bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    text-align: center;
    display: grid;
    line-height: 110px;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        "pozadina_naslov_pso pozadina_naslov_pso pozadina_naslov_pso"
        ;    
}

#pozadina_naslov_pso{
    grid-area: pozadina_naslov_pso;
}

#pozadina_naslov_pso h1{
     font-size: 6.2em;
    margin-top: 150px;
    font-weight: bold;
    line-height: 80px;
    margin-bottom: -200px;
    color: #fff;
}

/* Pozadina web*/
#pozadina_web{
    width: 100%;
    height:200px;
    background-image: url(../slike/kod_1920.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    text-align: center;
    display: grid;
    line-height: 110px;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        ". pozadina_naslov_web ."
        ;    
}

#pozadina_naslov_web{
    grid-area: pozadina_naslov_web;
}

#pozadina_naslov_web h1{
     font-size: 6.2em;
    margin-top: 150px;
    font-weight: bold;
    line-height: 80px;
    margin-bottom: -200px;
    color: #fff;
}

/* Pozadina kontakt */
#pozadina_kontakt{
    width: 100%;
    height:200px;
    background-image: url(../slike/bg_kontakt_plava.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    text-align: center;
    display: grid;
    line-height: 110px;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        ". pozadina_naslov_kontakt ."
        ;    
}

#pozadina_naslov_kontakt{
    grid-area: pozadina_naslov_kontakt;
}

#pozadina_naslov_kontakt h1{
     font-size: 6.2em;
    margin-top: 150px;
    font-weight: bold;
    line-height: 80px;
    margin-bottom: -200px;
    color: #fff;
}

/* Pozadina Industrija elektronika */
#pozadina_ind{
    width: 100%;
    height:338px;
    background-image: url(../slike/ind_bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-position:bottom;
    text-align: center;
    display: grid;
    line-height: 110px;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        "pozadina_naslov_ind pozadina_naslov_ind pozadina_naslov_ind"
        ;    
}

#pozadina_naslov_ind{
    grid-area: pozadina_naslov_ind;
}

#pozadina_naslov_ind h1{
     font-size: 6.3em;
    margin-top: 150px;
    font-weight: bold;
    line-height: 80px;
    margin-bottom: -200px;
    color: #fff;
}




/* Usluge */ /* Usluge */ /* Usluge */ /* Usluge */
#flex_slike{
    display:flex;
    width:100%;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
}

.flex_slika{
    width:500px;
    margin:20px;
}

#flex-usluge{
    display:flex;
    width:100%;
    margin:100px auto 100px auto;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
}

#usluge{
    width:100%;
    height:50px;
}

.flex-usluge{
    width:400px;
    height:200px;
    align-self:center;
    margin:20px;
    text-align:left;

}

.flex-usluge a{
    display:block;
    color:black;
    text-decoration:none;
}

.flex-usluge a:hover{
        text-decoration:none;
        color:black
}

.flex-usluge i{
    font-size:70px;
    float:left;
    margin-bottom:250px;
    color:#2750a4;
}
.flex-usluge i:last-of-type{
    margin-left:10px;
    margin-right:10px;
}

.fa-question-circle{

}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    margin: 0;
    color: #232a34;
    -ms-word-wrap: break-word;
    word-wrap: break-word;
}
h1, .h1 {
    font-size: 45px;
    line-height: 55px;
    padding: 0 0 40px 0;
    font-weight: 100;
}
h2, .h2 {
    font-size: 40px;
    line-height: 49px;
    padding: 0 0 40px 0;
    font-weight: 100;
}
h3, .h3 {
    font-size: 30px;
    line-height: 37px;
    padding: 0 0 30px 0;
    font-weight: 100;
}
h4, .h4 {
    font-size: 25px;
    line-height: 30px;
    padding: 0 0 5px 0;
    font-weight: 100;
}
h5, .h5 {
    font-size: 14px;
    line-height: 19px;
    padding: 0 0 25px 0;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
}
h6, .h6 {
    font-size: 14px;
    line-height: 19px;
    padding: 0 0 13px 0;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}


.usluge{
    padding: 60px 0px;
    margin: 0 auto;
    text-align: center;
    color: #6c6c6c;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.usluge-kutija{
    display: inline-block;
    padding: 20px;
    width: 400px;
    margin-bottom: 20px;
    border-bottom: 1px dashed #dfe0e1;
    padding-top: 40px;
}
.usluge-kutija:hover{
    background: #f2f2f2;
    cursor: pointer;
    transition: all 1s;
    -moz-transition: all 1s; 
    -webkit-transition: all 1s;
    -o-transition: all 1s; 
}
.usluge-kutija:hover i{
    background: #083765;
    border-radius: 100px;
    transition: all 1s;
    -moz-transition: all 1s; 
    -webkit-transition: all 1s; 
    -o-transition: all 1s; 
}

.slika3{
    max-width:100%;
}

.ikona{
    padding: 0px;
    float:left ;
    margin-right: 20px;
    padding-bottom:200px!important;
}
.ikona i{
    width: 70px;
    height: 70px;
    background: #2750a4;
    color: #ffffff;
    line-height: 70px;
    text-align: center;
    font-size: 44px;
}
.usluge-tekst a{
    font-size: 17px!important;
    color:!important;
    display:block;
    padding:10px 0;
    text-decoration:none!important;
}

.usluge-tekst a:hover{
    color:red;
}
.usluge-tekst h4{
    font-size: 18px;
    font-family: 'Roboto', sans-serif!important;   
    font-weight: 900;
    height: 35px;
}

.narudzbe{
        text-align: center;
}

.hr{
    width: 100px;
    height: 5px;
    margin:5px auto;
    background-color:#2a49cc ;
}
.hr2{
    width: 100px;
    height: 5px;
    margin:5px auto;
    background-color:white ;
}

.tv_fix{
    display:none;
}

#tv{
   text-align:center; 
   width:500px;
   margin:10px;
}
/* Tablica*/
#tablica{
    width:100%;
    text-align:center;
}

#tablica table{
    margin:20px auto;
    width:1000px;
    text-align:left;
}

#tablica table th, table td{
    padding:10px;
}

#tablica table th{
    background-color:#2750a4;
    color:white;
}

#tablica table tr:nth-of-type(odd){
    background-color:#a7d6ff;
}

#tablica h4{
    text-align:center;
}
/* O nama*/ /* O nama*/ /* O nama*/ /* O nama*/
#o_nama{
    display: grid;
    width: 100%;
    height: 70%;
    grid-template-columns:repeat(2,1fr);
    grid-template-areas: 
        "o_nama_slika o_nama_tekst" 
}

#o_nama_tekst{
    grid-area: o_nama_tekst;
    text-align: center;
    background-color: #2750a4;
    height: 100%;
}

#o_nama_tekst p{
    margin: 0 auto;
    width: 80%;
    font-size: 17px;
    color: white;
    position: relative;
    top: 18%;
}

#o_nama_tekst h1{
    color: white;
    position: relative;
    top: 25%;
}

.plutanje{
    width:100%;
    margin:50px auto;
}

.plutanje_d{
    width:50%;
}
.plutanje_l{
    width:50%;
    
}


#o_nama_slika{
    grid-area: o_nama_slika;
    background-image: url(../slike/o_nama.jpg);
    background-size: cover;
    background-position: center;
    height: 100%;
}
.slika2{
    max-width:100%;
    display:none;
}
#o_nama_tekst a{
    border: 2px solid white;
    color: white;
    text-decoration: none;
    padding: 10px 30px;
}

#o_nama_tekst a:hover{
     border: 2px solid #083765;
    background-color: #083765;
    transition: 0.5s;
}

input[type=text]{
    height:20px!important;
}

/* sadrzaj */
#sadrzaj{
    width: 100%;
    text-align: center;
}

#sadrzaj p{
    width: 50%; 
    margin:-50px auto 0 auto;
    padding: 15px;
    line-height: 25px;
    font-size: 17px;
    color: #6c6c6c
}

#sadrzaj img{
    max-width: 40%;
    margin-bottom: 50px;
}

#paralax{
    width: 100%;
    height: 400px;
    background-image: url(../slike/parallax.jpg);
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

/* Paralax*/ /* Paralax*/ /* Paralax*/ /* Paralax*/

#paralax h3{
    text-align: center;
    color: white;
    position: relative;
    top:50%;
    font-size: 25;
    font-weight: bold;
}

/* Novosti*/ /* Novosti*/ /* Novosti*/ /* Novosti*/

#novosti{
    display: flex;
     margin: 0 auto;
    flex-wrap: wrap;
    width: 100%;
    justify-content: center;
    align-content: center;
    
}

#novost{
    position: relative;
    height: 300px;
    width: 500px;
    background-color: #2750a4;
    align-self: center;
    margin: 5px;
    color: white;
    cursor: pointer;
}

#novost:hover{
    position: relative;
    background-color: #083765;
    transition: 0.5s;
    color:#0877c7;
    margin-top: -15px;
        box-shadow: 5px 5px 10px ;
}

#novost_naslov{
    text-align: center;
    padding-top: 20px;
}

#novost_naslov h3{
    color: #ffffff;
}

#novost_tekst{
    text-align: center;
    font-size: 17px;
    padding: 5px;
}

#novost_datum{
    text-align: right;
    padding: 5px;
    position: absolute;
    bottom: 0px;
    right: 0px;
    color: #ffffff;
    border-top: thin solid #29a1f8;
    width: 98%;
}

.centar{
    text-align: center;
}

/* Programi */ /* Programi */ /* Programi */ /* Programi */
#programi-container{
    display:flex;
    flex-wrap:wrap;
    width:80%;
    margin:auto;
    justify-content:center;
    align-content:center;
}


#programi-container a{
    text-decoration:none;
    
}

.program{
    padding:20px;
    align-self:center;
    width:400px;
    text-align:center;
}

.program i{
    margin-top:35px;
    font-size:80px;
    color:#2750a4;

}

.program img{
    margin-top:35px;
    width:100px;
}

.program:hover{
    background-color:#f2f2f2;
    transition:0.5s;
}

.program h1{
    font-size:25px!important;
}

/* Oprema */ /* Oprema */ /* Oprema */ /* Oprema */
#oprema-container{
    display:flex;
    flex-wrap:wrap;
    width:80%;
    margin:auto;
    justify-content:center;
    align-content:center;
}

#oprema-container a{
    text-decoration:none;
    
}

.oprema{
    margin:20px;
    align-self:center;
    width:400px;
    text-align:center;
}

.oprema i{
    margin-top:35px;
    font-size:80px;
    color:#2750a4;

}

.oprema img{
    width:100px;
    margin-top:35px;

}

.oprema:hover{
    background-color:#f2f2f2;
    transition:0.5s;
}

.oprema h1{
    font-size:25px!important;
}

.container_suzavanje{
    width:90%;
    z-index:-1;
    margin:auto;
}

input{
    z-index:-1!important;
}
/* Footer*/ /* Footer*/ /* Footer*/ /* Footer*/
footer{
   /* background-color: #083765;*/
    background-color: #2750a4!important;
    border-top:1px solid white;
}
#footer{
    width: 100%!important;
    padding-top: 0px!important;
    padding-bottom: 0px!important;
    margin: auto!important;
    text-align: center!important;
    background-color: #2750a4!important;
    display: flex!important;
    margin: 0 auto 0 auto!important;
    flex-wrap: wrap!important;
    justify-content: center!important;
    align-content: center!important;
  
}

input[type=submit]{
    cursor:pointer;
}

.tv{
    max-width: 100%;
    position: relative;
    top: 25%;
}
#box1{
    display:block;
    text-align: center!important;
    width: 400px!important;
    padding: 10px!important;
}

#box1 a{
    display:block;
    display: block!important;
    color: white!important;
    text-decoration: none!important;
    font-size: 17px!important;
    padding: 10px!important;
}

#box1 h4{
    display: block!important;
    color: white!important;
    
    text-decoration: none!important;
}
#box3{
    width: 400px!important;
    color: white!important;
    padding: 10px!important;
}

#box3 img{
    margin-top:44px!important;
}

#box2{
    width: 400px!important;
    color: white!important;
    padding: 10px!important;
}

#box2 h4{
    color: white!important;
    padding-bottom:10px!important;
}


#box2 p{
    font-size: 17px!important;
    line-height:10px!important;
}

#box2 p a{
        line-height:10px!important;
        margin-bottom:-20px!important;

}


#box2 p a:hover{
        color:red;
}

#box2 p a{
        color:white;
}


#box2 a:hover{
    color:red!important;
    text-decoration:none;line-height:10px!important;
}

.fa-envelope{
    margin-top:10px!important;
}

.btn-send{
    background:gray!important;
}

#copyright{
    width: 100%!important;
    height: 50px!important;
    background-color: #2a49cc!important;
    margin-top: -16px!important;
    margin-bottom: 0px!important;
}

#copyright p{
    text-align: center!important;
    color: #fff!important;
    line-height:50px;
    margin-bottom:-20px;
    padding:0px!important;
    font-size: 17px!important;
    font-weight: bold!important;
}


/* ----------------------------

Odrzavanje IT sustava

-------------------------------*/
#sadrzaj_odrzavanje_it_sustava{
    width:100%;
    text-align:center;
}

#sadrzaj_odrzavanje_it_sustava h2{
    text-align:center;
    margin-top:50px;
    
}


#sadrzaj_odrzavanje_it_sustava p{
    width:50%;
    margin:auto;
}

#sadrzaj_odrzavanje_it_sustava img{
    margin:0 auto!important;
    max-width:90%;
}


/* ----------------------------

Servis IT opreme

-------------------------------*/
#servis_it_opreme{
    width:100%;
    text-align:center;
}

#servis_it_opreme h2{
    text-align:center;
    margin-top:50px;
    
}


#servis_it_opreme p{
    width:50%;
    margin:auto;
}

#servis_it_opreme img{
    margin:0 auto!important;
}

/* ----------------------------

Razvoj poslovnih alpikacija

-------------------------------*/
#razvoj_poslovnih_apk{
    width:100%;
    text-align:center;
}

#razvoj_poslovnih_apk h2{
    text-align:center;
    margin-top:50px;
    
}

#razvoj_poslovnih_apk p{
    width:40%;
    margin:auto;
    text-align:left;
    text-indent:50px;
    padding-top:15px;
}

#razvoj_poslovnih_apl img{
    margin:0 auto!important;
}
/* ----------------------------

Sklapanje računala

-------------------------------*/
#sklapanje_racunala{
    width:100%;
    text-align:center;
}

#sklapanje_racunala h2{
    text-align:center;
    margin-top:50px;
    
}

#sklapanje_racunala p{
    width:50%;
    margin:auto;
}

#sklapanje_racunala img{
    max-width:90%;
    margin:0 auto!important;
}
/* ----------------------------

Narogradnje

-------------------------------*/
#nadogradnje{
    width:100%;
    text-align:center;
}

#nadogradnje h2{
    text-align:center;
    margin-top:50px;
    
}

#nadogradnje p{
    width:50%;
    margin:auto;
}

#nadogradnje img{
    margin:0 auto!important;
    max-width:90%;
}
/* ----------------------------

Sklapanje računala

-------------------------------*/
#sklapanje_racunala{
    width:100%;
    text-align:center;
}

#sklapanje_racunala h2{
    text-align:center;
    margin-top:50px;
    
}

#sklapanje_racunala p{
    width:50%;
    margin:auto;
}

#sklapanje_racunala img{
    margin:0 auto!important;
}

/* ----------------------------

Status naloga

-------------------------------*/
#status_naloga{
    width:100%;
    text-align:center;
}

#status_naloga h2{
    text-align:center;
    margin-top:50px;
    
}

#status_naloga a:hover{
    text-decoration:none;
}


#status_naloga img{
    margin:0 auto!important;
}

.odjava a:hover{
    text-decoration:none!important;
}
/* ----------------------------

Stranica o nama

-------------------------------*/

#sadrzaj_o_nama{
    width: 100%;
    text-align: center;
}

#sadrzaj_o_nama p{
    width: 50%;
    text-align: center;
    margin: 0 auto;
    padding: 15px;
    color: #6c6c6c;

}

#sadrzaj_o_nama h1{
    text-align: center;
    margin-top:50px;
}

#sadrzaj_o_nama img{
    max-width: 50%;
    padding-top: 50px;

}

/* ----------------------------

Sklopovi
-------------------------------*/

#sklopovi{
    width:100%;
    text-align:center;
}

#sklopovi p{
    width:50%;
    margin:auto;
}

#sklopovi h1{
    margin-top:50px;
}


#naprave{
    width:100%;
    text-align:center;
}

#naprave2{
    width:100%;
    text-align:center;
}

#naprave2 p{
    width:50%;
    margin:auto;
}

#naprave2 h1{
    margin-top:50px;
}
/* ----------------------------

Stranica Web stranice

-------------------------------*/

#web_usluge{
    display: flex;
    justify-content: center;
    align-content: center;
    flex-wrap: wrap;
    width: 100%;
    text-align: center;
}

.web_usluge{
    align-self: center;
    width: 400px;
    padding: 20px;
    margin: 20px;
}

.web_usluge img{
    width: 250px;
}

#web{
    display: grid;
    width: 60%;
    margin: auto;
    height: 50%;
    color: #6c6c6c!important;
    grid-template-columns:repeat(2,1fr);
    grid-template-areas: 
        "web_tekst web_slika" 
}

#web_tekst{
    grid-area: web_tekst;
    text-align: center;
    background-color: #fff;
    height: 100%;
    color: #6c6c6c!important;

}

#web_tekst p{
    margin: 0 auto;
    width: 90%;
    color: #6c6c6c!important;
    font-size: 17px;
    color: black;
    position: relative;
    top: 30%;
}

#web_tekst h1{
    color: white;
    position: relative;
    top: 30%;
}

#web_slika{
    grid-area: web_slika;
    background-image: url(../slike/web_stranica.jpg);
    background-size: cover;
    background-position: center;
    height: 100%;
}

#boja2{
    background-color: #e5ebf7;
    margin-top: -21px;
    height:600px;
}
/* ----------------------------

Stranica podrška

-------------------------------*/
.fa-flag{
    color:white;
    margin-top: 25px;
    margin-bottom: 25px;
    padding: 30px;
    background-color: #0877c7;
    font-size: 45px;
    border-radius: 50%;
}

.fa-tools{
    color:white;
    margin-top: 25px;
    margin-bottom: 25px;
    padding: 30px;
    background-color: #aa1818;
    font-size: 45px;
    border-radius: 50%;
}



#kutije{
    width: 90%;
    margin: 0px auto 100px auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
    top: 100px;
}

#prazni50{
    height:50px;
    width:100%;
}

#prazni30{
    height:30px;
    width:100%;
}
.prazni{
    width: 100%;
    height: 100px;
}

.prazni50{
    height:50px;
    width:100%;
}

.prazni75{
    height:75px;
    width:100%;
}


#kutije2{
    width: 90%;
    margin: 100px auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;
   
}

#podrska_box{
    text-align: center;
    width: 500px;
    padding-top: 20px;
    align-self: center;
    margin: 15px;
    box-shadow: 1px 1px 1px 1px #2a49cc;
    transition: 0.2s;
    
}

#podrska_box p{
    font-size: 20px;
}


#podrska_box h2{
    color:black;
}

#podrska_box h2:hover{
    text-decoration:none!important;
}

#podrska_box a{
    color:black;
    display:block;
    padding-top:11px;
    padding-bottom:20px;
    font-size:30px;
}

#podrska_box a:hover{
    text-decoration:none!important;
}


#podrska_box img{
    max-width:200px;; 
}

#podrska_box:hover{
    box-shadow: 1px 1px 3px 3px #b3baf0;
    margin-top: -5px;
}

#bg{
    width: 100%;
    background-color: #f8f7f7;
}

#pitanja_box{
    text-align: center;
    width: 450px;
    height: 200px;
    background-color: rgba(8, 119, 199, 0.35);
    align-self: center;
    margin: 15px;
}

#pitanja_box h4{
    border-bottom: thin dashed #0877c7;
    padding: 10px;
}

/* ----------------------------

Stranica trgovina

-------------------------------*/
#trgovina{
    width:60%;
    margin:auto;
    background-color:white;
    text-align:center;
}
.trgovina_tablica{
    margin:0 auto;
    background-color:red!important;
}
/* ----------------------------

Ispisi

-------------------------------*/
.box_table{
    width:100%;
}

.tabledata{
    padding:10px;
    
}
/* ----------------------------

Stranica kontakt

-------------------------------*/


#grid_onama{
    display: grid;
    width:60%;
    margin:50px auto;
    grid-template-columns: repeat(2,1fr);
    grid-template-areas: 
    "container radno_vrijeme";
}

.container{
    grid-area:container!important;
    text-align:center;
}

.radno_vrijeme{
    grid-area:radno_vrijeme;
    text-align:center;
}

.radno_vrijeme h2{
    padding-top:50px;
}
#kontakt_cijeli{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    grid-template-areas: 
        "kontakt kontakt podaci"
;

}

#kontakt{
    width: 80%;
    margin: 0 auto;
    grid-area: kontakt;
    
}

#podaci{
    grid-area: podaci;
    width: 100%;
    margin: 0 auto;
    text-align: left;
}

#podaci p{
    font-size: 20px;
    color: #6e6e6e
}

.z-index{
    z-index: 9;
}

#podaci i{
    font-size: 30px;
    padding: 10px;
    
    color: #396da5
}

label{
    display: block;
    font-size: 18px;
    color: #6e6e6e;
}

input[type=text]{
    border: none;
    border: thin solid #c7c0c0;
    width: 100%;
    margin-bottom: 20px;
    padding: 20px 10px;
}



input[type=submit]:hover{
    background-color: #083765;
    transition: 0.5s;
}


input[type=submit]{
    padding: 8px 15px;
    background-color: #0877c7;
    color: white;
    border: none;
    float: right;
    cursor: pointer
}


#ime_prezime{
    display: grid;
    width: 99.5%;
    grid-template-columns: repeat(2,1fr);
    grid-template-areas: 
        "ime prezime"
}

#ime{grid-area: ime;}

#prezime{grid-area: prezime;}

textarea{
    width: 50%;
    border: none;
    border: thin solid #c7c0c0;
    height: 200px;
}

/* Mobilna*/ /* Mobilna*/ /* Mobilna*/ /* Mobilna*/
@media screen and (max-width:1300px){

        .nav-list{
            margin-top: 10px!important;
    }
}


@media screen and (max-width:1100px){
        #web{
        grid-template-columns: repeat(1,1fr);
        width: 100%;
        grid-template-areas: 
            "web_tekst"
            "web_slika"
    }
    
    #boja2{
        height: auto;
        background-color:#fff;
    }
    
    #web_slika{
        height:200px;
        margin-top:100px;
    }
    
    #boja3{
        margin-top: 0;
        width: 100%;
        background-color:white
    }

        #box2, #box1, #box3{
        padding: 50px 0;
    }
    
    #grid_onama{
        grid-template-columns: repeat(1,1fr);
        width: 100%;
        grid-template-areas: 
            "container"
            "radno_vrijeme"
    }

}
@media screen and (max-width:1000px){
    #tablica table{
        width:90%;
    }

}
@media screen and (max-width:800px){
    
        #tablica p{
        text-align:left;
        width:90%;
        margin:auto;
    }
    
    #nadogradnje p{
    width:90%;
    text-align:left;
    margin:auto;
}
.fa-envelope{
    margin-bottom:20px;
}
    .nav-list{
        margin-top: 10px!important;
    }
        #razvoj_poslovnih_apk p{
            width:90%;
            text-align:left;
            margin:auto;
}

     #sadrzaj_odrzavanje_it_sustava p{
             width:90%;
             text-align:left;
             margin:auto;
    }
    
    #sadrzaj_odrzavanje_it_sustava img{
        width:90%;
        margin: auto;
    }
    
    #sklapanje_racunala p{
            width:90%;
            text-align:left;
            margin:auto;
}

    #naprave2 p{
            width:90%;
            text-align:left;
            margin:auto;
}

.prazni200{
    display:none;
}
  
    
    #sklopovi p{
            width:90%;
            text-align:left;
            margin:auto;
}

    #servis_it_opreme p{
            width:90%;
            text-align:left;
            margin:auto;
}

    #o_nama{
    width: 100%;
    grid-template-columns:repeat(1,1fr);
    grid-template-areas:
        "o_nama_tekst"
        "o_nama_slika" 
}
    
    .logo{
        margin-left: 10px;
        transition: 0.5s;
    }
    
        #box2, #box1, #box3{
        padding: 50px 0;
    }
    .fa-chevron-circle-up{
        border-radius: 50px;
    }
    
    #sadrzaj_ind img{
    max-width: 90%;

}  
    #pozadina_naslov_kontakt h1{
        font-size: 8vw;
    }
    
    .tv_fix{
        display: none;
    }
     #paralax{
        display: none;
    }
    
    .ind{
        width: 90%;    
        padding-bottom: 20px;
    }
    
    #sadrzaj_ind p{
    width: 90%;

}   
    #sadrzaj_o_nama img{
    max-width: 90%;

}    #sadrzaj_o_nama p{
    width: 90%;
}

    
    
    #o_nama_tekst{
    height: auto;
    }
    
    #o_nama_tekst p{
    margin: 0 auto;
    width: 80%;
    color: white;
}

    #o_nama_tekst h1{
    color: white;
    margin-top: -60px;
   
}

    #o_nama_slika{
    grid-area: o_nama_slika;
    background-image: url(../slike/o_nama.jpg);
    background-size: cover;
    background-position: center;
    height: auto;
    display:none;
}
    
    #sadrzaj{
    width: 100%;
    margin-top: 300px;
}
    

    
    #sadrzaj p{
        width: 85%;
    }
    
    #sadrzaj img{
        max-width: 95%;
    }
    
    .info-navigacija{
    width: 100%;
    height: 30px;
    background-color:#343434;
    text-align: center;
    font-size: 10px;
    color: white;
    line-height: 30px;
    display: grid;
    grid-template-columns: repeat(3,1f);
    grid-template-areas: 
        " info_broj . info_adresa"
        ;
}
    #novost{
    position: relative;
    height: 400px;
    }
     #novosti{
            width: 100%;
        }
    
    #novost p{
        padding: 5px;
        font-size: 17px!important;
        color:white!important;
    }
        #pozadina_naslov_o_nama h1{
        font-size: 8vw;
            line-height: 50px;
    }
       
    #ime_prezime{
        grid-template-columns: repeat(1,1fr);
        transition: 0,5s;
        grid-template-areas: 
            "ime"
            "prezime"
}
    
    #kontakt_cijeli{
        grid-template-columns: repeat(1,1fr);
        grid-template-areas: 
            "kontakt"
            "podaci"
    }
    
    #podaci{
        margin-top: 50px;
    }
    
    textarea{
        width: 103%;
    }
    
    #podrska_box:hover{
        margin-top: 0px;
    }
        #pozadina_naslov h1{
        font-size: 30vw;
    }  
    
    #pozadina_naslov_o_nama h1{
        font-size: 15vw;
        line-height: 80px;
        margin-top:80px;
    }   
    
    #pozadina_naslov_ind h1{
        font-size: 9vw;
        line-height: 80px;
    }
    
   #pozadina_tekst p{
        font-size: 9vw;
    }

       #pozadina_naslov_pso h1{
        font-size: 10vw;
    }
    
    .slika2{
        display:block;
        
    }
    
    #sadrzaj_o_nama p{
        text-align:left;
    }
}
@media screen and (max-width:500px){
   #oprema-container{
       width:100%;
   }
    .oprema{
        max-width:100%;
        margin:0;
        display:block;
       padding:0 40px;

    }
    
    #programi-container{
       width:100%;
   }
    .program{
        max-width:100%;
        margin:0;
        display:block;
       padding:0 45px;

    }
    
}

@media screen and (max-width:400px){
    .nav-list{
        margin-top: 10px!important;
    }
    
    .logo{
        margin-left: 10px;
    }
    
    .fa-chevron-circle-up{
        
    }
    
    .usluge-kutija{
            width:90%;
        }
        
    .info-navigacija{
        display: none
    }
    
    .nav-mobile{
        top: 0;
    }
    #o_nama_tekst p{
            top: 0;
        }
        
    #o_nama_tekst h1{
            top: 5%;
            margin-top:0.5%;
        }
        
    #novosti{
            width: 100%;
        }
        
    #pozadina_naslov h1{
            font-size: 4vw
        }
    #pozadina_tekst p{
            font-size: 4vw;
        }
    
    #o_nama_slika{
            height: 300%;
        
        }
    
    #pozadina_naslov_ind h1{
        font-size: 7vw;
    }
   
    
    .usluge-kutija{
        width: 250px;
    }
        
    #pozadina_naslov h1{
        font-size: 5em;
    }   
    
    #pozadina_tekst p{
        font-size: 2em;
    }
    
    #pozadina_naslov_ind h1{
        font-size: 3em;
        
    }
    
        .nav-list{
        margin-top: !important;
        position: relative;
        display: none;
        
    }
    .logo{
        margin-left: 10px;
    }
    
    }

@media screen and (max-width:379px){
    .nav-list{
        margin-top: 10px!important;
    }
    
    .nav-mobile{
        margin-top:0px!important; 
    }
    
    .logo{
        margin-left: 10px;
        margin-top: 10px;
    }

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

@media screen and (max-width:250px){
        .usluge-kutija{
        width: 200px;
    }
    
    #sadrzaj_o_nama p{
    width: 90%;
    text-align: center;
    margin: 0 auto;
    padding: 0px;
    color: #6c6c6c;

}
    #pozadina_naslov_ind h1{
        font-size: 2.5em;}
}