@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{
	background: url(../images/pozivnica-bg.jpg);
	background-size: 1920px;
	min-height: 1500px;
	}
/* Fontovi za sajt */
@font-face {
	font-family: 'MTCORSVA';
	src: url('../fonts/MTCORSVA.eot');
	src: local('MTCORSVA'), url('../fonts/MTCORSVA.woff') format('woff'), url('../fonts/MTCORSVA.ttf') format('truetype');
}
/* use this class to attach this font to any element i.e. <p class="fontsforweb_fontid_6771">Text with this font applied</p> */
.fontsforweb_fontid_6771 {
	font-family: 'MTCORSVA' !important;
}
@font-face {
	font-family: 'TektonPro-Bold';
	src: url('../fonts/TektonPro-Bold.otf');
	src: local('TektonPro-Bold'), url('../fonts/TektonPro-Bold.otf') format('otf'), url('../fonts/TektonPro-Bold.otf') format('truetype');
}
/* use this class to attach this font to any element i.e. <p class="fontsforweb_fontid_6771">Text with this font applied</p> */
.fontsforweb_fontid_6771 {
	font-family: 'TektonPro-Bold' !important;
}
h1{
	text-align: center;
	font-size: 8rem;
	font-weight: 600;
	font-style: italic;
	font-family: 'MTCORSVA';
	}
p{
	text-align: center;
	font-size: 2rem;
	font-weight: 600;
	font-family: 'TektonPro-Bold';
	}
h2{
	text-align: center;
	font-size: 4rem;
	font-weight: 600;
	font-style: italic;
	font-family: 'MTCORSVA';
	margin-bottom: 5%;
	}
.sadrzaj{
	text-align: center;
	}
.podnaslovi{
	font-family: 'MTCORSVA';
	font-size: 2.5rem;
	font-weight: 500;
	margin-top: 2%;
}
.tekst{
	text-align: center;
	font-size: 1.5rem;
	font-family: 'TektonPro-Bold';
	font-style:normal;
	}
p a {
    color: #d4980a;
    text-decoration: none;
	font-size: 1.5rem;
	font-family: 'TektonPro-Bold';
	font-style:normal;
}
p a:hover {
    text-decoration: none;
	font-size: 1.5rem;
	font-family: 'TektonPro-Bold';
	font-style:normal;
	color: #000;
	transition: ease-in 0.5s;
}
/* 1.1. Stilovi tajmera */
/* general styling */
:root {
  --smaller: .75;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.container {
  color: #333;
  margin: 0 auto;
  text-align: center;
}

li {
  display: inline-block;
  font-size: 1.5em;
  list-style-type: none;
  padding: 1em;
  font-family: 'MTCORSVA';
}

li span {
  display: block;
  font-size: 4.5rem;
}

@media all and (max-width: 768px) {
  
  li {
    font-size: calc(1.125rem * var(--smaller));
  }
  
  li span {
    font-size: calc(3.375rem * var(--smaller));
  }
}


/* 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: #a90000;
  color: white;
  cursor: pointer;
  padding: 1%;
  border-radius: 4px;
  transition: all .3s linear;
}
#dugme-vrh:hover {
  background-color: #2e2e2e;
}

/* 2.3. Stil za slike na stranici*/
.page-img{
	border-radius: 0.25rem;
	margin: 1%;
	}
/* 2.4. Stil za linkove na stranici */

	
li a{
	color: #a9000b;
	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%;
}
.btn-obrazac{
    color: #fff;
    background-color: #353535;
    border-color: #000;
    font-size: 0.8rem;
    font-weight: bold;
    padding: 2% 5%;
}
.btn-obrazac-dodatak{
	padding: 1% 2%;
}
.btn-obrazac:hover{
	color:#fff;
	background-color: #a9000b;
	text-decoration: none;
	font-weight: bold;
	transition: 0.5s;
	}


/* 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;
}
@media only screen and (max-width: 600px) {
	.page-img{	
	border-radius: 0.25rem;
	margin: 1%;
	width: 100%;
	}	
	h1{
	font-size: 6rem;
	}
	p{
	font-size: 1.5rem;
	}
	h2{
		font-size: 3rem;
	}
	#dugme-vrh {
  display: none;
  position: fixed;
  bottom: 5%;
  right: 1%;
  z-index: 99;
  font-size: 1rem;
  border: none;
  outline: none;
  background-color: #a90000;
  color: white;
  cursor: pointer;
  padding: 3%;
  margin-right: 1%;
  border-radius: 4px;
  transition: all .3s linear;
}
.neutral-row{
	margin-right: 0!important;
}
.container_slika {
  position: relative;
  width: 45%;
  margin: 1% 0 1% 5%;
  padding: 0;
}
.text_slika {
  white-space: nowrap; 
  color: white;
  font-size: 15px;
  position: absolute;
  overflow: hidden;
  top: 50%;
  left: 50%;
  text-align: center;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
}