@charset "UTF-8";
/* CSS Document */





html,
body {
   margin:0;
   padding:0;
   height:100%;
   min-height:100%;
   position:relative;
   text-align: center;
}

#header {
   background:#ff0;
   padding:10px;
}

p {
	text-align: center;	
}

.card-header {            
	height: 80px;
}

.uslovi p {
	text-align: center;
}


.fa {
  padding: 20px;
  font-size: 30px;
  width: 30px;
  text-align: center;
  text-decoration: none;
  margin: 5px 2px;
  border-radius: 50%;
}

.fa:hover {
    opacity: 0.7;
}

.fa-facebook {
  background: #3B5998;
  color: white;
}

.fa-linkedin {
  background: #007bb5;
  color: white;
}



.objasnjenje p {
	text-align: justify;
	text-indent: 20px;
}

.top3 p {
	text-align: center;
}

td {
	vertical-align: middle;
}

.odgovori p {
	text-align: justify;
	text-indent: 20px;
}

.kontakt p {
	text-align: center;
}

.masaza-contact-relax {
	color: #c1c1c1 !important;
	font-size: 1.3rem;
	text-align: center;
}

.masaza-contact-terapeutska {
	color: #97d363 !important;
	font-size: 1.3rem;
	text-align: center;
}

.masaza-contact-relax a {
	color: #c1c1c1 !important;
}

.masaza-contact-terapeutska a {
	color: #88cb4e !important;
}

.masaza-contact-relax a:hover {
	color: #8c8c8c !important;
	text-decoration: none;
}

.masaza-contact-terapeutska a:hover {
	color: #5ba250 !important;
	text-decoration: none;
}

.xbody-cene a {
	color: #8c8c8c;
	font-size: 1.2rem;
}

.xbody-cene a:hover {
	color: #575757;
	text-decoration: none;
}


.info-box-top p, .info-box-tan p, .info-box-dark p {
		text-align: center;
}


/** Navbar **/
header .navbar-brand .style-logo {	
	margin-left: auto;
	margin-right: auto;
	display: block;	
	width: 100%;
	background-repeat: no-repeat;
	background-position: center center;	
}


/** Navbar links **/
header .linkovi .navbar-nav .nav-item a.nav-link{
	color: rgba(104,104,104, 0.6);
	font-weight: 400;
}

header .linkovi .navbar-nav .nav-item .nav-link:hover {
	color: rgba(208, 37, 30, 1);
	font-weight: 500;
}

header .navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link{
	color: rgba(88,88,88, 1) !important;
	font-weight: 400;
	text-shadow: none;	
}

header .navbar-light .navbar-nav .active>.nav-link:hover, .navbar-light .navbar-nav .nav-link.active:hover, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link {
	color: rgba(208, 37, 30, 1) !important;
	font-weight: 500;
	text-shadow: none;	
}


/** Navbar button and links **/
header .navbar .navbar-toggler {
 	background-color:#e6e6e6;
 	border-color: white;
	color: white;
	margin-top: 10px;
	margin-right: 10px;
	margin-bottom: 5px;
	margin-left: -15px;
}

header .navbar-light .navbar-toggler-icon {
 	background-color: #e6e6e6;
 	border-color: white; 	
 	height: 25px;
 	width: 25px;	
	color: white;
}





/*

#galerija .carousel-item {	
	background-repeat: no-repeat;
	background-position: center center;
	
	background-size: contain;
	height: inherit;
	width: inherit;	
}

.sirina {
	background-size: cover;
	width: 100%;
	height: 100%;
}

*/

/*
ORIGINAL DA RADI NA CELOJ POVRSINI

#galerija .carousel-item {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	width: 100%;
	height: 100%;
}
*/

#galerija .carousel-item {
	background-repeat: no-repeat;
	
	
	
}

.mala {
	background-size: contain;
	background-position: top center;
	height: inherit;
	width: inherit;
}

.velika {
	background-size: contain;
	background-position: top center;
	height: inherit;
	width: inherit;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
  height: 50px;
  width: 50px;
  opacity: 1;
  
  outline: black;
  background-size: 100%, 100%;
  border-radius: 20%;
  border: 1px solid #373737;
  background-image: none;
 
}

.carousel-control-next-icon:after
{
  content: '>';
  font-size: 30px;
  color: #373737;
}

.carousel-control-prev-icon:after {
  content: '<';
  font-size: 30px;
  color: #373737;
}


a.carousel-control-prev, a.carousel-control-next{
	top: 30%;
	opacity: 0.1;
	background-position: top center;
}

a.carousel-control-prev:hover, a.carousel-control-next:hover {
	opacity: 1;
}





.kontakt  {
	text-align: center;
	display: block;
	height: 260px;
	border: thick;
	border-style:double;
	margin: 10px;
	padding: 10px;
}

.rezervacija  {
	height: 420px;
}

.kontakt p {	
	margin: 0px;
	padding: 0px;
}

.kontakt .telefon {
	font-size: 1.5em;
	background-color:#d11e26;
	color: #ffffff;
}
	
.kontakt .telefon a {
	font-size: 1.1em;
	background-color:#d11e26;
	color: #ffffff;
	text-decoration: none;
}

.kontakt .poslednji {	
	margin-bottom: 10px;
	padding-bottom: 10px;
}


img {
	width: 100%;
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}

.hero {	
	background-image: url(../images/Devojka006.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 250px;
}

.massage-top {	
	background-image: url(../images/massage-top.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	min-height: 400px;
}

/* .oaza {
	background-color: #bab7b7;
	color: #b1f079;
	padding: 15px 40px 15px 40px;
} */

.oaza {
	background-color: #6abd46;
	color: #ffffff;
	padding: 15px 40px 15px 40px;
}

.button {
	border: 2px #FFFFFF solid;
	padding: 8px 30px;
	border-radius: 30px;
	color: #FFFFFF;
	text-decoration: none;
}

.info-box-top {
	background-color:#d11e26;
	color: #FFFFFF;
	padding: 30px 20px 10px 20px;
	text-align: center;
	min-height: 330px;
	max-height: 330px;
}

.info-box-top .top {
	font-size: 1.8em;
	text-transform: uppercase;
	margin-bottom: 20px;
}

.info-box-top p {
	padding: 0px;
	margin-top: 15px;
	font-size: 1.2em;
	text-transform: none;
}


.info-box-tan {
	background-color:#848383;
	color: #FFFFFF;
	padding: 40px 20px 0px 20px;
	text-align: center;
	min-height: 200px;
	max-height: 200px;
	
}

.info-box-tan p {
	font-size: 1.1em;
	margin-bottom: 20px;
}

.info-box-dark {
	background-color:#FFFFFF;
	color: #FFFFFF;
	padding: 30px 20px 60px;
	text-align: center;
	min-height: 300px;
	max-height: 300px;
}


.slika1{
	background-image: url(../images/XBody_01.jpg);
	background-color: #FFFFFF;
	background-position: center center;
	background-size: cover;
}

.slika2{
	background-image: url(../images/XBody_03.jpg);
	background-color: #FFFFFF;
	background-position: top center;
	background-size: contain;
	background-repeat: no-repeat;
}

.slika3{
	background-image: url(../images/XBody_04.jpg);
	background-color: #FFFFFF;
	background-position: top center;
	background-size: contain;
	background-repeat: no-repeat;
}




.col {
	width: 100%;
}

#map {
	margin-bottom: 30px;
}


.foot {
   clear: both;
   margin: 30px +15px 0 -15px;    
   width:100%;
    
   /*height:60px;    Height of the footer */
  
   padding: 10px 0px;
   background-color:#2d2d35;
   color:#E5E3E3;
   font-size: 13px;
   text-align: center;
}


footer {
   clear: both;   
   width:100%;
    
   /*height:60px;    Height of the footer */
  
   padding: 10px 0px;
   background-color:#2d2d35;
   color:#E5E3E3;
   font-size: 13px;
   text-align: center;
}

@media only screen and (min-width: 300px) {
	
	.rezervacija  {
		height: 370px;
	}
	.oaza {
		background-color: #6abd46;
		color: #ffffff;
		padding: 15px 40px 15px 40px;
	}
	.oaza h1 {
		font-size: 1.6rem;
	}
	
	/** Navbar button and links **/
	header .navbar .navbar-toggler {
		margin-top: 20px;
	}

}

@media only screen and (min-width: 535px) {
	

	/** Navbar button and links **/
	header .navbar .navbar-toggler {
		margin-top: 30px;
	}

}

@media only screen and (max-width: 579px) {
	
	.card-header {   
		padding-top: 10px;		       
		height: 60px;
	}

}

@media only screen and (min-width: 580px) {
	.card-header {            
		height: 100px;
	}
}

/* @media only screen and (max-width: 767px) {
		
	header .navbar-collapse  {
		background-color: rgba(160,160,160, 0.2);
		font-weight: 300;		
		text-align: center;
	}
	
	header .navbar-collapse .nav-item  {
		padding: 5px 0px 5px 0px;
		border-bottom: 1px solid rgba(160,160,160, 0.3);
	}
	
	
	.rezervacija  {
		height: 320px;
	}

	.oaza {
		background-color: #6abd46;
		color: #ffffff;
		padding: 15px 40px 15px 40px;
	}
	.oaza h1 {
		font-size: 2.2rem;
	}
	
} */



@media only screen and (min-width: 768px) {
	header .navbar-collapse  {
		margin-top: 0px;
		font-size: 1.1em;
		font-weight: 200;
	}
	
	.card-header {            
		height: 80px;
	}
	
	.rezervacija  {
		height: 300px;
	}

	.oaza {
		background-color: #6abd46;
		color: #ffffff;
		padding: 15px 40px 15px 40px;
	}
	.oaza h1 {
		size: 1rem;
	}
	
	.col {
		float: left;
		padding: 0px 7px 14px;
	}
	
	.info-box-top {
		background-color:#d11e26;
		color: #FFFFFF;
		padding: 20px 20px 0px 20px;
		text-align: center;
		min-height: 270px;
		max-height: 270px;
	}

	.info-box-top .top {
		font-size: 1.8em;
		text-transform: uppercase;
	}

	.info-box-top p {
		padding: 0px;
		margin-top: 20px;
		font-size: 1.2em;
	}


	.info-box-tan {
		background-color:#848383;
		color: #FFFFFF;
		padding: 30px 20px 0px 20px;
		text-align: center;
		min-height: 280px;
		max-height: 280px;

	}

	.info-box-tan p {
		font-size: 1.1em;
		margin-bottom: 0px;
		margin-top: 40px;
	}

	.info-box-dark {
		background-color:#FFFFFF;
		color: #FFFFFF;
		text-align: center;
		min-height: 280px;
		max-height: 280px;
	}
	
	.hero {	
		background-image: url(../images/Devojka005.jpg);
		background-position: center center;
		background-repeat: no-repeat;
		background-size: 768px 534px;
		min-height: 534px;
	}
	
}

@media only screen and (min-width: 992px) {
	header .navbar-collapse  {
		margin-top: 15px;
		font-size: 1.1em;
		font-weight: 200;
	}
	
	.info-box-tan {
		min-height: 350px;
		max-height: 350px;

	}

	.info-box-dark {
		min-height: 350px;
		max-height: 350px;
	}
	
	.hero {	
		background-image: url(../images/Devojka004.jpg);
		background-position: center center;
		background-repeat: no-repeat;
		background-size: contain;
		min-height: 690px;
	}

	.oaza {
		background-color: #6abd46;
		color: #ffffff;
		padding: 15px 40px 15px 40px;
	}
}

@media only screen and (min-width: 1200px) {
	header .navbar-collapse  {
		margin-top:20px;
		font-size: 1.2em;
		font-weight: 200;
	}

	.oaza {
		background-color: #6abd46;
		color: #ffffff;
		padding: 15px 40px 15px 40px;
	}
	
	.info-box-top {
		background-color:#d11e26;
		color: #FFFFFF;
		padding: 20px 20px 0px 20px;
		text-align: center;
		min-height: 280px;
		max-height: 280px;
	}

	.info-box-top .top {
		font-size: 1.8em;
		text-transform: uppercase;
		margin-top: 15px;
		margin-bottom: 0px;
	}

	.info-box-top p {
		padding: 0px;
		margin-top: 20px;
		font-size: 1.2em;
		text-transform: none;
	}


	.info-box-tan {
		background-color:#848383;
		color: #FFFFFF;
		padding: 20px 20px 0px 20px;
		text-align: center;
		min-height: 300px;
		max-height: 300px;

	}

	.info-box-tan p {
		font-size: 1.1em;
		margin-bottom: 0px;
		margin-top: 45px;
	}

	.info-box-dark {
		background-color:#FFFFFF;
		color: #FFFFFF;
		padding: 30px 20px;
		text-align: center;
		min-height: 300px;
		max-height: 300px;
	}
	
	.hero {	
		background-image: url(../images/Devojka004.jpg);
		background-position: center center;
		background-repeat: no-repeat;
		background-size: 100%;
		min-height: 536px;
	}
}

.masaza-contact-relax a {
	color: #c1c1c1 !important;
}

.masaza-contact-terapeutska a {
	color: #88cb4e !important;
}

.masaza-contact-relax a:hover {
	color: #8c8c8c !important;
	text-decoration: none;
}

.masaza-contact-terapeutska a:hover {
	color: #5ba250 !important;
	text-decoration: none;
}