/*
Theme Name: Mojster za vse
Author: Ardi d.o.o.
Version: 1.0
*/
@import url("style_reset.css");
@import url("style_clearfix.css");


body,
html {
	margin:0;
	padding:0;
	width:100%;
}

body {
	background:#000;
	color:white;
	font:normal 12px/160% Arial,Tahoma,Verdana;
}

#wrap {
	max-width:960px;
	padding:0 10px;
	margin:0 auto;
	background:url("images/side_borders.gif") left top repeat-y;
}

.alignleft {
	float:left;
	margin:0 15px 10px 0;
}
.alignright {
	float:right;
	margin:0 0 10px 15px;
}

/* HEADER
----------------------------*/
#header {
	position:relative;
	width:960px;
	height:192px;
	background:url("images/header.jpg") left top no-repeat;
}

#header h1,
#header h1 a {
	display:block;
	/*width:65px;
	height:92px;*/
	width:960px;
	height:182px;
}
#header h1 {
	position:absolute;
	left:0px;
	top:0px;
}
#header h1 a {
	overflow:hidden;
	text-indent:-1000px;
}

#header-quick-contact {
	display:block;
	position:absolute;
	left:620px;
	top:100px;
	font-size:11px;
	line-height:150%;
}
#header-quick-contact a {
	color:white;
}

/* NAVIGATION
----------------------------*/
#navigation {
	width:950px;
	height:88px;
	position:relative;
	margin:0 auto 10px 0;
}
#navigation ul {
	position:absolute;
	left:5px;
	bottom:0;
	width:950px;
	height:90px;
	list-style:none;
}

#navigation ul li,
#navigation ul li a {
	width:182px;
	height:90px;
}

#navigation ul li {
	position:relative;
	float:left;
	width:182px;
	height:90px;
	margin-right:10px;
	background:url("images/main_navigation.png") left bottom no-repeat;
}
#navigation ul li.last {
	margin-right:0;
}
#navigation ul li a {
	display:block;
	overflow:hidden;
	color:white;
	font-size:14px;
	font-weight:bold;
	text-decoration:none;
}

#navigation ul li a span {
	display:inline-block;
	position:absolute;
	left:70px;
	top:20px;
}

#navigation ul li.custom-nav-1 {}
#navigation ul li.custom-nav-2 {
	background-position:-191px bottom;
}
#navigation ul li.custom-nav-3 {
	background-position:-383px bottom;
}
#navigation ul li.custom-nav-4 {
	background-position:-575px bottom;
}
#navigation ul li.custom-nav-5 {
	background-position:-768px bottom;
}

/* CONTENT
---------------------*/
#content {
	background:#1a1a1a;
}

#cont-inner {
	padding-bottom:20px;
	padding:10px 5px 20px 5px;
}

/* TOP BANNERS
---------------------*/
.top-banners .banner {
	width:469px;
	height:100px;
	overflow:hidden;
	background:#333;
	margin-bottom:10px;
	position:relative;
}
.top-banners .left {
	float:left;
	background:url("images/akcija_blue.jpg") left top no-repeat;
}
.top-banners .right {
	float:right;
	background:url("images/akcija_red.jpg") left top no-repeat;
}

.banner h3 {
	display:none;
}

.banner .summary {
	position:absolute;
	left:20px;
	bottom:7px;
	width:315px;
	height:40px;
	color:white;
	font-size:15px;
}

.banner a {
	display:block;
	width:inherit;
	height:inherit;
	position:absolute;
	left:0;
	top:0;
}
.banner a span {
	display:none;
}

.banner .popust {
	display:block;
	width:65px;
	height:50px;
	line-height:50px;
	position:absolute;
	right:24px;
	top:25px;
	text-align:center;
	color:black;
	font-size:25px;
	font-weight:bold;
}

/* PODROČJA / LIST
---------------------*/
#podrocja {
	
}
#podrocja li {
	float:left;
	margin:0 10px 10px 0;
}

#podrocja li,
#podrocja li a {
	width:310px;
	height:100px;
}

#podrocja li.adaptacije-in-kompletne-usluge a { background:url("images/podrocja/adaptacije-in-kompletne-usluge.jpg") left top no-repeat; }
#podrocja li.elektrika a { background:url("images/podrocja/elektrika.jpg") left top no-repeat; }
#podrocja li.vodovod-in-kurjava a { background:url("images/podrocja/vodovod-in-kurjava.jpg") left top no-repeat; }
#podrocja li.mizarstvo-in-kljucavnicarstvo a { background:url("images/podrocja/mizarstvo-in-kljucavnicarstvo.jpg") left top no-repeat; } 
#podrocja li.popravilo-strojev-in-naprav a { background:url("images/podrocja/parket-in-talne-obloge.jpg") left top no-repeat; }
#podrocja li.televizija-racunalnistvo-internet a  { background:url("images/podrocja/televizija-racunalnistvo-internet.jpg") left top no-repeat; }
#podrocja li.pleskarstvo-in-zidarska-dela  a { background:url("images/podrocja/pleskarstvo-in-zidarska-dela.jpg") left top no-repeat; } 
#podrocja li.montaze-in-priklopi a  { background:url("images/podrocja/montaze-in-priklopi.jpg") left top no-repeat; } 
#podrocja li.razno a  { background:url("images/podrocja/razno.jpg") left top no-repeat; } 
 

#podrocja li.last {
	margin-right:0;
}

#podrocja li a {
	position:relative;
	display:block;
	color:white;
	text-decoration:none;
	font-size:12px;
	font-weight:bold;
}
#podrocja li a:hover {
	background-position:left bottom;
}
#podrocja li a span {
	display:block;
	position:absolute;
	left:110px;
	top:28px;
	width:105px;
}

/* SIDEBAR
----------------------*/
#sidebar {
	width:200px;
	float:right;
	background:#272727;
	padding:5px 0 10px 5px;
}
#sidebar #sidebar-podrocja a {
	display:block;
	height:48px;
	width:200px;
	color:#CCC;
	text-decoration:none;
	position:relative;
}

#sidebar #sidebar-podrocja a span.icon {
	display:block;
	position:absolute;
	left:0;
	top:0;
	width:52px;
	height:48px;
	background:url("images/mojster_stranski_menu.jpg") left -6px no-repeat;
}
#sidebar #sidebar-podrocja a span.title {
	display:block;
	position:absolute;
	left:55px;
	/*top:15px;*/
	top:0;
	width:130px;
	line-height:120%;
}

#sidebar #sidebar-podrocja a:hover {
	text-decoration:none;
	color:white;
}

#sidebar #sidebar-podrocja li.adaptacije-in-kompletne-usluge a span.icon { background-position: left -6px; }
#sidebar #sidebar-podrocja li.elektrika a span.icon { background-position: left -54px; }
#sidebar #sidebar-podrocja li.vodovod-in-kurjava a span.icon { background-position: left -102px; }
#sidebar #sidebar-podrocja li.mizarstvo-in-kljucavnicarstvo a span.icon { background-position: left -149px; } 
#sidebar #sidebar-podrocja li.popravilo-strojev-in-naprav a span.icon { background-position: left -197px; }
#sidebar #sidebar-podrocja li.televizija-racunalnistvo-internet a span.icon  { background-position: left -245px; }
#sidebar #sidebar-podrocja li.pleskarstvo-in-zidarska-dela a span.icon { background-position: left -293px; } 
#sidebar #sidebar-podrocja li.montaze-in-priklopi a span.icon  { background-position: left -341px; } 
#sidebar #sidebar-podrocja li.razno a span.icon  { background-position: left -389px; }

#sidebar #sidebar-podrocja li.adaptacije-in-kompletne-usluge a:hover span.icon { background-position: right -6px; }
#sidebar #sidebar-podrocja li.elektrika a:hover span.icon { background-position: right -54px; }
#sidebar #sidebar-podrocja li.vodovod-in-kurjava a:hover span.icon { background-position: right -102px; }
#sidebar #sidebar-podrocja li.mizarstvo-in-kljucavnicarstvo a:hover span.icon { background-position: right -149px; } 
#sidebar #sidebar-podrocja li.popravilo-strojev-in-naprav a:hover span.icon { background-position: right -197px; }
#sidebar #sidebar-podrocja li.televizija-racunalnistvo-internet a:hover span.icon  { background-position: right -245px; }
#sidebar #sidebar-podrocja li.pleskarstvo-in-zidarska-dela a:hover span.icon { background-position: right -293px; } 
#sidebar #sidebar-podrocja li.montaze-in-priklopi a:hover span.icon  { background-position: right -341px; } 
#sidebar #sidebar-podrocja li.razno a:hover span.icon  { background-position: right -389px; }

#sidebar #sidebar-podrocja li.active-page a {
	color:white;
	text-decoration:underline;
}

/* PAGE
----------------------*/
#post {
	float:left;
	width:686px;
	padding:20px;
	color:#ccc;
}

#post a {
	color:#FFF;
	text-decoration:underline;
}

h2 {
	font-size:20px;
	font-weight:normal;
	margin-bottom:20px;
	color:white;
}

h2 span {
	display:block;
	font-size:12px;
	margin-bottom:10px;
}
h2 span,
h2 span a {
	color:#ccc;
}
h2 span a:hover {
	text-decoration:none;
}

#post p,
#post ul,
#post ol {
	margin:0 0 15px 0;
}

#post ul {
	list-style:disc;
	margin-left:15px;
}

#post ol {
	list-style:decimal;
	margin-left:15px;
}

body.page-template-default img {
	border:solid 1px #444;
}

#post .ngg-album {
	float:left;
	width:313px;
	border:none;
	position:relative;
	padding:0;
	margin:0 20px 0 0;
}

#post .ngg-album .ngg-albumtitle {
	position:absolute;
	left:128px;
	top:0px;
	line-height:100%;
}

#post .ngg-album .ngg-albumtitle a {
	font-size:14px;
	font-weight:normal;
	color:white;
	text-decoration:underline;
}
#post .ngg-album .ngg-albumtitle a:hover {
	text-decoration:none;
}

#post .ngg-album .ngg-description {
	padding-top:40px;
	font-size:11px;
}
#post .ngg-album .ngg-description p {
	margin-bottom:5px;
	margin-left:5px!important;
	line-height:130%;
}

#post .piclenselink {
	display:none;
}

#post .ngg-galleryoverview .ngg-gallery-thumbnail img {
	padding:0!important;
	border:solid 2px #ccc;
	margin:0 4px 4px 0;
}
#post .ngg-galleryoverview .ngg-gallery-thumbnail a:hover img {
	border:solid 2px white;
}

/* PROJECTS LIST
---------------------*/
#projects-list {
	border-top:dotted 1px #555;
	padding-top:20px;
}

.project-item {
	float:left;
	width:332px;
	border:none;
	position:relative;
	padding:0;
	margin:0 20px 20px 0;
	font-size:11px;
}
.project-item h3,
.project-item h3 a {
	font-size:12px;
	color:white;
	text-decoration:underline;
}
.project-item h3 a:hover {
	text-decoration:none;
}

.project-item p a {
	color:#ccc;
	text-decoration:none;
}
.project-item p a:hover {
	text-decoration:none;
}

.project-thumb {
	float:left;
	margin-right:10px;
	background:#555;
	width:98px;
	height:98px;
	overflow:hidden;
	border:solid 2px #ccc;
}
.project-thumb:hover {
	border:solid 2px #fff;
}

/* GALLERY THUMBS
.--------------------*/
#post #galleryThumbs {
	list-style:none;
	margin:0 0 20px 0;
}
#galleryThumbs li {
	float:left;
	width:332px;
	margin:0 20px 20px 0;
}

#galleryThumbs li a {
	display:block;
	width:100px;
	height:100px;
	float:left;
}

#galleryThumbs li a img {
	border:solid 5px white;
}
#galleryThumbs li a:hover img {
	border:solid 5px #999;
}

#galleryThumbs li span {
	display:block;
	width:210px;
	float:right;
	padding-top:5px;
}

.even,
#galleryThumbs li.even {
	margin-right:0;
}
.odd,
#galleryThumbs li.odd {
	clear:both;
}


/* FOOTER
---------------------*/
#footer {
	background:url("images/footer_bg.jpg") left bottom no-repeat;
	border-top:solid 1px #444;
	text-align:center;
	padding:5px 0 10px 0;
}
#footer a {
	color:white;
}

@media only screen and (max-width: 720px) {
	
	.top-banners .banner,
	#podrocja li, #podrocja li a
	{
		width:100%!important;
	}
	
}