/* ------------------------------------------------------
   Site: Random, računalniško programiranje, Martin Šnajder s.p.
   author: Vida Hernaus - weida (css, design, xhtml)
   email: weida34@gmail.com
------------------------------------------------------ */

/* =GENERAL RULES
--------------------------------------------------------------------------- */
* { padding: 0; margin: 0; }
ul { list-style: none; }

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 62.5%;
	color: #333;
	text-align: center;
	padding-top: 10px;
	background: #f6fbff url(images/bg_top2.jpg) repeat-x center top;
}
html>body { font-size: 10px; }
img { border: none; }
strong { color: #606060; }

h1, h2, h3 { color: #4087b3; font-family: "Trebuchet MS", Arial, sans-serif; }
h1 { margin-bottom: .6em; color: #e75a0d; font-variant: small-caps; }
h1 + h2 { margin-top: 0; }
h2 {
	margin-bottom: .6em; margin-top: 1.8em; padding-left: 6px; font-style: italic;
	background: url(images/h2_bg.png) no-repeat left 60%; }
h2 span { padding: 0 10px; background: #fcfeff; border-bottom: 1px solid #d3d9e3; }
h3 { margin-bottom: .2em; text-transform: uppercase; }
h4 { color: #416175; margin-bottom: .3em; }

a:link, a:visited { color: #0665d0; border-bottom: 1px solid #b5d6eb; text-decoration: none; }
a:hover, a:active { color: #da251d; border-bottom: 1px solid #da251d; }

/* =PAGE =SECTIONS (header, content, footer)
--------------------------------------------------------------------------- */
#wrapper { margin: 0 auto; text-align: center; width: 760px; }
#header { text-align: left; height: 270px; position: relative; }
#content { text-align: left; font-size: 1.3em; }
#footer {
	font-size: 1.1em;
	padding-top: 50px; margin-bottom: 20px;
	background: url(images/footertop.png) no-repeat; }

/* =HEADER page section
--------------------------------------------------------------------------- */
#header #sitenav { position: absolute; top: 0; right: 0; }
#header #sitenav li { display: inline; }
#header #sitenav a {
	display: block; float: left;
	margin-left: 1px; padding: 5px 10px;
	font-size: 1.1em;
	color: #c4def9;
	border: none;
	background-color: #375364;
	border-top: 1px solid #375364; }
#header #sitenav a:hover { color: #fff; border-top-color: #4087b3; }

#header #mainnav {
	width: 291px;
	position: absolute; top: 40px; left: 30px;
	background: url(images/mainnav_top.png) no-repeat left top; }
#header #mainnav ul {
	padding: 8px 75px 8px 10px;
	background: url(images/mainnav_bottom.png) no-repeat left bottom; }
#header #mainnav ul a:link, #header #mainnav ul a:visited {
	display: block;
	padding: 5px 0 3px 28px;
	color: #606060;
	font: bold 1.2em "Trebuchet MS", Arial, sans-serif;
	text-transform: uppercase;
	border-bottom: 1px dashed #ccc;
	background: url(images/bullet_mainnav.gif) no-repeat 3px 50%; }
#header #mainnav ul a:hover {
	color: #4087b3; background-color: #fff;
	background-image: url(images/bullet_mainnav1.gif); }

/* označevanje trenutno aktivne strani */
#pg_domov #header #sitenav a#domov, #pg_kontakt #header #sitenav a#kontakt,
#pg_vizitka #header #sitenav a#vizitka, #pg_povezave #header #sitenav a#povezave {
	color: #fff; background: #476375 url(images/arrow_sitenav.gif) no-repeat center top; }
#pg_domene #header #mainnav ul a#domene, #pg_windows #header #mainnav ul a#windows,
#pg_linux #header #mainnav ul a#linux, #pg_splet #header #mainnav ul a#splet,
#pg_refs #header #mainnav ul a#refs, #pg_faq #header #mainnav ul a#faq {
	color: #e75a0d; background-image: url(images/bullet_mainnav2.gif); }

#header #logo { position: absolute; left: 280px; top: 35px; }
#header #logo a {
	display: block;
	text-indent: -10000px;
	width: 375px; height: 110px;
	border: none;
	background: url(images/logo.png) no-repeat left top; }

#header #slogan {
	position: absolute; top: 162px; right: 40px;
	color: #e75a0d; font-style: italic; }

/* =CONTENT page section
--------------------------------------------------------------------------- */
#content h1 { font-size: 1.9em; }
#content h2 { font-size: 1.5em; }
#content h3 { font-size: 1.2em; }
#content .alert h3 { font-size: 1em; }
#content h4 { font-size: 1em; }

#content p {
	margin: 2px 0 10px;
	line-height: 1.4em; }
/*#content p.zamik { margin-left: 22px; }
#content p.zamikVLine {
	margin-left: 5px; padding-left: 15px;
	border-left: 2px solid #d3d9e3; }*/
#content ul { margin-bottom: 20px; }
#content ul ul { margin-bottom: 0; }
#content ul li {
	line-height: 1.4em;
	padding-left: 35px;
	background: url(images/li_main2.gif) no-repeat .3em .1em;
	margin-bottom: 3px; }
#content ul li ul li {
	line-height: 1.2em;
	padding-left: 18px;
	background: url(images/li_sub.gif) no-repeat .1em .4em;
	margin-bottom: 1px; }

.totop { clear: both; margin-top: 30px; margin-bottom: 10px; text-align: right; }
.totop a {
	font-size: .85em;
	padding: 3px 6px;
	background: #ecf6fe; border: 1px solid #d1e6f3; }
.totop a:hover { color: #fff; border-color: #0079b2; background: #0079b2; }
a.external:link, a.external:visited {
	padding-right: 18px; background: url(images/external.gif) no-repeat right center; }
a.external:hover, a.external:active { background: url(images/external2.gif) no-repeat right center; }
a.email:link, a.email:visited { padding-right: 20px; background: url(images/email.gif) no-repeat right center; }
a.email:hover, a.email:active {background-image: url(images/email2.gif); }

#content p.back { margin-top: 30px; }
#content p.back a {
	padding-left: 20px;
	border: none; text-decoration: underline;
	background: url(images/back_sm.gif) no-repeat left center; }
#content p.back a:hover { background-image: url(images/back_sm2.gif); }

#content p.go2faq {
	min-height: 22px;
	margin-top: 30px; padding-left: 42px;
	background: url(images/faq.gif) no-repeat left center; }
#content p.go2faq a {
	padding-right: 20px;
	border: none; text-decoration: underline;
	background: url(images/arrow_sm.gif) no-repeat right center; }
#content p.go2faq a:hover { background-image: url(images/arrow_sm2.gif); }

#content p.button {
	float: left; margin-top: 1.5em;
	font-size: 1.1em; }
#content p.domeneSrc { margin-left: 20px; background: url(images/btnw_domene.png) no-repeat left top; }
#content p.button a {
	display: block; line-height: 50px; 
	padding-left: 80px; padding-right: 55px;
	border: none;
	background: url(images/btnw_arrow.png) no-repeat right top; }
#content p.button a em { padding-right: 18px; background: url(images/external.gif) no-repeat right center; }
#content p.button a:hover em { background: url(images/external2.gif) no-repeat right center; }
#content p.button a:hover { text-decoration: underline; background-image: url(images/btnw_arrow2.png); }

.cenaOld { text-decoration: line-through; color: #999; }
.cenaNew { color: #e75a0d; font-weight: bold; }

.imgFloatRight { float: right; padding: 0 0 20px 20px; }
.imgFloatLeft { float: left; padding: 0 20px 20px 0; }

/* prva stran - sections */
#sections { font-size: .9em; background: url(images/sections_bg.png) no-repeat; }
#sections div { float: left; width: 250px; padding-bottom: 15px; }
#content .hosting { margin-left: 5px; margin-right: 5px; position: relative; }
#content .hosting .hostIcons { position: absolute; top: 96px; left: 152px; }
#content .hosting .hostIcons img { padding: 3px; }
#content .hosting .hostIcons a { border-bottom: none; }
#content .hosting .hostIcons a:link img, #content .hosting .hostIcons a:visited img {
	border: 1px solid transparent; background: transparent; }
#content .hosting .hostIcons a:hover img, #content .hosting .hostIcons a:active img {
	border: 1px solid #fae197; background: #fff; }
#content #sections h2 {
	margin: 45px 15px 10px 10px;
	height: 5.5em;
	font-size: 1.4em;
	text-align: right; text-transform: uppercase;
	background: none; }
#content #sections .domains h2, #content #sections .domains h2 a:link, #content #sections .domains h2 a:visited {
	color: #0c69a4; border-bottom: none; }
#content #sections .domains h2 a:hover, #content #sections .domains h2 a:active {
	text-decoration: underline; background-color: #fff; }
#content #sections .hosting h2 { color: #b35509; border-bottom: none; }
#content #sections .websites h2, #content #sections .websites h2 a:link, #content #sections .websites h2 a:visited {
	color: #526b1d; border-bottom: none; }
#content #sections .websites h2 a:hover, #content #sections .websites h2 a:active {
	text-decoration: underline; background-color: #fff; }

#content #sections h3, #content #sections ul { margin-left: 10px; margin-right: 10px; margin-bottom: 10px; }
#content #sections ul ul { margin-left: 0; margin-right: 0; }
#content #sections h3 {
	margin: 15px 10px;
	color: #6f8487;
	font-size: 1.2em; font-style: italic;
	text-transform: none; text-align: center; }

#content #sections ul li { padding-left: 22px; }
#content #sections .domains ul li { background: url(images/li_sec1.gif) no-repeat 0 .2em; }
#content #sections .hosting ul li { background: url(images/li_sec2.gif) no-repeat 0 .2em; }
#content #sections .websites ul li { background: url(images/li_sec3.gif) no-repeat 0 .2em; }
#content #sections ul li ul li { background: url(images/li_sub.gif) no-repeat .2em .4em !important; }

#sectionBottom {
	padding-bottom: 3px; background: url(images/secbottom_bg.png) no-repeat left bottom; }
#sectionBottom div { float: left; width: 250px; height: 50px; position: relative; }
#sectionBottom div a {
	position: absolute;
	text-decoration: none;
	border-bottom: none;
	height: 30px; width: 130px;
	padding: 0; overflow: hidden; }
#sectionBottom div.domains a, #sectionBottom div.websites a { top: 16px; right: 8px; }
#sectionBottom div.hosting a.win, #sectionBottom div.hosting a.lin { width: 114px; top: 16px; }
#sectionBottom div.hosting a.win { left: 8px; }
#sectionBottom div.hosting a.lin { right: 8px; }
#sectionBottom div a span {
   position: absolute;
   width: 130px; height: 30px;
   left: 0; top: 0; margin: 0; }
#sectionBottom div.domains a:link span, #sectionBottom div.domains a:visited span {
	background: url(images/btn_domene.png) no-repeat 0 0; }
#sectionBottom div.websites a:link span, #sectionBottom div.websites a:visited span {
	background: url(images/btn_web.png) no-repeat 0 0; }
#sectionBottom div.hosting a.win:link span, #sectionBottom div.hosting a.win:visited span {
	background: url(images/btn_win.png) no-repeat 0 0; }
#sectionBottom div.hosting a.lin:link span, #sectionBottom div.hosting a.lin:visited span {
	background: url(images/btn_linux.png) no-repeat 0 0; }
#sectionBottom div.domains a:hover span, #sectionBottom div.domains a:active span { background-position: 0 -30px; }
#sectionBottom div.websites a:hover span, #sectionBottom div.websites a:active span { background-position: 0 -30px; }
#sectionBottom div.hosting a.win:hover span, #sectionBottom div.hosting a.win:active span { background-position: 0 -30px; }
#sectionBottom div.hosting a.lin:hover span, #sectionBottom div.hosting a.lin:active span { background-position: 0 -30px; }

/* Izdelovanje spletnih strani - paketi */
.paketi { font-size: .9em; margin-top: 1.5em; }
.paketi .row { background: url(images/paketi_bg.png) no-repeat; }
.paketi div.col {
	float: left; width: 250px;
	padding-bottom: 5px;
	background: url(images/dice1.gif) no-repeat 32px 20px; }
.paketi div.c2 { background-image: url(images/dice2.gif); }
.paketi div.c3 { background-image: url(images/dice3.gif); }
.paketi div.c4 { background-image: url(images/dice4.gif); }
.paketi div.c5 { background-image: url(images/dice5.gif); }
.paketi div.c6 { background-image: url(images/dice6.gif); }
.paketi .colMiddle { margin-left: 5px; margin-right: 5px; }
#content .paketi p { margin-left: 10px; margin-right: 10px; }
#content .paketi h3 {
	margin: 12px 10px 50px; padding-right: 3px;
	text-align: right; text-transform: uppercase;
	font-size: 1.4em; font-style: italic;
	background: url(images/paketi_h3.gif) no-repeat right top; }
#content .paketi h3 strong { color: #ce5e0c; }
#content .cena strong { color: #ce5e0c; }

.paketi .paketiBottom {
	height: 4px; margin-bottom: 1em;
	background: url(images/paketibottom_bg.png) no-repeat; }

/* Reference */
#content #reference { margin-top: 1.5em; }
#reference div {
	float: left; width: 250px;
	text-align: center;
	padding-top: 8px; padding-bottom: 5px;
	margin-bottom: 1em;
	background: url(images/ref_bg.png) no-repeat;
	border-bottom: 1px solid #d0d0d0; }
#reference .colMiddle { margin-left: 5px; margin-right: 5px; }
#reference a { border-bottom: none; }
#reference div img {
	width: 220px; height: 80px;
	padding: 6px;
	background-color: #ececec; }
#reference div a:hover img { background-color: #0cafeb; }
#reference div p { text-align: left; margin: .6em 10px; }
#reference div p a:link, #reference div p a:visited { border-bottom: 1px dashed #0665d0; }
#reference div p a:hover, #reference div p a:active { border-bottom: 1px solid #da251d; }

/* ALERTs: pomembno, opombe, novo, ... */
#content .note {
	position: relative;
	margin: 20px; padding: 6px 20px 6px;
	text-align: center;
	border: 3px double #cde4f3; border-width: 3px 0;
	background-color: #f9feff; }
#content .alert {
	position: relative;
	margin: 20px; padding: 6px 20px 5px;
	border: 1px solid #9adffc; border-width: 1px 0;
	background-color: #f9feff; }
#content .alert.novo, #content .alert.pomembno, #content .alert.opomba, #content .alert.info { padding-left: 90px; }
#content .alert.novo { border-color: #f8d57d; background-color: #fcf9f2; }
#content .alert.pomembno { border-color: #f8d57d; background-color: #fcf9f2; }
#content .alert.opomba { border-color: #d8eab2; background-color: #f8fcf2; }
#content .alert.info { border-color: #9adffc; background-color: #f9feff; }
*.alert h3 {
	font-size: 1em; color: #6d7685;
	text-transform: uppercase;
	position: absolute; left: 5px; top: 8px; 
	width: 80px; height: 60px;
	padding: 0; overflow: hidden; }
*.alert h3 em { position: absolute; left: 0; top: 0; }
*.alert h3 span {
	position: absolute; left: 0; top: 0; margin: 0;
	width: 80px; height: 60px; }
*.alert.novo h3 span { background: url(images/novo.png) no-repeat; }
*.alert.pomembno h3 span { background: url(images/pomembno.png) no-repeat; }
*.alert.opomba h3 span { background: url(images/opomba.png) no-repeat; }
*.alert.info h3 span { background: url(images/info.png) no-repeat; }

/* FAQ */
.dhtmlgoodies_question {
	color: #0c69a4; font-weight: bold; margin-bottom: .5em;
	overflow: hidden; cursor: pointer;
	padding-left: 30px; background: url(images/q.gif) no-repeat 3px center; }
.dhtmlgoodies_answer {
	margin-bottom: 1em; margin-left: 10px; margin-right: 15px;
	padding-left: 20px;
	line-height: 1.4em;
	border-left: 2px solid #d3d9e3;
	visibility: hidden;
	height: 0px;
	overflow: hidden;
	position: relative; }
.dhtmlgoodies_answer_content { padding: 5px 0; position: relative; }
#content .dhtmlgoodies_answer ul { margin-top: 5px; margin-bottom: 5px; }
#content .dhtmlgoodies_answer ul li {
	padding-left: 20px; margin-bottom: 0;
	line-height: 1.3em;
	background: url(images/li_sub.gif) no-repeat .1em .4em; }

/* DLs */
dl { margin-bottom: 20px; }
dt { color: #6d7685; font-weight: bold; margin-bottom: .5em; }
dd {
	margin-bottom: 1em; margin-left: 5px; margin-right: 15px;
	padding-left: 15px;
	line-height: 1.4em;
	border-left: 2px solid #d3d9e3; }
#content dd ul { margin-top: 10px; }
#content dd ul li {
	padding-left: 20px; margin-bottom: 3px;
	line-height: 1.2em;
	background: url(images/li_sub.gif) no-repeat .1em .4em; }
dl.plain { font-size: .85em; }
dl.plain dt { clear: both; float: left; width: 5em; margin: 0 0 .5em; }
dl.plain dd { float: left; margin: 0; border: none; }
dl.data { float: right; margin-top: 5px; }
dl.data dt { float: left; width: 8em; }

/* obrazec BN-02 */
#content .bn02 {
	width: 640px; height: 270px;
	position: relative;
	margin: 20px auto;
	font: normal 1.3em "Courier New", Courier, monospace;
	color: #000; /* b35509 526b1d */
	text-transform: uppercase;
	border: 1px solid #cdac99;
	background: url(images/bn02.png) no-repeat; }
#content .bn02 .placilo { position: absolute; left: 342px; top: 100px; }
#content .bn02 .namen { position: absolute; left: 35px; top: 130px; }
#content .bn02 .datum { position: absolute; left: 335px; top: 205px; }

/* Forms */
#content #contact { margin-top: 20px; background: url(images/formtop_bg.png) no-repeat; }
#content form {
	float: left; width: 400px;
	margin: 10px 20px 0;
	border-right: 1px solid #b5d6eb; }
#content #contact form p { margin-bottom: 5px; }
label { display: block; }
label strong { color: #da251d; background-color: #fff; }
input, textarea {
	padding: 3px; margin-left: 10px; margin-top: 2px;
	border: 1px solid #b5d6eb;
	color: #555;
	background: #fff url(images/input_bg.gif) repeat-x; }
input { width: 250px; }
textarea { width: 350px; }
p.captcha { padding-top: 12px; }
p.captcha input { width: 150px; margin-top: 6px; margin-right: 20px; }
p.send input {
	margin-top: 15px; margin-left: 10px; padding: 5px;
	width: 11em;
	color: #fff;
	font-size: 1.1em; font-weight: bold;
	border: none; cursor: pointer;
	background: #0079b2 url(images/button_bg.png) repeat-x; }

#contact .contactInfo {
	float: left; width: 290px; margin: 20px 0 0;
	border: 3px double #d1e6f3;
	background: #f5fcff url(images/person.gif) no-repeat 10px 15px; }
#contact .contactInfo address {
	line-height: 1.6em; font-style: normal;
	margin-left: 80px; padding: 10px 0; }
#contactBottom { height: 10px; background: url(images/formbottom_bg.png) no-repeat; }

/* vizitka */
#content .vizInfo {
	float: left; width: 290px;
	margin-right: 30px; margin-bottom: 20px;
	border: 3px double #d1e6f3;
	background: #f5fcff url(images/person.gif) no-repeat 10px 10px; }
#content .vizInfo address {
	line-height: 1.6em; font-style: normal;
	margin-left: 80px; padding: 10px 0; }

/* tabele */
#content table {
	border-bottom: 2px solid #70afd6;
	background: #ebf7ff;
	margin-top: .6em; margin-bottom: 1.2em; }
#content table.main { width: 100%; border-collapse: collapse; }
#content table th {
	padding: 8px 10px;
	text-align: center; vertical-align: bottom;
	font-variant: small-caps;
	color: #fff;
	background: #70afd6 url(images/th.png) repeat-x; }
#content table th.thFirst { background-image: url(images/th_first.png); }
#content table th.thLast { background-image: url(images/th_last.png); background-position: right top; }
#content table td {
	padding: 2px 10px;
	text-align: center; vertical-align: middle;
	border-bottom: 1px solid #cde4f3; }
#content table tr.odd td { background-color: #fff; }
#content table tr.first td { padding-top: 5px; }
#content table td.domena { text-align: left; padding: 2px 0 2px 2px; }
#content table td.domena span {
	display: block; width: 4em;
	padding: 3px 5px;
	border: 1px solid #87b85a;
	background-color: #f3fbe3; }
#content table td.domena span.extra { border-color: #f99600; background-color: #fdf5dc; }
#content table td.storitev {
	text-align: left;
	padding-top: 5px; padding-bottom: 5px;
	background-color: #f3fbe3; border-color: #c2dcaa; }
#content table tr.odd td.storitev { background-color: #fcfef6; }

#content table a.order {
	display: block; margin: 3px 0; padding: 5px;
	color: #f6fbff;
	border: none;
	background: #0079b2 url(images/button_bg.png) repeat-x left top; }
#content table a.order:hover { color: #fff; text-decoration: underline; background-position: left bottom; }

#content table.mini {
	margin-top: .2em; border: none; border-top: 1px solid #cde4f3; background: #fff; }
#content table.mini th, #content table.mini td {
	text-align: left; padding: 5px 10px; background: none;
	border: none; border-bottom: 1px solid #cde4f3; }
#content table.mini th { color: #4087b3; }

/* Povezave */
#content .povezava { margin-top: 20px; padding-top: 6px; border-top: 3px double #d1e6f3; }
#content .povezava img {
	float: left; margin: 0 20px 20px 0; padding: 5px;
	background-color: #ececec; }
#content .povezava a:hover img { background-color: #0cafeb; }
#content .povezava p { margin-left: 270px; margin-bottom: 2px; }
#content .povezava p a { font-size: .85em; }


/* =FOOTER page section
--------------------------------------------------------------------------- */
#footer #bottomNav { margin-bottom: 20px; }
#footer #bottomNav ul { margin-bottom: 6px; }
#footer #bottomNav ul li { display: inline; }
#footer a { line-height: 1.3em; padding: 2px 5px; border: none; }
#footer a:link, #footer a:visited { color: #0c69a4; background: #ecf6fe; }
#footer a:hover, #footer a:active { color: #0c69a4; background: #c5eefd; }
#footer .copy img { vertical-align: middle; margin: 0 5px 0 0; }


/* ---------------------------------------------------------------------------
   =FIXES and =WORKAROUNDS, =Hacks
--------------------------------------------------------------------------- */
.clearfix:after {
  content:".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden; }

*.float-divider {
	clear: both; display: block;
	height: 1px; font-size: 1px; line-height: 1px; }