@import url(https://fonts.googleapis.com/css?family=Lobster&subset=latin,latin-ext);
@import url(https://fonts.googleapis.com/css?family=Bree+Serif&subset=latin,latin-ext);
@import url(https://fonts.googleapis.com/css?family=Open+Sans&subset=latin,latin-ext);
h1,
h2,
h3,
h4,
ul {
	padding: 0;
	margin: 0
}

a,
body {
	color: #7F8C8D
}
body, html {
	height: 100%;
}

#languageBar>li,
.socialLinks li {
	display: inline-block
}

header hr,
ul {
	margin: 0
}

#big-image .carousel .item img,
.img-responsive.img {
	width: 100%
}

.app-box,
.fill {
	overflow: hidden
}

.fill,
.navbar-fixed-top,
a {
	transition: all .3s
}

body {
	font-size: 1.8em;
	font-family: 'Open Sans', sans-serif
}

.navbar {
	margin-bottom:0;
}

#languageBar>li,
.navbar-nav>li>a {
	font-family: "Open Sans", sans-serif
}

ul {
	list-style: none
}

a {
	text-decoration: none!important
}

.subtitle a {
	color: green
}

a:active,
a:focus {
	outline: 0
}

a:hover {
	color: #2077bd
}

.spacing-1 {
	padding: 10px 0
}

.spacing-3 {
	padding: 30px 0
}

.spacing-5 {
	padding: 50px 0
}

.relative {
	position: relative
}

#resp,
.fill {
	position: absolute;
	text-align: center
}

.socialLinks li a {
	font-size: 1em
}

#languageBar>li {
	border-right: 1px solid #7F8C8D;
	font-size: .8em;
	line-height: 1em;
	padding-left: 6px;
	padding-right: 10px
}

#languageBar>li:last-child {
	border-right: none
}

.active {
	color: #2077bd!important;
	font-weight: 700
}

nav {
	background-color: #fff!important;
	border: none!important
}

.navbar-brand {
	height: 100px;
	padding-top: 5px
}

.navbar-nav>li>a {
	font-size: 1em;
	line-height: 70px;
	text-transform: uppercase;
	color: #7F8C8D
}

.navbar-default .navbar-nav>li>a:hover {
	color: #2077bd;
	cursor: pointer
}

#resp,
#upit h4,
.btn,
.fill {
	color: #fff
}

.nobottom {
	padding-bottom: 0
}

#big-image {
	margin-top: 20px
}

#big-image .carousel .item {
	max-height: 650px
}

#big-image figure {
	max-height: 650px;
	overflow: hidden
}

#bg-image {
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	background-repeat: no-repeat;
	height: 100vh;
}
#bg-image.on-contact{
	background-image: url("../img/kontakt.jpg");
}
#bg-image.on-vis{
	background-image: url("../img/vis.jpg");
}
#bg-image.on-komiza{
	background-image: url("../img/komiza.jpg");
}
#bg-image.on-apartmani{
	background-image: url("../img/apartmani.jpg");
}
#bg-image.on-homepage{
	background-image: url("../img/homepage.jpg");
}
h1,
h2,
h4 {
	font-family: Lobster;
	font-size: 36px
}

.app-box h3,
.subtitle {
	font-family: "Bree Serif", serif;
	font-style: italic
}

.title-divider {
	background: #000;
	display: block;
	height: 1px;
	margin: 30px auto;
	width: 120px
}

#resp,
.none {
	display: none
}

.subtitle {
	font-size: 1.2em
}

.carousel-inner {
	margin-bottom: 50px
}

.carousel-indicators {
	bottom: -50px
}

.carousel-indicators li {
	background-color: rgba(0, 0, 0, 0, 1);
	border: 1px solid #000;
	border-radius: 15px;
	height: 15px;
	width: 15px
}

.carousel-indicators .active {
	background-color: #000;
	height: 17px;
	width: 17px
}

.fill,
.img-responsive.img-rounded {
	width: 100%
}

.padding {
	padding: 15px
}

.app-box {
	background-color: #F6F8F8;
	border-radius: 10px;
	margin-bottom: 70px
}

.app-box h3 {
	margin-bottom: 10px;
	font-size: 1.8em
}

.app-box p {
	font-size: .9em
}

.fill {
	background-color: rgba(29, 115, 188, .5);
	height: 0;
	top: 0;
	padding-top: 0
}

#map_canvas,
#upit {
	position: relative
}

.app-box figure ul,
.app-box:hover ul {
	transition-delay: .3s;
	transition-duration: .3s
}

.app-box:hover .fill {
	height: 100%;
	padding-top: 20px
}

.app-box figure ul {
	opacity: 0;
	font-style: italic
}

.app-box:hover ul {
	opacity: 1
}

.apartman img,
.booking-form,
.btn,
button.submit {
	transition: all .3s
}

.btn {
	font-size: 1em;
	font-family: Lobster
}

#map_canvas {
	height: 350px
}

#upit {
	background-image: url(../img/form.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	padding-top: 3%;
	padding-bottom: 5%;
	border-bottom: 1px solid #fff
}

#upit h4 {
	padding-bottom: 4%;
	padding-top: 4%;
	text-align: center
}

#resp {
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 50%;
	background-color: green;
	top: 50%;
	font-size: 20px
}

.input-style,
form>.fieldset>label,
textarea {
	font-size: 15px;
	float: left;
	width: 100%;
	font-weight: 700
}

.dimIt {
	opacity: .2
}

form>.fieldset>label {
	color: #efefef;
	margin: 20px 0 10px
}

.input-style,
textarea {
	background: rgba(255, 255, 255, 1);
	border: 1px solid #fff;
	border-radius: 5px;
	color: #2077bd;
	letter-spacing: .3px;
	padding: 11px 15px;
	height: auto
}

textarea {
	resize: none
}

#selectBox option {
	color: #2077bd;
	border: transparent;
	padding-left: 15px
}

#selectBox select {
	height: 46px
}

button.submit {
	background-color: #57c81e;
	border: none;
	color: #fff;
	float: left;
	left: 0;
	padding: 10px 0;
	text-transform: uppercase;
	width: 100%
}

button.submit:hover {
	background-color: green
}

.apartman {
	padding-bottom: 6%
}

.apartman img {
	cursor: pointer
}

.apartman img:hover {
	transform: scale(1.02, 1.02)
}

.glyphicon-star {
	color: gold
}

.bg1 {
	background-color: #2077bd
}

.inline-link {
	color: green;
	font-weight: 700
}

#apartments,
#lopar {
	margin-bottom: -75px
}

footer a,
footer p {
	color: #fff
}

footer a:hover {
	color: orange
}

@media (max-width:1023px) {
	.apartman figure {
		margin-top: 30px
	}
	#lopar figure {
		margin-bottom: 30px
	}
	.nav-logo {
		margin-top: 25px;
		width: 150px
	}
}

@media (max-width:768px) {
	.nav-logo {
		margin-top: 0;
		width: 200px
	}
	.navbar-brand {
		height: auto;
		padding-top: 5px
	}
	.navbar-header {
		padding-top: 20px
	}
	.spacing-5 {
		padding: 0
	}
	.subtitle {
		margin-bottom: 30px
	}
	.navbar-nav>li>a {
		line-height: normal
	}
	.trigger {
		margin-bottom: 40px
	}
	h1,
	h2,
	h4 {
		font-family: Lobster;
		font-size: 30px
	}
	.subtitle {
		font-family: "Bree Serif", serif;
		font-size: 1.5em;
		font-style: italic
	}
	.title-divider {
		margin: 15px auto
	}
	.carousel-indicators {
		bottom: 0
	}
	body {
		font-size: 1.6em
	}
	footer p {
		padding-top: 20px
	}
	.apartman ul li {
		font-size: 15px
	}
	#apartments,
	#lopar {
		margin-bottom: 0
	}
	#big-image {
		margin-bottom: 20px
	}
	#map {
		margin-top: 30px
	}
	.app-box .btn {
		margin-bottom: 25px;
	}
}