/* MAIN STRUCTURE CSS */



*{padding:0px; margin:0px; font-family: sans-serif; }
HTML{width:100%; overflow-y: scroll;}
BODY {width:100%; margin: 0px; padding:0px; font-size:16px; }


/* VARIABLES */
:root {
    --vaillant: #00917e;
    --light_green: #669933;
    --dark_green: #117754;
    --grey_heavy:rgba(10,10,10,.9);
    --grey_medium:rgba(10,10,10,.5);
    --grey_light:rgba(10,10,10,.2);
    --orange:darkorange;
    --table_borders:#698;
    --fl:24px;
    --fxl:36px;
    --fm:20px;
    --fn:16px;
    --fs:14px;
    --fxs:12px;
    --fxxs:11px;
    --th:rgba(86,191,12,.05);


    --main:#00917e;
    --darkgreen:#007465;
    --lightgrey:#E6E8EB;
    --darkgrey:#8A9096;
    --greytext:#878E93;
    --formgrey:#CACDD1;
    --orange: #FF8500;
    --tc:#1D2A39;
    --vaigrad:radial-gradient(88.61% 153.85% at 50.77% -25%, #0FA08D 0%, #008E7B 100%);
    --tableborder:#aaa;
}




img {outline: none;}
a{text-decoration:none;outline:none;color:#555}
@font-face {font-family: icons; src: url(font-awesome/fonts/FontAwesome.otf);}
.icons, .index .searchDugme {font-family: icons;}
p {line-height:1.7em}
  @font-face {font-family:vaillant; src:url('vaillant/vaillant.ttf');}
  @font-face {font-family:vaillantL; src:url('vaillant/vaillant_L.ttf');}
  @font-face {font-family:vaillantB; src:url('vaillant/vaillant_B.ttf');}
   @font-face {font-family:vaillanticons; src:url('vaillant/vaillanticons.css');}

/* DISPLAY NONE */

.mob_main_menu, .poruciTekst {display:none;}
.oblast_strane{margin:0 auto;}
.index .oblast_strane {
	background: #eeeeee;
position:relative;
	
}

.index .oblast_strane:before{
	_background: url('../../cms_upload/pages/files//244_vai-reference-lafarge-18.jpg') no-repeat;
background-size:contain;
	
	width:100%;height:100%;
	top:0;;left:0;
	position:absolute;

	z-index:-1;
	content:"";
	
}
.index .oblast_strane:after{
	width:100%;height:100%;
	top:0;;left:0;
	position:absolute;
	background: rgb(255,255,255);
background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 8%, rgba(255,255,255,.8) 18%,rgba(255,255,255,.4) 100%);
	z-index:-1;
	content:"";
	
}

.index #coll_middle{
	background: #eee;
	width:1136px;margin:auto;
}
.top_baner {width:100%;margin:0 auto;}
.oblast_sadrzaja{display: inline-block;width:100%;margin:0 auto;position:relative; padding: 60px 0;
}
.doming .oblast_sadrzaja, .novosti .oblast_sadrzaja, .strana .oblast_sadrzaja, .download .oblast_sadrzaja, .kontakt .oblast_sadrzaja {margin:0px auto 20px auto;font-size:0;width:1200px;}
.katalog .oblast_sadrzaja {margin:0px auto 20px auto;width:1200px;}
.registrator .oblast_sadrzaja {width:1200px;}
.prekidFloat{	clear:both;	float:none;}
#redirectMe{
	display: none;
}

/* < NAVIGACIJA > */

.sideCatNav{background: #8af; overflow-x: hidden; overflow-y: scroll; height: 380px; }
.level-root{display: none}
.level-root:first-child{display: block; }
.level-root > a{font-size:18px; border-bottom:1px solid #888; padding:10px 0; display:block; }
.sideCatNav ul li {list-style: none; padding:1px 8px; }
.sideCatNav ul li a {display: block; color:#eee }
.sideCatNav ul li a:hover{color:#ccc; position: relative; }
.level-1 a:hover:after{content:""; width:4px;height:10px; background: red; position: absolute; top:3px; left:-2px; }
.sideCatNav ul li ul {}
.sideCatNav .level-0 > a{font-size:14px; text-transform: uppercase; line-height: 100%; padding:10px 0 0 0; }
.sideCatNav .level-0:last-child > a{padding:10px 0 20px 0 }
.sideCatNav .level-0 ul{border-left:1px dashed #ccc }
.sideCatNav .level-0 ul a{font-size:13px; text-transform: uppercase; padding:0 6px; }
.sideCatNav .level-4 {padding: 1px 4px}
.sideCatNav .markItem{color:#69b; font-weight:bold; color:#fff; border-bottom: 2px solid #579; }
.sideCatNav .markItem:before {content:""; width:7px; height:10px; display:inline-block; background:#469; border-left:3px solid #579; border-right:3px solid #579; margin-right:6px; }


.PageTrackNav {
	width:1080px;
	margin:auto
}
.PageTrackNav li{
	display: inline-block;
	position: relative;
}
.PageTrackNav li:after{
	content:"/";
	color:#555;
	position: absolute;
	top:10px;right:0;
}
.PageTrackNav li a{
	color:#555;
	padding:10px 20px 0 10px;
	display: block;
}

/* < END NAVIGACIJA > */

/* < ELEMENTI ZAGLAVLJA > */

/* HOMPAGE */
.oblast_zaglavlja{border:none;box-shadow:unset;position:relative;background:#fff} 
.oblast_zaglavlja_inner{width:960px;margin: auto;height:124px; position:relative; }

  .traka {width: 100%!important; position: fixed;left: 0; right: 0; top: 0; background:#00917e; height: 50px; color: #fff; font-family: vaillant, sans-serif; font-size: 15px; 
font-weight: normal; z-index:1000}
.traka .wrapperTraka {width: 1136px; display: flex; margin: auto; }
.traka .wrapperTraka .item {display: flex; margin-top:1%;width: 375px;   }
.traka .wrapperTraka .item .itemIcon {margin-left: 5px}
.traka .wrapperTraka .item .itemTitle {margin-left:10px}
  
.index .traka {width: 100%; position: fixed;left: 0; right: 0; top: 0; 
background:#00917e; height: 50px; color: #fff; font-family: vaillant, sans-serif; font-size: 15px; font-weight: normal; 
box-shadow: unset; z-index: 100; }
.index .traka .wrapperTraka {width: 1136px; display: flex; margin: auto; }
.index .traka .wrapperTraka .item {display: flex; margin-top:1%;width: 375px;   }
.index .traka .wrapperTraka .item .itemIcon {margin-left: 5px}
.index .traka .wrapperTraka .item .itemTitle {margin-left:10px}

.button_prodaja {
	display:none;
	position: absolute;
  right: 2.6%;
  top: 6rem;
  background:#ff8500;
  color: #fff;
  padding: 3px 20px;
  font-family: vaillant, sans-serif; 
  font-size: 1.01rem;
  font-weight: normal;
  border: 1px solid #ff8500
  
}
.button_prodaja a{text-decoration: none;color: #fff;}

.zaglavlje_content {width:1200px;padding:0 32px; margin:0 auto;position: relative; box-sizing: border-box} 
.glavni_meni {list-style-type: none; width: 960px;  margin: 0 0 0 170px;box-sizing:border-box;  }
.glavni_meni ul{text-align: left;padding-left:20px} 
.glavni_meni ul > li{display:inline-block;vertical-align: top; position: relative;}
.glavni_meni ul > li:nth-child(2):before{content: "\f0d7"; position: absolute; margin-top:9px; font-family: icons; margin-left: -12px; font-size: 12px }
.glavni_meni ul > li:nth-child(4):before{content: "\f0d7"; position: absolute; margin-top:9px; font-family: icons; margin-left: -12px; font-size: 12px }
.glavni_meni ul > li:nth-child(5):before{content: "\f0d7"; position: absolute; margin-top:9px; font-family: icons; margin-left: -12px; font-size: 12px }
.glavni_meni ul > li:nth-child(7):before{content: "\f0d7"; position: absolute; margin-top:9px; font-family: icons; margin-left: -12px; font-size: 12px }


.glavni_meni ul li ul{position: absolute;  border: 1px solid #ccc;top: 40px;right: -724%;width: 1136px;z-index: 100;padding: 22px 1px;background: #fff;display: none;box-sizing: border-box;}
.glavni_meni ul li ul li {display: inline-block; background: #fff; columns: 280px auto; }
.glavni_meni ul li ul li a { background: none!important;}
.glavni_meni ul li ul li a:hover{text-decoration: underline!important; }

.glavni_meni ul li:nth-child(4) ul{
  right: -361%;
}
.glavni_meni ul li:nth-child(4) ul li{columns: 300px auto; }
.glavni_meni ul .mainMenuOver ul li ul {box-sizing: border-box; position:absolute;}
.glavni_meni ul .mainMenuOver ul li ul li { width: 100%; display: block; position: absolut;} 

.glavni_meni ul li:nth-child(4) ul li ul {box-sizing: border-box;}
.glavni_meni ul li:nth-child(4) ul li ul li{display: inline-block; padding: 1px 0; }


.glavni_meni ul > li > a{text-decoration: none; display: block; padding: 3px 20px; color: #333;margin: 4px 0 14px 0; font-size: 14px } 
.glavni_meni ul > li > a:hover{color:#666; background: #faf8f3;}
.logoHome{width:158px;}
.logoHome a{display: block; width:100%;height:auto; margin:0;  box-sizing:border-box;padding:60px 0 0 0; }
.logo a img{display: block; width: 100%;height:auto; padding:10px; box-sizing: border-box; }
.catalog_search{position: absolute;top:14px;right:14px; z-index: 10; }

.meni{position: absolute;bottom:60px;left:220px; width:650px;}
.meni .iconsA a:before {content: "\f015";font-family: icons;color: #007465;}
.meni .iconsB a:before {content: "\f0ad";font-family: icons;color: #007465;}
/*.meni .iconsC a:before {content: "\f007";font-family: icons;color: #007465;}*/
.meni .iconsA a, .meni .iconsB a {font-size: 1.25rem;top: 0.25;line-height: 1rem;width: 1.25rem;}
.meni li:nth-child(2), .meni li:nth-child(1) {float: left;}
.meni .prvaIcon, .meni .drugaIcon, .meni .trecaIcon {display: flex; box-sizing: border-box;}
.meni .trecaIcon{padding-left: 3%}
.meni .opisMeni a{margin-left: 10px; text-decoration: none; }
.meni ul li{display: block;  box-sizing: border-box; margin-left: 20px; }
.meni a{font-size: 17px; text-decoration: none; color: #444}

.meni li:hover {background: #faf8f3; color: #007465;}
.meni-icon{position:absolute;bottom:85px;right:20px; color:#007465;  }
.meni-icon ul li{display: inline; padding: 15px; }
.nadji:before{content:"\f002"; font-family: icons; color: #007465; }
.prijava:before{content:"\f090"; font-family: icons; color: #007465; }
.meni-icon .nadji a, .meni-icon .prijava a {margin-left: 7px; color: #444; font-size: 15px}
.meni-icon .nadji a:hover, .meni-icon .prijava a:hover{text-decoration: underline;}


/*BOCNA NAVIGACIJA*/

#bocnaNavigacija{background:#00917e;position:fixed;top:200px;right:0;margin-right:-160px;transition:all 1s;}
#bocnaNavigacija:hover {margin-right:0%;}
#bocnaNavigacija li{width:200px; height: 40px; list-style:none;  }
#bocnaNavigacija li:hover {margin-right:0px;background: #007465;}
#bocnaNavigacija li a{color:#fff;}
#bocnaNavigacija li:nth-child(4){ border-bottom: none;}
#bocnaNavigacija li .icons {display: inline-block;width:50px; margin-left: -3%; font-size: 20px; text-align: center; position: absolute;  margin-top:5% }
#bocnaNavigacija li span{display: inline-block;width:123px;padding: 15px 0 0 6px;font-family: vaillant, sans-serif; font-weight: normal; font-size: 1em; display:none; border-right: 4px solid #ccc; height: 1.8em;  }
#bocnaNavigacija:hover li span{display: inline-block;width:128px;padding: 15px 0 0 6px;font-family: vaillant, sans-serif; font-weight: normal; font-size: 1em;}
#bocnaNavigacija:hover li .icons  {display: inline-block;width:56px; font-size: 20px; text-align: center; margin-top:5% }
#bocnaNavigacija li {border-bottom: 4px solid #ccc;}

/*
.oblast_zaglavlja{border:none;box-shadow:unset;}
.oblast_zaglavlja{border:none;box-shadow:unset;}
.zaglavlje_content { margin:0 auto;}
.zaglavlje_content{height:auto;}
.logoPages{display:none;}
.logoHome{display:inline-block;}
.sign {display:none;}
.logo {padding:24px 0 0 0;width:200px;z-index: 200;position:relative;margin: 0 auto;}
.logo a{display:inline-block;width:100%;height:100%;}
.logo a img {display:inline-block;width:100%;height:auto;}
.vaillant-smiley{display:inline-block;position: absolute;top:0;left:0;right:0;margin:0;padding:0; font-size:0; }
.vaillant-smiley > div{display: inline-block; width: 40px; vertical-align: top; }
.vaillant-smiley .image-holder{width:516px; height: auto; }
.vaillant-smiley .image-left, .vaillant-smiley .image-right{height:120px; width:calc((100% - 516px)/2); }
.vaillant-smiley .image-left img, .vaillant-smiley .image-right img{display: block; width:100%; height:100%; }
.map_container{display: none;}
.glavni_meni {display: block; background:#fff; list-style-type: none; max-width: 1100px; position: relative; margin:30px auto 0 auto; border: none; }
.glavni_meni ul {padding-top:14px;}
.glavni_meni > ul:after{width:100%;height:60px; content:""; position: absolute; top:100%;left:0; background: #fff; z-index: 0; }
.glavni_meni > ul {text-align: left;font-size:0;padding-left:15px;position:relative;box-sizing:border-box;width:100%;height:auto; ; }
.glavni_meni >ul>li{background-color:#00917E;color:#eee}
.glavni_meni >ul>li:first-child{background:#fff;color:#098;}
.glavni_meni ul > li{display:inline-block;vertical-align: top;padding:0px 15px;border-right:1px solid #FFFFFF;}
.glavni_meni ul > li > a{text-decoration: none; display: block; padding: 10px 10px 10px 10px; font-size: 14px; position: relative; cursor: pointer; color:inherit; }
.glavni_meni > ul > li:hover {background:#076}
.glavni_meni >ul>li:first-child:hover{background:none; }
.glavni_meni > ul > li >ul{position: absolute; z-index: 10; border-bottom:1px solid #076; width:970px}
.glavni_meni > ul > li >ul .glavnimeni_active{font-weight: bold; color:#076}
*/
.navigatorStrana{
	width:auto;
	margin: auto;
	padding:40px;
}
.navigatorStrana td .NScurLink{
		border:1px solid #ccc;
	padding:10px 20px;
	background: #ccddd8;
}
.navigatorStrana td a{
	padding:10px 20px;
	border:1px solid #ccc;
	color:#666
}

/* PRETRAZIVAC */

#brzi_pretrazivac {display:none;}

/* </ ELEMENTI ZAGLAVLJA > */


/* NAVIGACIJA */

#coll_left, #coll_right {margin:28px 0 0 0;}
#coll_left h3 a, #coll_right h3 a{color: #9a9a9a;}
.bocniMeniStrane {}
.bocniMeniStrane li {list-style:none;border-bottom:1px solid #ededed;box-sizing:border-box;position: relative;}
.bocniMeniStrane .markerStrane a, .markerKategorije > a{border-bottom:1px solid #d1382f;}
.bocniMeniStrane .markerPodStrane > a{}
.bocniMeniStrane li a {font-size:14px;color:#9a9a9a;padding:12px 0;display:inline-block;}
.bocniMeniStrane li a:after {position: absolute; left: 0; bottom: -1px; width: 0; height: 1px; background-color: #d9251a; content: ""; transition: width 0.2s;}
.bocniMeniStrane li a:hover {  }
.bocniMeniStrane li a:hover:after {  width: 100%;}
.bocniMeniStrane li ul li a {margin-left:6px;border-bottom:1px solid #fff;}
.bocniMeniStrane li ul li a:after {  background-color: #0086d1;}
.bocniMeniStrane li ul li a:hover {}

/* < ELEMENTI POCETNE STRANICE > */
.boxevi { width: 85%;margin: auto}
.boxevi ul{display: flex; width: 100%; justify-content: space-around}
.boxevi ul li{list-style: none; color: #fff; background: #00917e; padding: 10px 64px; margin: auto; margin-right: 20px}

.pageBody{background: #fff8; max-width: 1000px; padding:0 32px; position:relative; margin:  auto; }
.wrapper-container{text-align: center; }
.inner-fixed {}
.inner-fixed > h2{ text-align: left; padding:60px 60px 10px 60px; font-size:2.6em}
.inner-fixed > p{width:600px; text-align: left; padding:20px 60px }
.pageBody>h2{padding: 12px 0px 12px 0px;font-weight: normal;font-size: 1.6rem}
.pageBody>p{display:inline-block; font-size: 16px; background-color:white;width:820px; padding:12px; }

.index .horizontal-wrapper {font-size:0;width:100%;}
.index .homebox {display:inline-block;box-sizing:border-box; background:#ccddd8; width:280px; vertical-align: top; height:530px;margin:12px 6px 6px 6px;}
.index .homebox .picture-holder a img{width:410px;height:auto;margin:0 auto;}
.index .textbox {text-align:left; padding:1rem;}
.index .textbox h2 a {text-decoration:none;font-size:1.5rem; font-weight:normal;display:block;color:#027465; }
.index .textbox p {font-size:14px; padding-top:1rem;}
.index .picture-holder {max-height:300px;overflow: hidden;}
.index .picture-holder a{display:block;width:100%;height:100%;}
.index .picture-holder a img{	display:block;	width:100%;height:auto;}
.index .homebox:hover{background-color:#f4f4f4; -webkit-transition: background-color .5s ease-out; -moz-transition: background-color .5s ease-out; -o-transition: background-color .5s ease-out; transition: background-color .5s ease-out; }

.index .page-pID{
	display:inline-block;box-sizing:border-box; background:#ccddd8; width:280px; vertical-align: top; height:460px;margin:12px 6px 6px 6px;
}
.index .page-pID .img{
	max-height:260px;overflow: hidden;
}
.index .page-pID .img a{
	display:block;width:100%;height:100%;
}
.index .page-pID .img a img{
	display:block;	width:100%;height:auto;
}

.index .info{
	text-align:left; padding:1rem;
}
.index .info h2{
	height:60px
}
.index .info a{
	text-decoration:none;font-size:1.5rem; font-weight:normal;display:block;color:#027465; 
}
.index .info .antrafile{
	text-align:left; padding-top:1rem;
	line-height: 1.7em
}
/* </ ELEMENTI POCETNE STRANICE > */


/* < ELEMENTI STRANICA > */

#coll_right{box-sizing: border-box; padding:30px}

/*REFERENCE LISTA STRANA*/
.reference #coll_middle{width:1100px; margin:auto; }
.reference .oblast_sadrzaja{padding-top: 30px;
}
.pages{width:1000px; margin: auto }
.reference h1, .reference .catShortDesc{padding: 20px}
.reference .antrafile {line-height:1.6em}
 
.reference .pages .img{display: block; height:auto; }
.reference .pages img{display: block; width:100%;height:auto; }
.reference .page-pID{display: inline-block; padding:10px }
.reference .page-pID .info{font-size: 16px; }

.reference .page-pID .info h2{padding:0; height:110px; }

.reference.catid_10 .catShortDesc{display: none}
.reference.catid_10 .page-cID{display: block; border-bottom: 1px solid #ccc; padding-top: 30px; }
.reference.catid_10 .page-cID a{font-size:26px; font-weight: normal }
.reference.catid_10 .page-cID .img, .reference.catid_10 .page-cID .moreinfo{display: none}
.reference.catid_10 .page-pID{width: 28%;display: inline-block; vertical-align: top; }
.reference.catid_10 .page-pID a{font-weight:normal; display: block;padding:20px 0}
.reference.catid_10 .page-pID a span{padding:6px 3px 4px 3px; display:block; border:1px solid #076; width:80px; text-align: center;}
.reference.catid_10 .page-pID img{width:100%; display: block;}
.reference .phoneLayout{width:1100px; margin: 30px auto 60px; text-align: left }
.reference .phoneLayout .page-pID{border-left:1px solid #fff; 
width:28%; vertical-align: top; margin: 10px;
}

.reference .phoneLayout .page-pID img{
	display: block; width:100%;
}
.reference .phoneLayout .page-pID .info h2 a{
	display: block; padding: 30px 0; text-align: left; font-weight: normal;
color:#555;
	line-height:1.4em
}

.reference .pageBody  {
	padding:30px;
	box-sizing: border-box;
}

.reference .pageTitle{
	width:1000px;
	margin: auto;
	font-weight:lighter;
	padding:20px 0;
}
.reference .objekatKontejner{
	float:left;
	margin:10px 30px 30px;
	padding-right: 30px;
	border-right:1px solid #fff;

}
.reference .objekatKontejner ul{
	padding: 10px 0
}
.reference .objekatKontejner li{
	list-style-position: inside;
	padding:6px 0;
}

.referenceCnt{
	width:1024px;
	margin: auto;
}
.referenceCnt .pageTitle{
	color:#487;
	font-weight: normal;
	padding: 20px 0
}

.referenceCnt .objekatKontejner{
	padding: 40px;
	
	
}
.referenceCnt .objekatKontejner > ul{
	padding-top:20px;
	
}
.referenceCnt .objekatKontejner >ul > li{
	list-style: square;
	list-style-position: inside;
	padding: 3px
}

.reference .opisSistema{
	padding:0 30px;
	min-height:300px;
	display: block;
}

.reference .opisSistema p, .reference .opisSistema ul{
	padding:10px 0;
	font-size:16px;
	line-height:1.8em
}
.reference .opisSistema h3{
	padding:20px 0 10px 0;
}
.embdgallery{
	font-size: 0;
	width:1000px;
	margin: auto;
}
.embdgallery li{
	display: inline-block;
	vertical-align: top;
	width:33.33%;
	box-sizing: border-box;
	outline: 2px solid #fff;
	font-size:initial;

	
}

.embdgallery li:nth-child(3n){

}
.embdgallery li a{
	display: block;
	
}
.embdgallery li a img{
	display: block;
	width:100%;
}

/*APP DESKTOP*/
.app.catid_14 {
	
}
.app.catid_14 h1{
	font-size:24px;
	text-align: center;
	font-weight:lighter;
}
.app .button{
	background: var(--vaillant);

	width:260px;
	border:1px solid #eee;
	margin:20px auto;
	border-radius:6px;
	text-align: center;
	padding: 16px;
	box-sizing: border-box;
	color:#fff;
	
}
.app.catid_14 #objekti{
	padding: 20px
	
}
.app .button a{
	color:#eee;
	display: block;
}
.app .button:hover{
	filter:opacity(.8)
}

.app #forma{
	display: block;
	_flex-wrap: wrap;
	
}

.app #forma >div{
	width:50%;
		text-align:center;
	margin:auto;
	padding: 20px;
}
.app #forma .button{
	width:100%;
	background: none;
}

.app #forma .button{
		background:var(--main);
}
.app #forma .button,
#addDevice{
	width:200px;
	display: block;
	padding: 16px;
	
	margin:20px auto;
	color:#eee;
	border-radius:6px;
	box-sizing: border-box;
	line-height: 1.2em;
	cursor: pointer

}
#addDevice{
		background:var(--orange);
	padding: 14px
}
.app #forma #dalje{
	display: none
}

.app #forma input,
.app  #forma select{
	font-size:var(--fn);
	padding:12px;
	width:220px;
	 margin: 10px auto 20px auto;
}
.app #forma div.page{
	border:1px solid var(--vaillant);
	margin:30px auto;
	border-radius:10px
}
.app #forma div.page h3{
	font-weight:normal;
	padding: 10px 0 20px 0;
	color:var(--main)
}
.app #checkOprema table{
	table-layout: auto;
	width:100%;
	vertical-align: middle;
}

.app #checkOprema table td:last-child{
	width:40%;
	
}
.app #checkOprema table td:first-child{
	width:60%;
	text-align: right;
	
}
.app #forma table input{
	width:100px;
}

.app #upload{
	border:1px solid var(--main);
	width:700px;
	margin: auto;
	padding: 30px;
	box-sizing:border-box;
	border-radius:6px
}


.app #forma #korak1{
    background:#00917E33;
    text-align: center;
    margin:20px auto;
    border-radius:8px;
}

.app #forma input{
    padding: 14px;
    border-radius:8px;
    width: 90%;
}
.app #korak1{
    background: none;
    margin:auto;
    text-align: center;
    box-sizing: border-box;
}
.app #upload #korak1, .app #upload #korak2{
	display:none;
	
}
.app #upload #korak1.active, .app #upload #korak2.active{
	display:block;
	
}
.app #korak1 p{
    padding: 10px
}
.app #korak2{
    background: none;
    text-align: center;
    margin-top:20px;
}
.app #korak2 select{
    width:80%;
    margin:14px 0 0 0;
    background: #fff;
    border-radius:6px;
    border:1px solid var(--main);
    padding:16px;
}

.app #napomena{
	border:1px solid var(--main);
	width:95%;
	margin:auto;
	min-height:100px;
	border-radius:6px
	
	
}

#uslov{
    text-align: center;
    border:1px solid #888;
    border-radius:6px;
    box-sizing: border-box;
    padding: 10px;
}
#uslov input{
    padding:20px;
    display: block;
    margin:20px auto;
    width:24px;height:24px;
}


#progressbar{
    display:none;
    background: #fff;
    width:80px; height:80px;
    border-radius:50%;
    margin: auto
   

}
#progressbar img{
     width:40px;
    margin:auto;
    padding-top:18px
}

#izbor1{
    
    display: block;
    width:90%;
    margin:20px auto;
}
#izbor1 input{
    width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}
#izbor1 input + label {
    font-size: 1.25em;
    color: white;
    background-color: #4a9;
    display: inline-block;
    padding:16px 20px;
    border-radius: 5px
}

#izbor1 input:focus + label,
#izbor1 input + label:hover {
    background-color: #298;
}



/*PREGLED OBJEKATA*/

.app .kontejnerReferenci{
	border:1px solid #eee;
	display: flex;
	flex-wrap: wrap;
 justify-content: center;
	gap:20px;
	margin-top:40px
}

.app .objekatKontejner{
	flex-grow: 1;
	width:400px;height:280px;
	padding: 30px;
	border:1px solid var(--main);
}


.app .innerObjekatKontejner{
		position: relative;
}
.app .objekatKontejner ul h3{
	padding: 0 0 30px 0;
}
.app .innerObjekatKontejner:hover .opisSistema{
	display: block;
	position: absolute;
	bottom:3px;left:3px;
	background: #fff;
	padding: 20px;
	width:400px;
	border:1px solid #555
}




.innerObjekatKontejner {
    text-align: left;
    _padding: 20px;

    position: relative;
     display: block;
     border:1px solid #eee;
    
}

.objekatKontejner h3{
    font-size:15px;
    color:#599
}
.objekatKontejner ul {
    padding:20px 0;
}
.objekatKontejner ul li{
    font-size:14px;
    list-style: none;
    margin:0 0 0 10px;
    padding:7px 0 0 10px;
    border-left:1px solid #ccc;
    text-align: left;
    
}

.opisSistema{padding: 0 0 10px; line-height: 1.3rem;font-size:12px; display:none}

.embdgallery li{list-style: none}
.innerObjekatKontejner .images{
        text-align: center;
    border-top:1px solid #eee;
        padding-top:4px
}
.innerObjekatKontejner .images a{
   display: inline-block;

    width:30%;
}
.innerObjekatKontejner .icons{
    display: block;
    position: absolute;
    top:16px; right:0px;
    _border:1px solid #ccc;
    padding:3px;
    border-radius:50%;
    width:40px;height:40px;
    box-sizing:border-box;
}

.innerObjekatKontejner .icons:after{

    width:100%;height:auto;
    position: absolute;
    bottom: 0px;right:0;
    font-size:40px;
       
}
   
.ikonicaStatusa-1:after{
   content:"\f058";
    color:#7ca;
}
   
.ikonicaStatusa-0:after{
   content:"\f017";
    color:#ded ;
}

.datumObjekta{
    position: absolute;
    top:-10px;right:20px;
    font-size:16px;
    background: #fff;
    border:1px solid var(--main);
    color:var(--main);
    padding: 3px 10px 1px 16px;
    
    
}
/


/* </ ELEMENTI STRANICA > */

/* REGISTRATOR */

#myaccount_style .myAcc_container{width:70%;}
#myaccount_style{width: 960px; padding: 10px; background: #fff; margin: auto; text-align:center }
#myaccount_style .contentTABLE{width:100%; border-collapse:collapse; }
#myaccount_style .contentArea{vertical-align:top; padding:0px; }
#myaccount_style input{display: block; text-align: center; margin:auto; padding:10px 10px; width: 60%; }
.form_container{background: #fefefe; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f7f7f7)); background: linear-gradient(top, #ffffff 0%,#f7f7f7 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f7f7f7',GradientType=0 ); -webkit-border-radius: 3px; border-radius: 3px; border:1px solid #d4d4d4; margin:5px 5px 5px 5px; -webkit-box-shadow: 0px 0px 4px #e1e1e1; padding:10px 0px 10px 10px; }
#ulogujte_se {width:600px;
margin:auto;
text-align:center;
	border-radius:10px;
	padding: 10px;
	box-sizing: border-box;
	

}
#ulogujte_se H3{font-size:22px; color:#696969; text-transform:uppercase; padding: 30px; font-weight:lighter}
#ulogujte_se P{padding:5px 0px 0px 0px; color:#696969; }
#ulogujte_se INPUT, #registrujte_se INPUT{
	border:1px solid #cfcfcf; 
	font-size: 14px; padding: 12px; 
	color:#444; 
	background:; 
	display: block;
	margin:auto;
	border-radius:6px;
	
}
#ulogujte_se #dugme_login, #registrujte_se #dugme_login{
	border:1px solid #fff; padding:16px; background:#999999; cursor:pointer; color:#fff; text-transform:uppercase; font-size:14px; margin:20px auto 30px auto;width:200px; }
#registrujte_se {}
#registrujte_se P{text-align:left; padding:0px 0px 5px 0px; color:#ababab; }
#registrujte_se H3{font-size:14px; color:#696969; text-transform:uppercase; margin-bottom:10px; }
#registrujte_se P LABEL{margin-bottom:0px; display: block; }

.hederBoksa{font-size:20px; font-weight:normal; padding:10px 0; }
.registratorTabela{border:1px solid #ddd; padding:10px; border-collapse: collapse; }
.registratorTabela th{background:#45a; color:#eee; padding:8px; }
.registratorTabela td{border:1px dashed #ddd; border-top:none; padding:0 7px; }
.registratorTabela .coll_image{width:180px; }
.registratorTabela img{display: block; width:130px; }
#myaccount_style .menuArea {width:240px; vertical-align:top; display: none}
.menuArea UL{border:0px solid red; margin-left:25px; margin-bottom:20px; }
.menuArea UL LI{list-style:none; margin-bottom:5px; background:url(../../site_images/sadrzaj/senka_lista_mojprojekat.gif) no-repeat 0% 100%; }
.menuArea UL LI A{text-decoration:none; color:#515151; padding-top:15px; display:block; margin-left:10px; }
.menuArea UL LI A:Hover{text-decoration:none; display:block; background:url(../../site_images/sadrzaj/senka_lista_mojprojekat_over.gif) no-repeat 0% 100%; }
.menuArea .markerStrane{background:url(../../site_images/sadrzaj/senka_lista_mojprojekat_over.gif) no-repeat 0% 100%; }

.importantNotice{
	text-align: left;
	width:500px;
	margin: 30px auto
}
.importantNotice ul{
	padding: 20px
}
.importantNotice ul li{
	margin-left:1.4em;
}
/* ELEMENTI FOOTERA */


.footer-logotip {display: flex; padding-left: 70%; padding-top: 25px;}
.logo-slika img{width: 128px; display: inline; box-sizing: border-box; }
.logo-text{font-family: vaillant, sans-serif; font-weight: normal; font-size:  1.2rem; margin-top: 11px; }
.footer-logotip > div {padding-right: 10px}
.oblast_futera{background:#fff; color: #333;}


.footer-navigation{width: 1136px; margin: auto;}
.footer-navigation a{text-decoration: none; color: #444;}
.footer-navigation a:hover{text-decoration: underline;}

.footer-body {display:flex; width: 100%; margin:40px auto;}
.footer-body h3{font-size: 1rem; font-family: vaillant, sans-serif; font-weight: normal; margin-bottom: 6%}
.footer-body ul li {list-style-type: none; padding-top:7px; font-size: 0.75rem; font-family: vaillant, sans-serif;  }
.footer-body >div {padding: 0 80px;}


.footer-napomene{
	background: #fff;
	padding: 30px 0
	
}
.footer-napomene li{
	list-style: none;
}
.footer-napomene > div{
	display: block;
}
.footer-napomene .napomene-tekst{

	
}
.footer-napomene .napomene-tekst ul{
		display: flex;
	gap:50px;
	padding: 20px 0 60px 0;

}
.footer-napomene .napomene-tekst ul li{
		padding: 20px 60px 20px 0;
}
.footer-napomene .napomene-mreze ul{
	display: flex;
	gap:20px;
	justify-content: flex-end
}
.footer-napomene .napomene-mreze .mreze li{
	width:40px;
}
.mreze li a img{
	display: block;width:100%;
}


/*
.oblast_futera {width:100%;height:100%;background-color:#ffffff;padding-top:10px; }
div.site-logo{display:block;position:relative;text-align:right;font-size: 22px;}
.footer_container{box-sizing:border-box;margin:0 auto;font-size:1em;max-width:1200px;padding-bottom: 54px;}
.footer_container li{display:inline-block ;width:226px;;vertical-align: top;font-size: 0.8rem;padding-right:52px;padding-bottom:8px;}
.footer_container h3{font-weight:normal;font-size: 16px;padding-bottom: 28px;padding-top:40px;}
.footer__meta-wrapper p{display:block;padding-top:48px;padding-bottom:12px;text-align:left;}
.footer__meta-wrapper li{display:inline-block;padding-top:0px;padding-right:20px;padding-bottom:0px;margin-right:12px;text-align:left;width: auto;border-right:1px solid #505050;}
.footer__meta-wrapper li:nth-child(4){border-right:0;}
.social{text-align:right;padding-top:34px;}
.social li{width:auto;padding:2px;}
*/
/*doadati iconicu Vaaillant Group*/
/*
.footer__meta-wrapper li:nth-child(4):after{content:"\2e";}
.footer_linksContainer {padding-bottom:44px;position:relative;width:60%;vertical-align: top;}
.footer_links {width:30%;vertical-align: top;}
.footer_links:first-child {width:40%}
.footer_links h3 {padding:0 0 10px 0; }
.footer_links h3 a {color:#0a5f9e;text-transform:uppercase;font-size:1em;}
.footer_links li a{color:#005ea6;font-size: 1em;    transition:All 1s ease; transition:All 0.2687s ease; -webkit-transition:All 0.2687s ease; -moz-transition:All 0.2687s ease; -o-transition:All 0.2687s ease; transform: rotate(4deg) scale(1) skew(1deg) translate(10px); -webkit-transform: rotate(4deg) scale(1) skew(1deg) translate(10px); -moz-transform: rotate(4deg) scale(1) skew(1deg) translate(10px); -o-transform: rotate(4deg) scale(1) skew(1deg) translate(10px); -ms-transform: rotate(4deg) scale(1) skew(1deg) translate(10px); }
.footer__meta {display: block;text-align:left;}
.footer__meta-wrapper li{padding-top:4px;}
.footer_links li a:hover{background:#0086ec; color:#002e51; padding:5px 5px 5px 5px; transform: rotate(0deg) scale(0.805) skew(1deg) translate(300px); -webkit-transform: rotate(0deg) scale(0.805) skew(1deg) translate(300px); -moz-transform: rotate(0deg) scale(0.805) skew(1deg) translate(300px); -o-transform: rotate(0deg) scale(0.805) skew(1deg) translate(300px); -ms-transform: rotate(0deg) scale(0.805) skew(1deg) translate(300px); }
.links_drustvene_mreze {width:30%;display:inline-block;vertical-align: top;text-align: right;}
.links_drustvene_mreze h3 {color:#0a5f9e;text-transform:uppercase;font-size:12px;padding:0 36px 10px 0}
.links_drustvene_mreze span {width: 38px;height: 38px;display: inline-block;vertical-align: middle;margin: 0px 6px;box-sizing: border-box;border-radius: 30px;background: #06518a;text-align: center;overflow: hidden;}
.links_drustvene_mreze span a {height: 100%;display: flex;flex-direction: column;justify-content: center;font-size: 24px;color: #0091fc;}
.links_drustvene_mreze span:hover {background:#0091fc}
.links_drustvene_mreze span:hover a {color:#055d9f}
.footer_linksContainer:after {content:"";position:absolute;bottom:0px;left:0px;width:55px;height:1px;background:#0e76bc;display:block;}
.footer_desc {background:#00204d;padding:58px 0 40px 0;}
.footer_desc p {color:#005ca2;text-align:center;font-size:11px;text-align:left;}
*/

/* MAPA */

.map_container {background:#00204d;}
.map_container h2 {background:#ffffff;padding:3px 15px 5px 15px;}
.map_container h2 a{text-align: left; color: #0091fd;font-size: 20px;text-transform:uppercase; display: none }

/* GALERIJA*/

.embdgallery li{list-style:none; position: relative}
.embdgallery_image a{display:block;width:100%;height:100%;}
.embdgallery_image a img{display:block;width:100%;height:100%;}

.embdgallery .embdgallery_title, .embdgallery .embdgallery_desc{
	position: absolute;

	padding:4px 10px;

	background:rgba(255,255,255,.7)
}

.embdgallery .embdgallery_title{
		font-size:13px;
		top:0;left:0;
}
.embdgallery .embdgallery_desc{
		right:0px;bottom:0;
	font-size:13px;
	width:220px
}


@media (min-width:1600px){

	.proizvodjac{
		width:200px;height:60px;
		text-align: right;
		padding:0 14px;
		box-sizing:border-box;
		position: absolute;
		top:10px;right:100%;
	}


}