html,
body {
  height: 100%;
  font-size: 1rem;
  
}

.gradient {
  background: rgb(0, 97, 242);
  background: linear-gradient(
    135deg,
    rgba(0, 97, 242, 1) 0%,
    rgba(105, 0, 199, 1) 100%
  );
}

.page-header {
  margin-top: 4rem;
  font-size: 1.25rem;
  color: #fff;
}

#gradient-line{ 
  margin: 0 0 50px 0;
  display: block;
  border: none;
  height: 1px;
  background: #0071B9;
  background: linear-gradient(to right, white, #0071B9, #26ABFF, #0071B9, white);
}

#finanx1 .card-deck .card {
  max-width: calc(25% - 15px);
}
/*----- potraži link na stranici ----------------------------------------------------*/

.offset:before { 
  display: block; 
  content: " "; 
  height: 160px;      
  margin-top:  -150px;
  visibility: hidden; 
}
/*----- animation background ----------------------------------------------------*/

@-webkit-keyframes Gradient {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
  }
  @-moz-keyframes Gradient {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
  }
  @keyframes Gradient { 
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
  }

/*----- Footer ------------------------------------------------------------------*/

.footer .container-fluid { 
  background: linear-gradient(-45deg, #ABEBC6 , #EAFAF1  , #D6EAF8, #EBF5FB);
  background-size: 150%;
  -webkit-animation: Gradient 7s ease infinite;
  -moz-animation: Gradient 7s ease infinite;
  animation: Gradient 7s ease infinite;
  padding-bottom: 0;
  margin-top: 20px;
  box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
}

.footer-logo-text {
  font-family: 'Poppins', sans-serif;
  color:#4181be;
  font-size: 25px;
  margin-top: 14px;
  margin-left: 10px;
}

.footer .list-group{
  margin-top: 10px;
}

.footer .list-group-footer li{
  font-family: 'Geologica', sans-serif;
  background-color: transparent;
  border: none;
  padding:2px;
  color:#4181be;
  font-size: 16px;
  text-decoration: none;
}

.footer .list-group-footer a{
  text-decoration: none;
}

.footer .links-footer {
  letter-spacing: 0.5em;
}


.footer ul.socialIcons {
  padding: 0;
  text-align: center;

}

.footer .socialIcons li {
  background-color: yellow;
  list-style: none;
  display: inline-block;
  margin: 4px;
  border-radius: 2em;
  overflow: hidden;
}

.footer .socialIcons li a {
  display: block;
  padding: 0.5em;
  min-width: 2.28571429em;
  max-width: 2.28571429em;
  height: 2.28571429em;
  white-space: nowrap;
  line-height: 1.5em; /*it's working only when you write text with icon*/
  transition: 0.5s;
  text-decoration: none;
  font-family: arial;
  color: #fff;
}

.footer .socialIcons li i {
  margin-right: 0.5em;
}

.footer .socialIcons li:hover a {
  max-width: 200px;
  padding-right: 1em;
  color: yellow;

}

.footer .socialIcons .facebook {
  background-color: #3b5998;
  box-shadow: 0 0 16px #3b5998;
}

.footer .copy-footer h1{
  font-family: 'Geologica', sans-serif;
  color:#4181be;
  font-size: 12px;
  margin-bottom: 20px;
  margin-top: -10px;
}

.footer .line1{
  border: 0;
  height: 4px;
  background: #F1948A;
  background-image: -webkit-linear-gradient(left, #ccc, #F1948A, #ccc);
  background-image: -moz-linear-gradient(left, #ccc, #F1948A, #ccc);
  background-image: -ms-linear-gradient(left, #ccc, #F1948A, #ccc);
  background-image: -o-linear-gradient(left, #ccc, #F1948A, #ccc);
}

/*---- Mobile Layout ---------------------------------------------------------------------------*/
@media only screen and (max-width: 640px) {

  .footer-logo-text {
    font-family: 'Poppins', sans-serif;
    color:#4181be;
    font-size: 20px;
    margin-top: 14px;
    margin-left: 10px;
  }

}

/*--- btn-back-to-top ---------------------------------------------------------*/
#btn-back-to-top {
  position: fixed;
  background-color:#F1948A;
  bottom: 20px;
  right: 20px;
  display: none;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px;
  z-index: 3;
}

#btn-back-to-top:hover {
  background-color:whitesmoke;
}

/*---- Loader -------------------------------------------------------------------*/
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#loader {
  display: block;
  position: relative;
  left: 50%;
  top: 50%;
  width: 150px;
  height: 150px;
  margin: -75px 0 0 -75px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-top-color: #9370DB;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}

#loader:before {
  content: "";
  position: absolute;
  top: 5px;
  left: 5px;
  right: 5px;
  bottom: 5px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-top-color: #BA55D3;
  -webkit-animation: spin 3s linear infinite;
  animation: spin 3s linear infinite;
}

#loader:after {
  content: "";
  position: absolute;
  top: 15px;
  left: 15px;
  right: 15px;
  bottom: 15px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-top-color: #FF00FF;
  -webkit-animation: spin 1.5s linear infinite;
  animation: spin 1.5s linear infinite;
}

@-webkit-keyframes spin {
  0%   {
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg);
  }
  100% {
      -webkit-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
      transform: rotate(360deg);
  }
}

@keyframes spin {
  0%   {
      -webkit-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg);
  }
  100% {
      -webkit-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
      transform: rotate(360deg);
  }
}

/*----- Hero Section ------------------------------------------------------------*/
#hero {
  height: 450px;
  min-height: 250px;
  padding: 65px;
  background: url("../imgmd/hero-1-g.gif") top left;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  z-index: 3;
  color:white;
  /* TRANSITION */
  -webkit-transition: all 2s ease-out;  
  -moz-transition: all 2s ease-out;  
  -o-transition: all 2s ease-out;  
  transition: all 2s ease-out;  
}

#hero:hover{
  background: url("../imgmd/hero-2-g.gif") top left;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  z-index: 3;
  color:yellow;
  /* TRANSITION */
  -webkit-transition: all 2s ease-out;  
  -moz-transition: all 2s ease-out;  
  -o-transition: all 2s ease-out;  
  transition: all 2s ease-out;  

}

#hero h1{
  font-family: 'Ranchers', sans-serif;
  letter-spacing: 0.1em;
  text-align: center;
  font-size: 20px;
  margin-top: -100px;
  font-weight: 700;
}

/*----- Tipke odabir Section ------------------------------------------------------------*/

#tipke-odabir .container-fluid{
  background-color: white;
}

#tipke-odabir .container{
 background-color: white;
 margin-top: 20px;
}

#tipke-odabir .card{
  border: 0px solid transparent;
  background-color: transparent;
  
}

#tipke-odabir a{
  margin-top: -20px;
  text-align: center;
}

#tipke-odabir .card-deck .card {
  max-width: 260px;
}

@media screen and (max-width: 767px) {
  #tipke-odabir .button-55-3 {
      width: 100%;
      margin-bottom: 5px;
  }
}


/*-------------------------------------------------------------------------------*/
/* (3840x1600)  HD+ Display */
/*-------------------------------------------------------------------------------*/
@media screen and (min-width: 1600px) {

  #tipke-odabir p{
    display: none;
  }

  #tipke-odabir .razmak{
    margin-top: -5px;
  }




}

/*-------------------------------------------------------------------------------*/
/* (1920x1080) Full HD Display */
/*-------------------------------------------------------------------------------*/
@media screen and (min-width: 1920px)  {

  #tipke-odabir p{
    display: none;
  }
}


/*-------------------------------------------------------------------------------*/
/* Tablet Layout: 768px. */
/*-------------------------------------------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 991px) { 

  #tipke-odabir p{
    display: none;
  }

  #tipke-odabir .razmak{
    margin-top: 25px;
  }

}



/*----- Novosti Section ------------------------------------------------------------*/

#novosti .container-fluid { 
  background: linear-gradient(-45deg, #ABEBC6 , #EAFAF1  , #D6EAF8, #EBF5FB);
  background-size: 150%;
  -webkit-animation: Gradient 7s ease infinite;
  -moz-animation: Gradient 7s ease infinite;
  animation: Gradient 7s ease infinite; 
  margin-top: 20px;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
 
}

#novosti .zaglavlje{
  font-family: 'Comfortaa', sans-serif;
  text-shadow: 3px 3px 3px #ababab;
 
  font-size: 25px;
  margin-top: 15px;
  color: RED;
}

#novosti .zaglavlje:hover{
  font-family: 'Comfortaa', sans-serif;
  text-shadow: 3px 3px 3px #ababab;
 
  font-size: 25px;
  margin-top: 15px;
  color: blue;
}

#novosti .img-center{
  display: block;
  width: 250px;
  margin: auto;
}


#novosti .card-title{
  font-family: 'Geologica', sans-serif;
  font-size: 17px;
  color: crimson;
}

#novosti .card-text{
  font-family: 'Geologica', sans-serif;
  font-size: 15px;
}

#novosti .card-text-sm{
  font-family: 'Geologica', sans-serif;
  font-size: 12px;

}


#novosti .img-box{
  border: 3px solid #40a8c4; 
  border-radius: 5px ;
  padding: 5px;
  margin: 5px;

}

#novosti .card{
  font-family: 'Comfortaa', sans-serif;
  background-color:#F8F9F9;
  border-radius: 10px; 
  overflow: hidden;
  box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px;
}

#novosti .card-row{
  margin-top: 10px;
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {

  #novosti .card {
     width: 800px;
     margin: auto;
  }  
}



/* make flex item to stretch parent container to max child height */
#novosti .carousel-item {
  display: flex !important;
  /* animate carousel item opacity property */


}

/* animate carousel item opacity property */
#novosti .carousel-item.active {
  opacity: 1;
  z-index: 1;
}
#novosti .carousel-item-start,
#novosti .carousel-item-next {
  opacity: 1;
}
/* end of animating of opacity */

/* added for example purpose (make arrows darker) */
#novosti .carousel-control-prev-icon,
#novosti .carousel-control-next-icon {
  filter: brightness(0);
}

/* adjusting (stretching) slide's card to max height */
#novosti .carousel-item .container {
  display: flex;
  flex-direction: column;
}
#novosti .carousel-item .card {
  flex-grow: 1;
}







/*----- Novosti druge stranice Section ------------------------------------------------------------*/

#zaglavlje-stranice-novosti {
  height: 100vh;
  min-height: 200px;
  padding: 65px;
  height: auto !important;  /* for other browsers */
  background-color: #515A5A;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

#zaglavlje-stranice-novosti h1{
  font-family: 'Geologica', sans-serif;
  color:white;
  font-size: 25px;
  margin-top: 60px;
}


#novosti-prikaz .container-fluid { 
  background: white
}

#novosti-prikaz .zaglavlje{
  font-family: 'Comfortaa', sans-serif;
  text-shadow: 3px 3px 3px #ababab;
 
  font-size: 30px;
  margin-top: 10px;
  color: dodgerblue;
}

#novosti-prikaz .row{
  margin-top: 10px;
}

#novosti-prikaz .img-center{
  display: block;
  width: 250px;
  margin: auto;
}

#novosti-prikaz .img-box{
  border: 3px solid #40a8c4; 
  border-radius: 5px ;
  padding: 5px;
  margin: 5px;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px;
  
}


#novosti-prikaz .card{
  background-color:#F8F9F9;
  box-shadow: rgba(17, 17, 26, 0.05) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px;
  border-radius: 10px; 
  overflow: hidden;
  
}


/*----- Obavjesti Section ------------------------------------------------------------*/

#obavjesti .container-fluid { 
  background: white;

}

#obavjesti .container { 
  margin-top: 15px; 
}

#obavjesti .zaglavlje{
  font-family: 'Comfortaa', sans-serif;
  text-shadow: 3px 3px 3px #ababab;
 
  font-size: 25px;
  margin-top: -10px;
  color: red;
}

#obavjesti .zaglavlje:hover{
  font-family: 'Comfortaa', sans-serif;
  text-shadow: 3px 3px 3px #ababab;
 
  font-size: 25px;
  margin-top: -10px;
  color: blue;
}

#obavjesti .row{
  margin-top: 20px;
}

#obavjesti .card{
  background-color:white;
  border:0px; 

}

#obavjesti .img-box{
  border: 3px solid #40a8c4; 
  border-radius: 5px ;
  padding: 5px;
  margin: 5px;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px;
  
}

#obavjesti .img-box-2 { 
  display: block;
  width: 450px;
  margin: auto;

}

#obavjesti .card{
  margin-top: -20px;
  font-family: 'Comfortaa', sans-serif;
}

#obavjesti .img-center{
  display: block;
  width: 250px;
  margin: auto;
}

#obavjesti .razmak1{
  margin-top: -10px;
  font-size: 14px;
}

#obavjesti .razmakh5{
  margin-top: -35px; 
}

/*----- Aglomeracija Section ------------------------------------------------------------*/

#aglomeracija .container-fluid { 
  background: linear-gradient(-45deg, #ABEBC6 , #EAFAF1  , #D6EAF8, #EBF5FB);
  background-size: 150%;
  -webkit-animation: Gradient 7s ease infinite;
  -moz-animation: Gradient 7s ease infinite;
  animation: Gradient 7s ease infinite; 
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  margin-top: -7px;
}

#aglomeracija .card-design1{
  margin-bottom: 24px;
  background-color:#F8F9F9;
  
  box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
  
  border-radius: 10px; 
  overflow: hidden;

}

#aglomeracija .zaglavlje{
  font-family: 'Comfortaa', sans-serif;
  text-shadow: 3px 3px 3px #ababab;
 
  font-size: 25px;
  margin-top: 15px;
  color: red;
}

#aglomeracija .zaglavlje:hover{
  font-family: 'Comfortaa', sans-serif;
  text-shadow: 3px 3px 3px #ababab;
 
  font-size: 25px;
  margin-top: 15px;
  color: blue;
}

#aglomeracija .card-header{
    background-color:white;
 }

#aglomeracija .card-body{
   background-color:#f0fbff; 
}

#aglomeracija .card-header h1{
    font-family: 'Ranchers', sans-serif;
    letter-spacing: 0.1em;
    font-size: 20px;
    text-wrap: 600;
    color: gray;
    margin-top: 5px;
}

#aglomeracija .podtext1{
    font-family: 'Geologica', sans-serif;
    font-size: 14px;
   
}

#aglomeracija .podtext2{
    font-family: 'Ranchers', sans-serif;
    letter-spacing: 0.1em;
    font-size: 20px;
    color:#5499C7 ;
    margin-top: -10px;
}

#aglomeracija .rowimage1{
    margin-top: -15px;
}

#aglomeracija .naslov1{
    font-size: 20px;
    font-family: 'Comfortaa', sans-serif; 
}

#aglomeracija .podnaslov1{
    font-size: 20px;
    font-family: 'Comfortaa', sans-serif;
    margin-top: -10px;
}

#aglomeracija .text1{
    font-size: 14px;
    font-family: 'Comfortaa', sans-serif;
    text-align: justify;
    margin-top: -15px;
}

#aglomeracija .buttoncentar{
    margin: 0 auto;
    display: block;
}

#aglomeracija .carousel{
    box-shadow: rgb(38, 57, 77) 0px 20px 30px -10px;

    margin-bottom: 25px;
    border-radius: 10px; 
}

#aglomeracija .card-design2{
    border-radius: 10px; 
    overflow: hidden;
    font-family: 'Comfortaa', sans-serif;
}

#aglomeracija .controls {
    background-color: rgba(255, 255, 255, 255);
    border-radius: 25px;
    bottom: 20px;
    height: 40px;
    position: absolute;
    right: 30px;
    width: 100px;
    z-index: 3;
}

#aglomeracija .carousel-control-prev-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2317202A' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E") !important;
}
   
#aglomeracija .carousel-control-next-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2317202A' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E") !important;
}

#aglomeracija .carousel-control-prev,
#aglomeracija .carousel-control-next {
  width: 50%;
}

#aglomeracija .carousel .carousel-indicators li {
    width: 15px !important;
    height: 15px !important;
    margin-right: 5px !important;
    margin-left: 5px !important;
    border-radius: 50% !important;
    border: 0 !important;
    background-color: transparent !important;
    box-shadow: 0 0 0 .2rem rgba(0,0,0,1) !important;
}

#aglomeracija .carousel .carousel-indicators li.active {
    background-color: red !important; 
}

#aglomeracija .text-px{
  font-family: 'Comfortaa', sans-serif;
  font-size: 15px;
  color: red;
}

#aglomeracija .text-px:hover{
  font-family: 'Comfortaa', sans-serif;
  font-size: 13px;
  color: black;
}


/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
  
    #aglomeracija .controls {
        width: 50px;
    }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {

    #aglomeracija .controls {
        width: 50px;
    }  
}
  

#aglomeracija .razmak-text1{
    margin-top: -15px;
}

/*----- Projekti Section ------------------------------------------------------------*/

#projekti .container-fluid { 
  background: #F2F4F4  ;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  margin-top: -7px;
}

#projekti .zaglavlje{
  font-family: 'Comfortaa', sans-serif;
  text-shadow: 3px 3px 3px #ababab;
 
  font-size: 25px;
  margin-top: 15px;
  color: red;
}

#projekti .zaglavlje:hover{
  font-family: 'Comfortaa', sans-serif;
  text-shadow: 3px 3px 3px #ababab;
 
  font-size: 25px;
  margin-top: 15px;
  color: blue;
}

#projekti .card-header{
    background-color:white;
 }

#projekti .card-body{
   background-color:#f0fbff; 
}

#projekti .card-header h1{
    font-family: 'Ranchers', sans-serif;
    letter-spacing: 0.1em;
    font-size: 20px;
    text-wrap: 600;
    color: gray;
    margin-top: 5px;
}

#projekti .text-p{
  font-family: 'Comfortaa', sans-serif;
  font-size: 15px;
  color: blue;
}

#projekti .text-px{
  font-family: 'Comfortaa', sans-serif;
  font-size: 15px;
  color: red;
}

#projekti .text-px:hover{
  font-family: 'Comfortaa', sans-serif;
  font-size: 17px;
  color: black;
}

/*----- O nama Section ------------------------------------------------------------*/

#onama .container-fluid { 
  background: white;

}

#onama .card{
  font-family: 'Geologica', sans-serif;
  border:0px;
  margin-bottom: 25px;
  background-color:white;
}

#onama .zaglavlje{
  font-family: 'Comfortaa', sans-serif;
  text-shadow: 3px 3px 3px #ababab;
 
  font-size: 25px;
  margin-top: -5px;
  color: red;
}

#onama .zaglavlje:hover{
  font-family: 'Comfortaa', sans-serif;
  text-shadow: 3px 3px 3px #ababab;
 
  font-size: 25px;
  margin-top: -5px;
  color: blue;
}

#onama .card-title{
font-family: 'Comfortaa', sans-serif;
font-size: 20px;
}

#onama .card-text{
 font-family: 'Comfortaa', sans-serif;
 text-align: justify;
 font-size: 14px;
}


#onama .card-header{
  border:0px;
  margin-bottom: 5px;
  background-color:white;
}

#onama .p_razmak1{
  margin-top: -15px;
}

#onama img{
  margin-top: 20px;
  box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 1px, rgba(0, 0, 0, 0.07) 0px 2px 2px, rgba(0, 0, 0, 0.07) 0px 4px 4px, rgba(0, 0, 0, 0.07) 0px 8px 8px, rgba(0, 0, 0, 0.07) 0px 16px 16px;
}


/*----- Cjenik Section ------------------------------------------------------------*/

#cjenikx .container-fluid { 
  background: white;
  
}

#cjenikx .card { 
  font-family: 'Comfortaa', sans-serif;
  border:0px;
  margin-top: -10px;

}

#cjenikx h4 { 
  font-family: 'Comfortaa', sans-serif;
  font-size: 14px;   
  font-weight:lighter; 
  text-align: justify;

}

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

#cjenikx img { 
  margin-top: 10px;
  width: 70px;
  height: 70px;
  text-align: center;
  margin: auto;
  display: block;

}

#cjenikx .text-p { 
  font-family: 'Cabin', sans-serif;
  font-size: 14px; 
  font-weight:lighter;  
}

#cjenikx .naslov { 
  margin-top: -10px; 
  margin-bottom: 10px;
  font-family: 'Ranchers', sans-serif;
  color: red;
  text-shadow: 3px 3px 3px #ababab;
  letter-spacing: 0.1em;
  font-size: 20px;
}


#cjenikx .zagtablice{
  font-family: 'Cabin', sans-serif;
  color:black;
  font-size: 14px;
  background-color: #fec83f;
  font-weight: normal;
}

#cjenikx .redtablice{
  font-family: 'Cabin', sans-serif;
  color:black;
  font-size: 14px;
  background-color: #e6eaec;
  font-weight: normal;
}

#cjenikx table, th, td {
  border: 1px solid #C0C0C0;
  padding: 10px;
}


/*----- Projekti stranica Section ------------------------------------------------------------*/

#projektix .container-fluid { 
  background: white;
  
}

#projektix .card { 
  font-family: 'Comfortaa', sans-serif;
  border: 1px;
  margin-top: 10px;
  background-color: #EBF5FB;
  box-shadow: rgb(38, 57, 77) 0px 20px 30px -10px;
}

#projektix .naslov { 
  margin-top: -10px; 
  margin-bottom: 10px;
  font-family: 'Ranchers', sans-serif;
  color: red;
  text-shadow: 3px 3px 3px #ababab;
  letter-spacing: 0.1em;
  font-size: 20px;
}

#projektix .text-p { 
  font-family: 'Comfortaa', sans-serif;
  font-size: 14px; 
  font-weight:lighter;  
}

#projektix img { 

 border: 2px solid whitesmoke;

}

#projektix .images {
  position: relative;
  display: inline-block;
}

#projektix .images p {
  position: absolute;
  width: 100%;
  text-align: center;
  bottom: 0;
  left: 0;
  font-size: 16px; 
  font-family: 'Ranchers', sans-serif;
  color: black;
  letter-spacing: 0.2em;
}

#projektix .images p:hover {
  position: absolute;
  width: 100%;
  text-align: center;
  bottom: 0;
  left: 0;
  font-size: 16px; 
  font-family: 'Ranchers', sans-serif;
  color: red;
  letter-spacing: 0.2em;
}

#projektix .card-1 {
  font-family: 'Comfortaa', sans-serif;
  border: 1px;
  margin-top: 10px;
  background-color: #EBF5FB;
}

/*----- Zakoni stranica Section ------------------------------------------------------------*/

#zakoni .container-fluid { 
  background: white;
  
}

#zakoni .card { 
  font-family: 'Comfortaa', sans-serif;
  border: 1px;
  margin-top: 10px;
  background-color:  #F7F7F7;
  box-shadow: rgb(38, 57, 77) 0px 20px 30px -10px;

}

#zakoni .naslov { 
  margin-top: -10px; 
  margin-bottom: 10px;
  font-family: 'Ranchers', sans-serif;
  color: red;
  text-shadow: 3px 3px 3px #ababab;
  letter-spacing: 0.1em;
  font-size: 20px;
}

#zakoni .text-p { 
  font-family: 'Comfortaa', sans-serif;
  font-size: 14px; 
  font-weight:lighter;  
  text-decoration: none;
}

#zakoni img { 

 border: 2px solid whitesmoke;

}

#zakoni .card-1 {
  font-family: 'Comfortaa', sans-serif;
  border: 1px;
  margin-top: 10px;
  background-color: #EBF5FB;
}

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

/*----- Finan Section ------------------------------------------------------------*/

#finanx1 .container-fluid { 
  background: white;
  
}

#finanx1 .card { 
  font-family: 'Comfortaa', sans-serif;
  border:0px;
  margin-top: -10px;

}

#finanx1 .naslov { 
  margin-top: -10px; 
  margin-bottom: 10px;
  font-family: 'Ranchers', sans-serif;
  color: red;
  text-shadow: 3px 3px 3px #ababab;
  letter-spacing: 0.1em;
  font-size: 20px;
}

#finanx1 .text-p { 
  font-family: 'Comfortaa', sans-serif;
  font-size: 14px; 
  font-weight:lighter;  
}

#finanx1 .card-deck .card {
  max-width: calc(25% - 15px);
}

#finanx1 img { 
 height: 130px;
 width: 250px;
 border: 2px solid #0071B9;

}

#finanx1 .images {
  position: relative;
  display: inline-block;
}

#finanx1 .images p {
  font-family: 'Ranchers', sans-serif;
  color: blue;
  text-shadow: 3px 3px 3px #ababab;
  letter-spacing: 0.1em;
  font-size: 18px;
  position: absolute;
  width: 100%;
  text-align: center;
  bottom: 0;
  left: 0;
}
#finanx1 .images p:hover {
  font-family: 'Ranchers', sans-serif;
  color: red;
  text-shadow: 3px 3px 3px #ababab;
  letter-spacing: 0.1em;
  font-size: 16px;
  position: absolute;
  width: 100%;
  text-align: center;
  bottom: 0;
  left: 0;
}

#finanx1 .card-1 { 

  border:2px;
 
}