* {

	margin: 0;

	padding: 0;

	border: 0;

	outline: 0;

}

a, a:hover, a.active, a:focus, li a, li a.active, li a:hover {

	outline: 0;

	text-decoration: none;

	color: inherit;

}

.left {

	float: left;

}

.right {

	float: right;

}

.clear {

	clear: both;

}

.block {

	display: block;

}

.inlineblock {

	display: inlineblock;

}

.hidden {

	display: none;

}

.half {

	width: 50%;

}

.underline {

	text-decoration: underline;

}



body {	

	font-family: "Roboto";

	font-size: 24px;

	font-weight: 300;

	color: black;

	line-height: normal;

	word-wrap: break-word;

	width: 100%;

	height: 100%;

/* 	min-width: 780px; */

}

#navigation {

	height: 70px;

}

#logo {

	display: block;

	width: 182px;

	height: 51px;

	background: url(../images/logo.png) no-repeat;

	margin-top: 10px;

	margin-left: 30px;

	float: left;

}



/* -------- slider ------------*/

#slider {

	height: 568px;

 	background: #abbbcd url(../images/slikaslidemojapostava.jpg) right no-repeat;

	width: 100%;

}

.slide {

	box-sizing: border-box;

	width: 100%;

	padding-left: 60px;

	padding-top: 72px;

/* 	width: 620px; */

	color: white;

	position: absolute;

}

#slide1 .title {

	font-family: "Open Sans Condensed", sans-serif;

	font-size: 156px;	

	line-height: 156px;

	height: 156px;	

	float: left;

}

#slide1 .title2 {

	font-family: 'Open Sans Condensed', sans-serif;

	font-size: 156px;	

	color: #00a7e1;	

	line-height: 156px;

	height: 156px;

	margin-top: -20px;

	display: inline-block;

	float: left;

	clear: both;

}

#slide1 .desc {

	clear: both;

	float: left;

	font-family: 'Open Sans Condensed', sans-serif;

	font-size: 30px;

	margin-left: 60px;

	margin-top: -10px;

}

#slide1 .price,

#slide2 .price {

	box-sizing: border-box; 

	float: left;

	margin-top: 50px;

	background: url(../images/price2.png) no-repeat;

	width: 373px; 

	padding-right: 70px;

	height: 169px;

	padding-top: 32px;

	font-family: 'Roboto', sans-serif;

	font-size: 36px;

	font-weight: light;

	text-align: right;

	

	text-shadow:

/* 	  0px 0px 0 #000, */

	  /* Simulated effect for Firefox and Opera

	     and nice enhancement for WebKit */

	 -1px -1px 0 #000,  

	  1px -1px 0 #000,

	 -1px  1px 0 #000,

	  1px  1px 0 #000;

}

#slide1 .price {

	margin-top: 0;

	margin-left: 100px;	

}

#slide1 .price span,

#slide2 .price span {

	

	font-size: 60px;

	font-weight: normal;

	margin-top: -14px;

	display: inline-block;

}



#slide2 .title {

	font-family: 'Hind', sans-serif;

	color: #00a7e1;

	font-size: 60px;

	font-weight: 400;

	height: 75px;

}

#slide2 .title2 {

	margin-top: 10px;

}

#slide2 .desc {

	font-size: 20px;	

}

#slide2 .price {

	margin-top: 20px;

	float: none;

	margin-left: 80px;	

}





/* ------- buttons -------- */

#buttons {

	position: fixed;

	z-index: 10000;

	right: 20px;

	top: 20px;

}

#buttons a {

	width: 67px;

	height: 67px;

	display: block;

	margin-bottom: 20px;

}

#mail {

	background: url(../images/button_mail.png) no-repeat;

}

#phone {

	background: url(../images/button_phone.png) no-repeat;

}

#facebook {

	background: url(../images/button_facebook.png) no-repeat;

}



/* -------  contactbar --------- */

#contactbar {

	box-sizing: border-box; 

	height: 66px;

	margin-top: -33px;

	width: auto;

	max-width: 80%;

	line-height: 66px;

	color: white;

	background: #00a7e1;

	padding-left: 60px;

	padding-right: 60px;

	display: inline-block;

}



/* ------- Main menu -------- */

ul.menu {

	list-style: none;

}

ul.menu li {

	margin: 0;

	padding: 0;

}

ul.menu li.expanded, ul.menu li.leaf, ul.menu li.collapsed {

	list-style: none;

	list-style-type: none;

	list-style-image: none;

}

/* Menu container */

#mainmenu {

	margin-right: 140px;

	float: right;

}

#mainmenu li {

	float: left;

}

#mainmenu li a {

	font-family: font-family: 'Hind', sans-serif;

	font-size: 16px;
	font-weight: 500;

	color: black;

	white-space: nowrap;

	height: 70px;

	line-height: 70px;

}

#mainmenu ul li a:after {

	content: "|";

	margin-right: 15px;

	margin-left: 15px;

	color: #474848;

}

#mainmenu ul li.last a:after {

	content: " ";

	margin-right: 0;

	margin-left: 0;

}

#mainmenu li a:hover, #mainmenu li a.active {

	color: #00a7e1;

}



/* --------- sections --------- */

.section {

	box-sizing: border-box;

	color: black;

	font-size: 20px;

	padding: 30px 60px 60px 60px;	

}

.section.blue {

	color: white;

	background: #00a7e1;

}

.section.grey {

	background: #a1abad;

}

.section .title,

.section h4 {

	font-weight: 200;

	font-size: 60px;

	margin-bottom: 20px;

}

.section .text ul {

	margin-left: 30px;

}

.section .border {

	border: 10px solid #a1abad;

	border-radius: 10px;	

}

.section .border.white {

	border-color: white;

}

.section .border.blue {

	border-color: #00a7e1;

}

.section .box {

	border: 20px solid #a1abad;

	border-radius: 10px;

	background: #a1abad;

	margin-bottom: 20px;

/* 	padding: 10px; */

}

.section .box.white {

	border-color: white;

	background: white;

	color: black;

}

.section .box.blue {

	border-color: #00a7e1;

	background: #00a7e1;

}

.section img.solo {

	width: auto;

	height: auto;

	margin: 0 20px 20px 20px;

}

.section img.solo.left {

	margin-left: 0px;

}

.section img.solo.right {

	margin-right: 0px;

}



#steps .num {

	box-sizing: border-box;

	background: #00a7e1;

	border-radius: 15px;

	width: 30px;

	height: 30px;

	line-height: 30px;

	text-align: center;

	display: inline-block;

	color: white;

	font-weight: 400;

	font-size: 24px;

	margin-top: 0;

	margin-right: 10px;

	padding: 0;

	float: left;

}

#steps .box .title {

	font-size: 30px;

	line-height: 30px;

/* 	height: 30px; */

	font-weight: 200;

	margin-top: 1px;

	margin-bottom: 5px;

/* 	display: inline-block; */

}



#allinclusive .text div {

	float: left;

	min-height: 55px;

/* 	width: 50%; */

	display: flex; /* to support vertical centering */

	align-items: center; /* to support vertical centering */

}

#allinclusive .text img {

	margin-right: 20px;

	float: left;

}



#footer {

	background-color: #00a7e1;

	box-sizing: border-box;

	width: 100%;

	padding: 30px;

	padding-bottom: 50px;

	font-size: 14px;

}

#footer .col {

	box-sizing: border-box;

	padding-right: 20px;

	width: 25%;

	float: left;

	margin-top: 20px;

}

#footer .col .title {

	font-weight: bold;

}

#footer .col a {

	text-decoration: underline;

}



/*mobile 320px width*/

@media screen and (max-width: 767px)

{

	#mainmenu {

		display: none;

	}

	

	#buttons {

		display: none;

	}



	.section {

		padding: 30px 30px 50px 30px;

	}

	.section .title,

	,section .h4 {		

		font-size: 40px;

	}

		

	.section img.solo {

		box-sizing: border-box;

		width: 100%;

		margin-bottom: 20px;

		padding: 0;

		display: block;

		margin-top: 0px;

	}

	.section img.solo.left,

	.section img.solo.right {

		margin-left: 0px;

		margin-right: 0px;

	}



	.slide {

		padding-left: 30px;

		padding-top: 72px;

	}	

	#slide1 .title {

		font-size: 84px;	

		line-height: 84px;

		height: 84px;	

	}

	#slide1 .title2 {

		font-size: 84px;	

		line-height: 84px;

		height: 84px;

		margin-top: -10px;

	}

	#slide1 .desc {

	    clear: both;

		font-size: 22px;

		margin-left: 30px;

		margin-top: -5px;

	}

	#slide1 .price,

	#slide2 .price {

		clear: both;

		float: left;

		width: 100%;

		background-size: 300px auto;		

		width: 300px; 

		padding-right: 50px;

		height: 136px;

		font-size: 20px;

		margin: 0;

		margin-top: 60px;

	}

	#slide1 .price span,

	#slide2 .price span

	{

		font-size: 48px;

		margin-top: -6px;

		display: inline-block;	

	}

	#slide2 {

		padding-top: 82px;

	}

	#slide2 .title {

		font-size: 48px;

		height: 56px;

	}

	#slide2 .title2 {

		margin-top: 10px;

	}	

	#slide2 .desc {

		font-size: 18px;	

	}

	#slide2 .price {

		margin-top: 20px;

	}

	

	#contactbar {

		padding-left: 20px;

		padding-right: 20px;

		font-size: 18px;

/* 		display: flex; */

/* 		align-items: center; */

		line-height: 18px;

	}



	.half {

		width: 100%;

	}

/* 	#allinclusive .text div { */

/* 		width: 100%; */

/* 	} */



	#mobilemenu {

		display: inline-block;

		height: 26px;

		width: 43px;

		float: right;

		background: url(../images/menu.png) no-repeat;

		margin: 22px 30px;

	}

	#mainmenu {

		box-sizing: border-box;

		margin: 0px;

		padding: 20px;

		background: #a1abad;

		width: 100%;

		left: 0;

		top: 70px;

		z-index: 10000;

		position: absolute;

	}

	#mainmenu li {

		float: left;

		display: block;

		width: 100%;

	}

	#mainmenu li a {

		font-size: 16px;

		font-weight: 500;

		white-space: nowrap;

		height: auto;

		line-height: 40px;

	}

	#mainmenu ul li a:after {

		content: " ";

		margin-right: 0;

		margin-left: 0;

	}

	#mainmenu li a:hover, #mainmenu li a.active {

		color: #00a7e1;

	}



	#footer .col {

		width: 50%;

	}

	#footer .col.third {

		clear: both;

	}

}