@charset "utf-8";
/* CSS Document */
/* SADRŽAJ
1. DIZAJN POČETNE STRANE
1.1. Stilovi navigacije
1.2. Stil za slajdove/slike u headeru
1.3. Stilovi za kartice sa uslugama
1.4. Stilovi za sivi odeljak na početnoj strani
1.5. Stilovi za footer
2. DIZAJN OSTALIH STRANICA 
2.1. Stil za odvajanje sadržaja od ivica
2.2. Stil za naslov na stranici
2.3. Stil za slike na stranici
2.4. Stil za linkove na stranici 
2.5. Stilovi za kontakt formu*/
/* 1. DIZAJN POČETNE STRANE */
body{
	padding-top: 4.5rem;
	background-image: url("../images/snow-alpha.png");
	}
.container-stranice{
	max-width: 1900px;
}
.clear-margin-right{
	margin-right: 0;
}

/* traka sa kontakt podacima */
.traka{
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	bottom: 98%;
	z-index: 1040;
	background-color: #f8f9fa;
	text-align: right;
	padding: 0;
	margin: 0;
	min-height: 30px;
}
.traka img{
	margin-right: 1%;
}

/* 1.1. Stilovi navigacije */
.navigacija-visina{
	top: 3%;
}
.navigation-link{	
	color: rgba(0,0,0,.5);
	text-decoration: none;
	display: block;
    padding: .5rem;
}
.navigation-link a{
	text-decoration: none;
	font-weight:bold;
	color: #2e2e2e;
	text-transform: uppercase;
}
.navigation-link a:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0%;
  border-bottom: 2px solid #be3434;
  transition: 0.4s;
}
.navigation-link:hover{
	color: #2e2e2e;
	text-decoration: none;
	display: block;
	position: relative;
	}
.navigation-link a:hover{
		color: #be3434;
		text-decoration: none;
		text-transform: uppercase;
	}
.navigation-link-aktivan a{
	color: #2e2e2e;
	text-decoration: none;
	display: block;
    padding: .5rem;
	position: relative;
    border-bottom: 2px solid #be3434;
	font-weight:bold;
	text-transform: uppercase;
}
.navigation-link-aktivan a:hover{
	color: #2e2e2e;
	text-decoration: none;
	display: block;
    padding: .5rem;
	position: relative;
    border-bottom: 2px solid #be3434;
	font-weight:bold;
}
.navigation-link-aktivan a:active{
	color: #2e2e2e;
	text-decoration: none;
	display: block;
    padding: .5rem;
	position: relative;
    border-bottom: 2px solid #be3434;
	font-weight:bold;
}
.navigation-link a:hover:after {
  width: 100%;
}
.navigation-link-jezik{
	vertical-align:middle;
	padding: 0.5rem;
	}

/* 1.2. Stil za slajdove/slike u headeru */
.full-screen {
  width: 100%; 
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.indikator-black li{
	background-color: #000;
}
/* 1.3. Stilovi za odeljak dobrodoslice */
.odeljak-dobrodosli{
	margin-top: 3%;
	margin-left: 1%;
	margin-right: 4%;
}
.odeljak-dobrodosli h2{
	font-size: 2.1rem;
	font-weight: bold;
	font-style: italic;
	font-family: Arial, Helvetica, sans-serif;
}
.odeljak-dobrodosli p{
	font-size: 1.2rem;
	font-family: Arial, Helvetica, sans-serif;
}
.odeljak-dobrodosli img{
	width: 100%;
	margin-left: 5%;
}
.desna-kolona{
	padding-left: 2%;
}
.linija{
	background-color:#000;
	margin: 2% 0 2% 2%;
}
/* 1.3. Stilovi za kartice sa uslugama */
.card:hover{
	box-shadow: 0 0 5px 5px rgb(182,182,182,0.5);
	transition: 0.5s;
	}
.card-space{
	width: 23rem;
	margin: 1% 0.5%;
	}
.card-img-top{
	opacity: 0.5;
}
.card-img-top:hover{
	opacity: 1;
	transition: 0.5s;
}
.btn-cards {
	border: 2px solid #000;
	background-color: #e1e1e1;
	border-radius: 2rem;
	color: #000;
	padding: 2% 3%;
	font-weight: bold;
	font-size: 1rem;
	text-decoration: none;
}
.btn-cards:hover{
	color: #fff;
	background-color: #be3434;
	border: 2px solid #000;
	box-shadow: 5px 5px 15px 5px #CCC;
	transition: ease-in 0.3s;
	text-decoration: none;
	}
.card-title-link{	
	color: #212529;
}
.card-title-link:hover{
	color:#be3434;
	text-decoration: none;
	transition: 0.5s;
	}
.slika-usluge{
	 border-radius: 5%;
	 margin-left: 1%;
}
/* PARALLAX SLIKA */
.parallax {
  /* The image used */
  background-image: url("../images/parallax/parallax.webp");
  /* Set a specific height */
  height: 500px;
  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.parallax-content{
	height:2%;
}
.btn-parallax{
	margin-top: 2%;
}
.btn-parallax a{
	border: 2px solid #000;
    background-color: #e9cb1c;
    border-radius: 2rem;
    color: #fff;
    padding: 1% 3%;
    font-weight: bold;
    font-size: 1.4rem;
    text-decoration: none;
}
.btn-parallax a:hover{
	color: #000;
    background-color: #e9cb1c;
    border: 2px solid #000;
    box-shadow: 5px 5px 15px 5px #ccc;
    transition: ease-in 0.3s;
}
.text-parallax{
	text-align: center; 
	padding: 10%; 
	color: #000;
}
.naslov-parallax{
	font-weight: bold; 
	line-height: 3rem;
	font-size: 2rem;
}

/* Dugmad na stranici */
.btn-informacije a{
	border: 2px solid #000;
	background-color: #e1e1e1;
	border-radius: 2rem;
	color: #000;
	padding: 1% 2%;
	font-weight: bold;
	font-size: 1rem;
	text-decoration: none;
}
.btn-informacije a:hover{
	color: #fff;
	background-color: #be3434;
	border: 2px solid #000;
	box-shadow: 5px 5px 15px 5px #CCC;
	transition: ease-in 0.3s;
	text-decoration: none;
}
/* Funkcionalnost otkrivanja objekata */
.reveal{
  position: relative;
  transform: translateY(150px);
  opacity: 0;
  transition: 1s all ease;
}

.reveal.active{
  transform: translateY(0);
  opacity: 1;
}
.active.fade-bottom {
  animation: fade-bottom 1s ease-in;
}
.active.fade-left {
  animation: fade-left 1s ease-in;
}
.active.fade-right {
  animation: fade-right 1s ease-in;
}
@keyframes fade-bottom {
  0% {
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-left {
  0% {
    transform: translateX(-100px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes fade-right {
  0% {
    transform: translateX(100px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
/* 1.5. Stilovi za footer */
.bg-footer{
	background-color: #2f2f2f;
	}
.footer-h2{
	color: #fff;
	text-transform: uppercase;
	font-size: 1rem;
	padding-top: 5%;
	font-weight: bold;
}
.footer-h3{
	color: #fff;
	text-transform: uppercase;
	font-size: 1rem;
	padding-top: 0;
	font-weight: bold;
}
.prva-kolona{
	padding-left: 10%;
	padding-top: 1%;
	color: #fff;
	font-size: 1rem;
	font-weight: bold;
}
.footer-ul{
	color: #fff;
	list-style-type: none;
	padding-inline-start: 0px;
	font-size: 0.8rem;
	font-weight: bold;
	}
.footer-li a{
	color: #fff;
	}
.footer-li a:hover{
	color: #be3434;
	text-decoration: underline;
	transition: 0.3s;
	}
.text-footer{
	color:#fff;
	font-size: 0.8rem;
	margin-top: 1%;
	font-weight: bold;
	}
.text-footer a{
	color:#be3434;
	font-size: 0.8rem;
	margin-top: 1%;
	font-weight: bold;
	text-decoration: none;
	}
.text-footer a:hover{
	color:#fff;
	font-size: 0.8rem;
	margin-top: 1%;
	font-weight: bold;
	text-decoration: underline;
	}
.social-icons:hover{
	opacity: 0.5;
	transition: 0.5s;
	}
.poslednja-kolona{
	text-align: right;
	padding-right: 10%;
}
.odvojeni-red{
	background-color: #383636;
}

/* Dugme za dugme za poziv */
#dugme-kontakt{
  position: fixed;
  bottom: 14%;
  right: 1%;
  z-index: 99;
  font-size: 1rem;
  border: none;
  outline: none;
  background-color: #be3434;
  color: white;
  cursor: pointer;
  padding: 1%;
  border-radius: 4px;
  transition: all .3s linear;
  opacity: 1;
}
#dugme-kontakt:hover{
  background-color: #be3434;
  opacity: 1;
  box-shadow: none;
}


/* Dugme za povratak na vrh stranice */
#dugme-vrh {
  display: none;
  position: fixed;
  bottom: 5%;
  right: 1%;
  z-index: 99;
  font-size: 1rem;
  border: none;
  outline: none;
  background-color: #be3434;
  color: white;
  cursor: pointer;
  padding: 1%;
  border-radius: 4px;
  transition: all .3s linear;
  opacity: 0.5;
}
#dugme-vrh:hover {
  background-color: #be3434;
  opacity: 1;
  box-shadow: none;
}

/* 2. DIZAJN OSTALIH STRANICA */
/* 2.1. Stil za odvajanje sadržaja od ivica */
.page-content{
	padding: 2% 5% 0 5%;
	min-height: 650px;
	}
/* 2.2. Stil za naslov na stranici */
.title-page{
	margin: 3% 0 2% 3%;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 1.5rem;
    }
.title-page a{
	color: #212529;
	}
.title-page a:hover{
	color: #be3434;
	text-decoration: none;
	transition: 0.5s;
	}
.subtitle-page{
	margin: 1% 0 2% 0;
	color: #be3434;
	font-size: 14pt;
	text-transform: uppercase;
	font-weight: bold;
    }
/* 2.3. Stil za slike na stranici*/
.page-img{
	border-radius: 2%;
	margin: 1%;
	border: 2px solid #be3434;
	max-width: 100%;
	height: auto;
	}
/* 2.4. Stil za linkove na stranici */
.sadrzaj{
	margin-left: 2.2%;
}
.panel {
    width: 100%;
    padding: 2%;
    margin-right: 1%;
    margin-bottom: 5%;
    background-color: #f4f3f3;
    color: #2e2e2e;
    border: 1px solid #2e2e2e;
}
.panel-naslov{
	color: #be3434;
}
.senka{
	box-shadow: none;
}
.panel-manji{
	min-height: 320px;
}
.panel-veci{
	min-height: 365px;
}
.panel-manji-el{
	min-height: 245px;
}
.panel-center{
	text-align: center;
}
.senka:hover {
    box-shadow: 0 0 10px #999;
    transition: opacity .5s ease-in-out;
}
.mapa{
	margin-bottom: 1%;
}
.lightbox-img img {
	border-radius: 0.25rem;
    border: 2px solid #be3434;
    margin-bottom: 2%;
    margin-right: 0.5%;
}
.slike-usluge{
	text-align: center;
}
.btn-novosti{
	margin-top: 2%;
	margin-bottom: 2%;
}
.btn-novosti a{
	border: 2px solid #000;
	background-color: #e1e1e1;
	border-radius: 2rem;
	color: #000;
	padding: 0.5% 2%;
	font-weight: bold;
	font-size: 1rem;
	text-decoration: none;
}
.btn-novosti a:hover{
	color: #fff;
	background-color: #be3434;
	border: 2px solid #000;
	box-shadow: 5px 5px 15px 5px #CCC;
	transition: ease-in 0.3s;
	text-decoration: none;
}
/* Breadcrumbs navigacija */
.breadcrumb{
	color:#be3434;
	background-color: #fff;
	padding: 3rem 1rem 0 3rem;
}
.breadcrumb a{color: #2e2e2e;
    font-weight: bold;
    text-decoration: none;
}
.breadcrumb a:hover{
	color:#be3434;
}
.title-page-novosti{
	margin: 1% 0 2% 3%;
}
p a{
	color: #be3434;
	text-decoration: none;
	font-weight: bold;
	
	}
p a:hover{
	color: #212529;
	text-decoration: none;
	transition: 0.5s;
	}
	
li a{
	color: #be3434;
	text-decoration: none;
	
	}
li a:hover{
	color: #212529;
	text-decoration: underline;
	transition: 0.5s;
	}
/* 2.5 Stilovi za kontakt formu */
.obrazac{
	display: block;
	margin-bottom: 2%; 
	width: 100%;
	}

.alert-success{
  z-index: 1;
  background: #D4EDDA;
  font-size: 18px;
  padding: 20px 40px;
  right: 0;
  top: 10px;
  border-left: 8px solid #3AD66E;
  border-radius: 4px;
  margin-bottom: 2%;
}

.alert-error{
  z-index: 1;
  background: #FFF3CD;
  font-size: 18px;
  padding: 20px 40px;
  right: 0;
  top: 10px;
  border-left: 8px solid #FFA502;
  border-radius: 4px;
  margin-bottom: 2%;
}
.podnaslovi{ font-size: 1.5rem;}
.posebne-slike{ border: none;}

/* DEO ZA MISLJENJE KLIJENATA */
@import url(https://fonts.googleapis.com/css?family=Roboto:300,400);
.snip1533 {
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  color: #000;
  display: inline-block;
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 16px;
  margin: 35px 10px 10px;
  max-width: 310px;
  min-width: 250px;
  position: relative;
  text-align: center;
  width: 100%;
  background-color: #ccc;
  border-radius: 5px;
  border-top: 5px solid #be3434;
}

.snip1533 *,
.snip1533 *:before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.1s ease-out;
  transition: all 0.1s ease-out;
}

.snip1533 figcaption {
  padding: 13% 10% 12%;
}

.snip1533 figcaption:before {
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: #fff;
  border-radius: 50%;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  color: #be3434;
  content: "\f10e";
  font-family: 'FontAwesome';
  font-size: 32px;
  font-style: normal;
  left: 50%;
  line-height: 60px;
  position: absolute;
  top: -30px;
  width: 60px;
}

.snip1533 h3 {
  color: #3c3c3c;
  font-size: 20px;
  font-weight: 300;
  line-height: 24px;
  margin: 10px 0 5px;
}

.snip1533 h4 {
  font-weight: 400;
  margin: 0;
  opacity: 0.5;
}

.snip1533 blockquote {
  font-style: italic;
  font-weight: 300;
  margin: 0 0 20px;
}
.slogan{
	color: #be3434;
}
.telefon-link a{
	color: #be3434;
}
.telefon-link a:hover{
	color: #fff;
}
@media only screen and (max-width: 600px) {
	.page-img{	
	border-radius: 0.25rem;
	margin: 1%;
	width: 100%;
	}	
	.full-screen{
		margin-top: 15%;
	}
	.odeljak-dobrodosli{
	margin-top: 3%;
    margin-left: 10%;
	}
	.odeljak-dobrodosli img{
		width: 100%;
		margin-bottom: 2%;
	}
   .clear-margin-left{
	margin-right: 0;
   }
   .linija{
	   margin: 2% 1% 2% 1%;
   }
   .container-stranice{
	   margin-left: 4%;
   }
   .desna-kolona{
			padding-left: 5%;
			margin-top: 2%;
	}
	.desna-kolona h2{
			font-size: 1.2rem;
	}
	#dugme-vrh{
			padding: 4%;
			margin-right: 1%;
		}
	#dugme-kontakt{
			padding: 4%;
			margin-right: 1%;
		}
	.btn-informacije a{
			padding: 2% 3%;
	}
	.btn-novosti{
		margin-bottom: 10%;
	}
	.btn-novosti a{
			padding: 2% 2%;
	}
		.navigation-link a{	
    border-bottom: none;
}
    .navigation-link:hover{	
  border-bottom: none;
}
	.navigation-link a:hover{	
   border-bottom: none;
}
	.navigation-link a:active{	
   border-bottom: none;
}
.navigation-link a:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0%;
  border-bottom: none;
}
.navigation-link-aktivan a{
	color: #2e2e2e;
	text-decoration: none;
	display: block;
    padding: .5rem;
	position: relative;
    border-bottom: none;
	font-weight:bold;
}
.navigation-link-aktivan a:hover{
	color: #be3434;
	text-decoration: none;
	display: block;
    padding: .5rem;
	position: relative;
    border-bottom: none;
	font-weight:bold;
}
.prva-kolona{
	padding-left: 2%;
}
.poslednja-kolona{
	text-align: left;
}
.prva-kolona img{
	padding-top: 5%;
}
.odvojeni-red{
	margin-left: -35px;
}
.page-content{
	padding: 8% 5% 0 5%;
}
.title-page{
	margin: 10% 0 2% 5%;
    }
.title-page-novosti{
	margin: 1% 0 2% 5%;
}
.clear-col-md-6{
	padding-right: 0;
	padding-left: 0;
}
.breadcrumb-text{
	font-size: 0.7rem;
	padding-left: 5%; 
}
.slika-usluge{
	 border-radius: 5%;
	 width: 100%;
	 margin-left: 0;
	 margin-bottom: 5%;
}
.posebne-slike{ width: 100%;}
		.traka{
			text-align: center;
		}
}
@media only screen and (min-width: 768px){
		.desna-kolona{
			padding-left: 5%;
		}
		.img-umanjeni-prikaz{
			margin-bottom: 2%;
		}
		.desna-kolona h2{
			font-size: 1.2rem;
		}
}