/* MOBILE VERSION CSS */

*{
	padding:0px;
	margin:0px;
}

HTML{	
	width:100%;
        overflow-y: scroll;
}

BODY {
	width:100%;
        font-size:14px;
        font-family: gramper,sans-serif;
}

img {
    display:block;
    width:100%;
}

a{text-decoration:none;outline:none;}
@font-face {font-family: icons; src: url(font-awesome/fonts/FontAwesome.otf);}
@font-face {font-family: Symbols;src: url('../../site_includes/css/font-awesome/fonts/FontAwesome.otf');}
@font-face {font-family: gramper; src:url(../../site_includes/css/fonts/sairasemicondensed-regular.ttf);}
@font-face {font-family: gramperL; src:url(../../site_includes/css/fonts/sairasemicondensed-thin.ttf);}
@font-face {font-family: gramperB; src:url(../../site_includes/css/font/sairasemicondensed-bold.ttf);}
@font-face {font-family: gramperBL; src:url(../../site_includes/css/fonts/sairasemicondensed-black.ttf);}

body, html,p, a, div, ul, li, h1, h2, h3, img, span{
	color:#555;
	list-style-type: none;
}
#pageTitle, .catTitle, .naslov_kategorije, .proizvodjac{
	text-align: center;padding: 20px 0 10px 0;font-weight: lighter;}

/* DISPLAY NONE */

.top_baner {display: none;}
.header-text{display:none;}
.meni_jezici {display: none;}
.editToCMS {display: none;}
.catid_4 .proizvodjaciLogo {display: none;}
#coll_left{display: none;}
.flyOutMenu {display: none;}
.glavni_meni {display: none;}
.PageTrackNav {display: none;}
.CatTrackNav{display:none;}
.handle {display: none;}


/* HEADER */

.mob_main_menu {position:absolute;top:15px;right:10px;padding:2px 4px;box-sizing:border-box; z-index: 20000;}
.mob_main_menu:after {content:"\f0c9";font-family:icons;font-size: 28px;color: #fff;
	 z-index: 20000; right: 5%; top:15%;}

.oblast_zaglavlja{/* kontejner hedera stranice */
	height:70px;
	width: 100%;
	position:fixed;
	background:#0f1145; 
	z-index: 1000;
	top:0;
	left:0;	
	box-shadow: 2px 2px 3px 2px #0f1145;
}

.logo {
	background:url(../../site_images/logo_mobile.png) no-repeat 0% 0%;
	display:block;
	height:50px;
	width:75px;
	position: fixed;
	margin:auto;
}
.logo img {height: 70px;box-sizing:border-box;width:100%;}


/*HOME*/

.oblast_strane{/* kontejner strane */
	width:100%;
	height:100%;
	margin:auto;
	position:relative;
	display:block;
	top: 25px;
}


/*OBLAST SADRZAJA*/

.oblast_sadrzaja{/* kontejner sadrzaja, oblast izmedju menija i futera */
	/*! min-height:180px; */
}

#coll_middle {width: 100%;padding-bottom: 20px;}

.index p{line-height: 1.7em;}
.pageBody{width: 95%; margin: auto; position: relative;}
.pageBody img {width: 95%;box-sizing: border-box; border-bottom: 1px solid #bfbfbf; }
.home_box1 {margin: 40px auto 0 auto;}
.home_box1 h3 {padding-bottom: 5px;}
.home_box1 div ul {list-style-position: inside;}
.pageBody p {padding: 15px 15px;}
.pageBody .imagesProducer img {box-sizing: border-box;width: 65%;margin: auto;
	border-bottom: 1px solid #bfbfbf;padding-bottom: 15px;}
.pageTitle {color: #446;}

.text_frame ul li{padding: 5px; list-style-type: square;margin-left: 15px ;}
.home_outer h3 {text-align: center;color: #2e3192;font-weight:bold }
.home_outer p {line-height: 1.7em;font-size: 15px;}
.home_outer b {color: #0f1145;}
.home_inner h3 span {color: #0f1145;}

.oblast_strane p {line-height: 1.5em;}
.oblast_strane img {width:100%;box-sizing: border-box;}

.listaStrana div {width: 95%;padding : 5px 0 5px 55px;margin:auto;}
.listaStrana div img {box-sizing:border-box; width: 70%;border-bottom: 1px solid #bfbfbf;}
.listaStrana .info h2 {font-size: 18px;font-weight: normal;}
.catid_10 .page-inner {padding: 30px 0 0 0;}


/*OBLAST KATALOGA*/

.oblast_kataloga {width: 100%; margin: auto; padding-top: 12px;}
.oblast_kataloga div li {padding: 15px 0 5px 0;}

.katalog_prikaz {width: 100%; margin: 5px auto 0 0; line-height: 1.5em;}
.katalog_prikaz .proizvod {width: 90%; margin: auto; padding-top: 55px;}

.prodOpis h1, .prodOpis h2{font-size: 21px; padding: 5px 0 10px 0; box-sizing: border-box;}
.sideCatNav {padding: 25px;}

.catalogueThumbLink .catalogueThumbImage {width: 70%; box-sizing: border-box; margin :auto;}
.cat_item , .catalogueItemText {border-bottom: 1px solid #bfbfbf; padding: 8px 0;}
.naslovTabelaArtikala {padding: 8px 0;}
.prodMainPic img {width: 90%; margin: auto;}



/*SEARCH*/
/*
.catalog_search {
	border-bottom: 1px solid #ccc; width: 100%; height: 75px;
	padding: 5px 30px; box-shadow: 2px 2px 5px 2px #ccc;box-sizing: border-box;
	display: block;_position:fixed; top: 35px; z-index: 9; 
}
#brzi_pretrazivac {padding: 15px 5px;display: block; width: 100%;}
#brzi_pretrazivac .searchDugme::after {
  content:"\f002"; font-family:icons; position:absolute; top:25px; right:14px; font-size:30px;color:#8c8c8c;
}

#inputString {padding: 5px;width: 90%; height: 30px;box-sizing: border-box;
	border:none; border-bottom:1px solid #999;border-radius: none; background: transparent;}

#autoSuggestionsList{ z-index: 1; position: absolute;  width: 100%; left: 0; right: 0; }

.suggestionList {background: #fff;  width: 100%; display: block; box-sizing: border-box;}
.suggestionList > li{display: flex; flex-grow: 1; flex-basis: 0;}

.searchDugme {}
*/

.catalog_search {position: absolute; bottom: 20px; z-index:900; left: 26%; top :0;}
.catalog_search .searchDugme {background: #fff;}
.catalog_search  input{height: 25px; width: 170px;}
.stringPolje {padding-left: 5px;}


/*MENU*/

.glavni_meni {width: 100%; background: #fff; padding: 10px 0px;border-bottom: 1px solid #bfbfbf;
	position: fixed; top: 75px; z-index: 9; box-shadow: 2px 1px 3px 2px #eee}
.glavni_meni ul{width: 100%; margin: auto;}
.glavni_meni li{padding-top: 20px; display: block; text-align: center;
	font-weight: normal;font-size: 20px; border-top: 1px solid #bfbfbf; }

.meni_jezici {position: absolute;top: 0px;right: 0px;padding: 2px 4px;box-sizing: border-box;}
.meni_jezici {width: 100%; background: #fff; padding: 10px 0px;border-bottom: 1px solid #eee;
	position: fixed; top: 65px; z-index: 9;}

.flyOutMenu {
	background: #666; position: fixed; height: 65px; width: 100%; 
	z-index: 1000; border-bottom: 1px solid #bfbfbf;}
.sideCatNav {padding: 25px;}

/*O NAMA*/

.catid_7 .imageFloat {padding: 15px;}


/*PAGES*/

h1, h2, h3, h4 {font-weight: normal;}
.oblast_strane h1 {text-align: center; padding-bottom: 8px;}


/*ASORTIMAN*/

.catid_5 .asortiman h2 {text-align: center; padding: 50px 0 0 0;}
.box1 p {padding: 8px;}
.box2 li{padding: 5px 0 10px 5px; list-style-type: square;list-style-position: inside;}

.naslov_kategorije {padding: 40px 0 0 0;}


.asortiman h3 , .asortiman h4 ,.asortimanDelovi h2 , .asortimanDelovi h3 , .asortimanDelovi h4{
	padding: 15px 0 15px 15px;font-weight:bold;}
.asortiman ul li , .asortimanDelovi ul li {
	padding: 3px 0 3px 52px; list-style-type:disclosure-closed;list-style-position: inside;}

.prviBox h3:before{
	content:"NN";background: #2a3a6a;color:#fff;padding: 3px 4px; margin-right: 5px;}
.drugiBox h3:before{
	content:"SN";background: #2a3a6a;color:#fff;padding: 3px 5px; margin-right: 5px;}
.treciBox h3:before{
	content:"VN";background: #2a3a6a;color:#fff;padding: 3px 5px; margin-right: 5px;}


 /*REFERENCE*/

.years{padding: 20px 0;margin:auto;position: relative;}
.years:before{content:"";width:10px;height:100%;background: #346;position: absolute;
	top:0;left:190px;z-index:8;}
.yearConteiner{width:100%;position: relative;min-height:70px;}
.yearConteiner .timelineHeading,.yearConteiner .timelineText{position: absolute;
	display: block;padding:0 10px;box-sizing: border-box;}
.yearLeft .timelineHeading, .yearLeft .timelineText{left:0; text-align: right;}
.yearRight .timelineHeading, .yearRight .timelineText{left:200px;}
.timelineHeading{top:5px;}
.timelineText{top:26px;}

.box2 .text ul {padding-left: 10px;}


/*PROIZVODJACI*/

.proizvodjaciLogo {display: block; margin: auto;position: relative; top: 25px;}
.proizvodjaciLogo img {width: 70%;box-sizing: border-box;border-bottom:1px solid #bfbfbf;padding-bottom: 15px;}
.proizvodjaciLogo a img{margin:0 auto 25px auto;}

.producers-page h3 {text-align: center;}
.producers-page img {box-sizing: border-box; width: 100%;}

.pr-float {padding : 35px 0 0 0;}
.pr-foto , .pr-articles {padding: 10px 0 10px 0;}
.pr-articles-box {margin: auto; width: 90%;}
.pr-logo {width: 90%;margin: 5px auto 5px auto;}
.pr-logo img {padding-bottom: 15px;}
.pr-foto img {margin: 10px auto 10px auto; box-sizing: border-box; width: 90%;}

.slikeProizvodjaci {width: 100%; display: block;}
.slikeProizvodjaci img {width: 100%!important; height:auto!important;}

.catid_7 .page-inner , .catid_6 .page-inner {padding-top: 50px;}
.catid_7 .page-inner h2 {padding-left: 14px;}

.catid_6 .page-inner {padding: 45px 3px 0 3px;}
.catid_6 .page-inner h2 {padding: 5px 0 5px 0;}


/*KONTAKTI*/

.kontakti-wrapper>div {width: 95%; margin: auto;padding:50px 0 0 0;}

.kontaktiGramper {border-top: 1px solid #237;}
.kontaktiGramper h2 , .kontaktiGramper h3 , .box-2 h4 , .box-3 h4 {font-weight: bold;}
.kontaktiGramper ul {display:block;padding: 10px 6px; box-sizing: border-box;}
.kontaktiGramper ul li { border-left:1px solid #237; padding-left : 7px;}
.kontaktiGramper p{padding: 20px 0 0 0;}
.kontaktiGramper a{display: block;font-size:14px;}
.kontakti-wrapper a {text-decoration: underline;}

.kontakt-podaci h3 {font-size: 22px;padding: 0 0 5px 0;color: #236;}
.kontakt-podaci ul li{padding: 8px 0 8px 10px;display:block;}
.kontakt-podaci.box-2, .kontakt-podaci.box-3 {padding:15px 0;}

.index .kontakti-wrapper, .index .pageTitle {font-size: initial;}

.box-1 ul li {list-style: none;padding: 4px 0 0 10px;border-left: 4px solid #237;}
.catid_8 .pdf-fa, .catid_8 .word-fa {
	display: block;margin: 2px 0px 5px 4px;padding: 4px 15px;text-align: center;}
.pdf-fa, .word-fa {font-size: 12px;border: 1px solid #ccc;border-radius: 5px; _width: 40%;}
.word-fa a::before {
    font-family: Symbols;content: "\f1c2";font-size: 12px;padding: 0 10px 0 0;color: #028ebd;}
.pdf-fa a::before {
    font-family: Symbols;content: "\f1c1";font-size: 12px;padding: 0 10px 0 0;color: #028ebd;}
.mapa iframe {padding-bottom: 10px;}


/*FOOTER*/

.oblast_futera{position:relative; background: #2a3842; width:100%;}

.footer-navigacija-1 h3 {text-align: center; padding: 2px 0 2px 0;
	color: #ffffff; padding-top: 15px;}
.footer-navigacija-2 a , .footer-navigacija-2 li , .footer-navigacija-2 p {
	text-align: center; padding: 5px 0; color: #ffffff;}
.footer-navigacija-1 p {text-align: center; padding: 2px 0 2px 0;color: #ffffff;}
.footer-navigacija-1 h3 a{text-align: right;font-size:16px;color: #ffffff;}
.footer-navigacija-1 a , .asortiman li a , .kontakti p , .druga-grana li a {color: #5f7d95;}

.copyrights {
    margin: 160px 0 5px 0; background: #041019; width: 100%; text-align: center; color: #5f7d95; font-size: 15px;}

.copyrights::before {
    content: ""; width: 105px; height: 140px; 
    position: absolute; bottom: 1px; 
    background-image: url(../../cms_upload/pages/files/1_gramper_logo_.svg);
    background-repeat: no-repeat; background-size: 100%; opacity: .7;
    text-align: center;
}