@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');
/* global css */
.titlestrong{
  color: #188bca;
}
span.red{
  color: blule;
}

#callicon{
  width: 8%;
  margin-left: -1em;
}

span.green{
  color: #83b441;
}
a.green{
  color: #83b441;
  text-decoration: underline;
}
/* header css */
i.fa-phone{
  font-size: 1.7em;
  color: red;
  position: absolute;
  top: 3px;
}
a.call{
  color: blue !important;
  margin-left: 6%;
}


.headphone{
  margin-top: 0.5em;
}
span.tel{
  display: block;
  color: #83b441;
  font-weight: bold;
  margin-left: 8%;
  margin-top: -11px;
}
img.serbian-flag{
  position: absolute;
}
span.offer{
  margin-left: 15%;
}
span.offer-1{
  font-weight: bold;
  padding: 1em;
}
span.offer-2{
  color: lightblue;
}
/* navbar css */
nav.navbar {
  background: #188bca;
}
ul.navbar-nav li a{
  color: #fff !important;
}
.navbar-nav .nav-item:last-child{
  background: #000 !important;
}
/* homepage css */
section.one div.container{
  text-align: center;
  width: 90%;
  margin: 0 auto;
}
/* section one */
section.one{
  text-align: center;
  background-color: #188bca;
  color: white;
  margin-top: -5em;
  padding: 3em;
}
/* section two */
section.two{
  margin-top: 8%;
}
section.two div.container div.row{
  display: flex;
  flex-direction: row;
}
section.two div.container div.row div.second p{
  text-align: justify;
  width: 100%;
  margin-bottom: 0em;
}

.first{
  margin-top: 9em;
}

section.two div.container div.row div.second,
section.two div.container div.row div.first{
  text-align: center;
}
section.two div.container div.row div.first img.big-image{
  width: 60%;
  margin-bottom: -5em;
  margin-left: 3em;

}
section.two div.container div.row div.first img.medium-image{
  display: block;
  margin: 0 auto;
}

.btnbenefiti{
  background: #188bca;
  font-family: 'Source Sans Pro', sans-serif;
  margin-bottom: 40px;
  margin-left: 1.5em;
  padding: 10px 20px;
  border: none;
  border-radius: 25px;
  width: 100%;
}

section.two div.container div.row div.first img.small-image{
  display: block;
  width: 10%;
  margin: 0 auto;
}
section.two div.container div.row div.first h4{
  font-weight: bold;
}
section.two div.container div.row div.second h1{
  text-align: left;
  margin-bottom: 0.5em;
}

.sastavtitle{
  text-align: center;
  margin-top: 2em;
}

.faq{
  margin-bottom: 4em;
}

/* .checkbenefiti{
  margin-left: -2em;
} */
/* section three */
section.three{
  text-align: center;
  margin: 5% auto;
  /* margin-bottom: 10%; */
}


section.three p{
  margin: 2% auto;
  /* margin-bottom: 5%; */
}
/* section four */
section.four{
  text-align: center;
}
/* section.four div.container div.row div.first h1{
  margin-top: 5%;
  text-align: center;
  font-weight: bold;
} */
section.four div.container div.row div.first{
  text-align: justify;
}
section.four div.container div.row div.first p{
  width: 80%;
  margin: 5% auto;
  margin-bottom: 10%;
}
section.four div.container div.row div.first p.strong{
  font-size: 1.4em;
}
section.four div.container div.row div.first h5{
  width: 80%;
  margin: 0 auto;
  font-weight: bold;
  text-align: left;
}
section.four div.container div.row div.second img{
  padding-bottom: 5%;
  height: 400px;
}
/* section five */
section.five{
  text-align: center;
  background-color: #F2F2F2;
}
section.five div.row h1{
  width: 80%;
  margin: 5% auto;
  text-align: left;
}

#slikakorisnika{
  height: 65%;
}

section.five div.row div.second > p.strong{
  font-size: 28px;
  width: 80%;
  margin: 0px auto;
  margin-bottom: 10%;
}
section.five div.third{
  width: 50%;
  margin-top: 5%;
}
section.five div.fourth{
  padding-top: 8%;
  width: 50%;
  background: #188bca;
}
section.five div.fourth div.testimonial{
  margin-bottom: 2%;
  clear: both;
  max-height: 190px;
}
section.five div.fourth div.testimonial div.testimonials-details{
  width: 80%;
  float: right;
  text-align: left;
  margin-top: 5%;
  color: #fff;
}
section.five div.fourth div.testimonial div.testimonials-details > p{
  margin-bottom: 0;
}
section.five div.fourth div.testimonial div.testimonials-details > img{
  margin: 0 !important;
  width: 4% !important;
}
section.five div.fourth div.testimonial img{
  width: 10%;
  margin: 5%;
}

#banerspaceimg{
  width: 100%;
  padding: 5em;
}

.footerbot{
  background-color: #188bca;
}

.copy{
  padding: 2em;
}

.strips{
  padding: 5px;
  border: 1px solid #2A5FA3;
  border-style: dashed;
  background: #F2F6FF;
}

.infoimg img{
  width: 5%;
}
/* section six */
section.six{
  background: #ebebeb;
  text-align: center;
}
section.six h1{
  font-weight: bold;
  color: #000;
  width: 50%;
  margin: 5% auto;
  padding-top: 5%;
}
section.six div.content{
  display: flex;
  flex-direction: row;
  width: 80%;
  margin: 0 auto;
}
section.six div.content div.profesional-card {
  background-color: #fff;
  width: 30%;
  margin: 3%;
}
section.six div.content div.profesional-card div.body h4{
  margin: 10%;
}
section.six div.content div.profesional-card img{
  width: 80%;
  padding: 10%;
  border-bottom: 1px solid #000;
}
/* section seven */
section.seven{
  margin: 0 auto;
  text-align: center;
}
section.seven h1{
  display: block;
  width: 100%;
  clear: both;
  margin: 7% auto;
}
section.seven p.our-offer{
  display: block;
  background: #7A211B;
  width: 20%;
  margin: 0 auto;
  margin-bottom: -1%;
  z-index: 999;
  position: relative;
  color: #fff;
}
/* section ten */
section.ten{
  position: relative;
  background-color: #ebebeb;
}
section.ten div.image-holder,
section.ten div.form-wrapper,
section.ten div.first-div-absolute{
  z-index: 999;
}
section.ten div.first-div-absolute p.white{
  font-size: 29px;
  font-family: 'Lobster', cursive;
  color: #fff;
  padding-top: 50px;
}
section.ten div.image-holder h1{
  position: absolute;
  color: #fff;
  right: 0px;
  bottom: 60px;
  font-size: 80px;
  font-weight: bold;
}
section.ten img.banner-image-absolute{
  position: absolute;
  bottom: 15px;
  width: 104%;
  left: -2%;
  z-index: 1;
}

/* responsive */
@media screen and (max-width: 768px) {
  div.image-section_features div.prod-image div.prod-image-wrapper img{
    width: 80% !important;
    left: 10% !important;
  }
  /* section one */
  section.one h1{
    padding-top: 10%;
  }
  /* section two */
  section.two img.big-image{
    /* width: 95% !important; */
    margin-left: 0 !important;
  }
  /* section five */
   section.five div.first img{
    width: 95% !important;
  }
  /* section six*/
  section.six div.content div.row div.profesional-card{
    margin: 3% auto;
  }
  /* section eight */
  section.eight div.accordion-right-col div#accordion div.card{
    width: 95%;
  }
  /* section ten */
  section.ten div.row div{
    text-align: center;
  }
  section.ten div.row div.image-holder img{
    position: relative;
    right: 0% !important;
  }



}


@media screen and (max-width: 600px){
  section.two div.container div.row div.first img.medium-image{
    width: 70%;
  }

  .first{
    margin-top: 0em;
  }

  .primary-heading{
    font-size: 38px !important;
  }
  
  .mobileprep{
    display: block !important;
  }

  .ekran{
    display: none;
  }

  .visinaizmedju{
    line-height: 1em !important;
  }

  .imgkarakteristike{
    padding: 2em;
  }

  .green-testimonials{
    padding-bottom: 3em !important;
  }

}


