/*

CSS for Mocha UI

Theme: Default

Copyright:
	Copyright (c) 2007-2009 Greg Houston, <http://greghoustondesign.com/>.

License:
	MIT-style license.

Note:	
	If you are adding MochaUI to an existing site, this CSS file may not be necessary.

*/

/* Reset */

ul,ol,dl,li,dt,dd,h1,h2,h3,h4,h5,h6,form,body,html,p,blockquote,fieldset,input,object,iframe { margin: 0; padding: 0; }
a img,:link img,:visited img { border: none; }
table { border-collapse: collapse; border-spacing: 0; }
:focus { outline: none; }

/* Structure */

body {
	text-align: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 18px;
	color: #333;	
}

/* Typography */
	
h2, h3, h4 {
	margin: 0;
	padding: 0 0 5px 0;
	font-size: 12px;
	font-weight: bold;
}
	
h2 {
	font-size: 14px;
	font-weight: bold;
}
	
h3 {
	font-size: 13px;
	font-weight: bold;
}

h4 {
	font-size: 11px;
}

a {
	color: #098ed1;
	text-decoration: none;
	cursor: pointer;
}

a:hover {
	text-decoration: none;
}

p {
	margin: 0;
	padding: 0 0 9px 0;
}

.lite {
	color: #999;
}

/* Lists */

ul {
	list-style: outside;
	margin: 0 0 9px 16px;
	list-style-type: disc;
}

dt {
	font-weight: bold;
}

dd {
	padding: 0 0 9px 0;
}

/* Menus */

.menu-right li {
	list-style-type: none;
	display: inline;	
	margin: 0 0 0 15px;
}

/* Forms */

textarea, input {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;		
}

.input {
	padding: 2px 0 2px 3px;
	border: 1px solid #848484;	
}

.small { font-size: 8pt; }

.searchField {
	width: 150px;
	overflow: hidden;
	line-height: 15px; 
	margin: 0;
	padding: 4px 0 3px 5px;
	border: 1px solid #606060;	
	border-right: 0;
	-moz-border-radius: 5px; 
	vertical-align: middle;		
}

* html .toolbox .searchField, * html .toolbox .searchButton { /* IE6 Hack */
	margin-top: -1px;		
}

* html .toolbox .button, * html .toolbox .button2 { /* IE6 Hack */
	vertical-align: top;
	margin-top: 0;			
}

*:first-child+html .toolbox .searchField, *:first-child+html .toolbox .searchButton { /* IE7 Hack */
	margin-top: -1px;	
}

*:first-child+html .toolbox .button, *:first-child+html .toolbox .button2 { /* IE7 Hack */
	vertical-align: top;
	margin-top: 0;	
}

.button, .button2 {
	height: 24px;
	margin: 0;
	padding: 3px 6px;
	background: #a3c5ef url(../images/bg-buttons.gif) repeat-x;
	font-size: 12px;
	font-weight: bold;
	cursor: pointer;
	vertical-align: middle;
	border: 1px solid #606060;	
}

* html .button {
	padding: 3px 1px;		
}

.full { width: 99%}

* html .button2 {
	padding: 3px 1px;	
}	 

.button2 {
	background-position: 0 -60px;
}	
		
.button:hover {
	background-position: 0 -30px;	
}

.button2:hover {
	background-position: 0 -90px;
}

.formRow {
	margin: 0 0 8px 0;
}

.buttonRow {
	margin-bottom: 10px;	
}

/* Code */

pre {
	background-color: #ececea;
	color: #070;
	display: block;
	font-family: 'Courier New', Courier, monospace;
	font-size: 11px;
	overflow: auto;
	margin: 0 0 10px 0;
	padding: 10px;
	border: 1px solid #d1d7dc;	
}

/* Status Messages */
.error,
.notice, 
.success    { padding: 8px; margin-bottom: 10px; border: 2px solid #ddd; }
.error      { background: #FBE3E4; color: #D12F19; border-color: #FBC2C4; }
.notice     { background: #FFF6BF; color: #817134; border-color: #FFD324; }
.success    { background: #E6EFC2; color: #529214; border-color: #C6D880; }
.error a    { color: #D12F19; }
.notice a   { color: #817134; }
.success a  { color: #529214; }

/* Dividers */

hr {
	background-color: #d3d3d3;
	color: #ccc;
	height: 1px;
	border: 0px;
}

/* Misc */

.nobr {
	white-space: nowrap;
}

.textBox {
	max-width: 650px;	
}
table.admin { width: 100%; }
table.admin th { padding: 1px 4px; background: #5caaeb url(../images/table_th.png) repeat-x; color: white; font-size: 8pt; }
table.admin td, div.admin div { border-bottom: 1px solid #ebebeb; background: #fcfcfc; clear: both}
table.admin tr.alt td, div.admin div.alt { background: #f7f7f7; border-bottom: 1px solid #e7e7e1}
div.admin div:hover { background: #4c4c4c; color: white}

span.gIcon_view_0 { display: block; width: 16px; height: 16px; margin: 3px;
background: url('/images/icons/icons.png') no-repeat -411px -367px; float: left}
span.gIcon_view_1 { display: block; width: 16px; height: 16px; margin: 3px;
background: url('/images/icons/icons.png') no-repeat -411px -393px; float: left}
span.gIcon_view_2 { display: block; width: 16px; height: 16px; margin: 3px;
background: url('/images/icons/icons.png') no-repeat 3px -80px; float: left}
span.gIcon_time_go { display: block; width: 16px; height: 16px; margin: 3px;
background: url('/images/icons/icons.png') no-repeat -44px -263px; float: left}
span.gIcon_view_video { display: block; width: 16px; height: 16px; margin: 3px;
background: url('/images/icons/icons.png') no-repeat 2px -341px; float: left}
span.gIcon_time_running { display: block; width: 16px; height: 16px; margin: 3px;
background: url('/images/icons/icons.png') no-repeat -275px -211px; float: left}
span.gIcon_pool_item_delete { display: block; width: 16px; height: 16px; margin: 3px;
background: url('/images/icons/icons.png') no-repeat 2px -265px; float: left}
span.gIcon_pool_item_edit { display: block; width: 16px; height: 16px; margin: 3px;
background: url('/images/icons/icons.png') no-repeat -368px -32px; float: left}


span.gIcon_online { display: block; width: 16px; height: 16px; margin: 6px 3px 3px 3px;
background: url('/images/icons/icons.png') no-repeat -43px -393px; float: left}
span.gIcon_away { display: block; width: 16px; height: 16px; margin: 6px 3px 3px 3px;
background: url('/images/icons/icons.png') no-repeat -135px -393px; float: left}
span.gIcon_offline { display: block; width: 16px; height: 16px; margin: 6px 3px 3px 3px;
background: url('/images/icons/icons.png') no-repeat -411px -393px; float: left}

span.gIcon_level0 { display: block; width: 16px; height: 16px; margin: 6px 3px 3px 3px;
background: url('/images/icons/icons.png') no-repeat 3px -263px; float: left}
span.gIcon_level1 { display: block; width: 16px; height: 16px; margin: 6px 3px 3px 3px;
background: url('/images/icons/icons.png') no-repeat -181px -3px; float: left}
span.gIcon_level2 { display: block; width: 16px; height: 16px; margin: 6px 3px 3px 3px;
background: url('/images/icons/icons.png') no-repeat -273px -3px; float: left}
span.gIcon_level5 { display: block; width: 16px; height: 16px; margin: 6px 3px 3px 3px;
background: url('/images/icons/icons.png') no-repeat -365px -3px; float: left}

span.modul_1 { background: url('/images/icons/icons.png') no-repeat -17px -387px;}
span.modul_2 { background: url('/images/icons/icons.png') no-repeat -109px -387px;}
span.modul_3 { background: url('/images/icons/icons.png') no-repeat -63px -387px;}
span.modul_4 { background: url('/images/icons/icons.png') no-repeat -386px -387px;}
span.modul_hp_1 { background: url('/images/icons/icons.png') no-repeat 3px -390px;}
span.modul_hp_2 { background: url('/images/icons/icons.png') no-repeat -86px -390px;}
span.modul_hp_3 { background: url('/images/icons/icons.png') no-repeat -40px -390px;}
span.modul_hp_4 { background: url('/images/icons/icons.png') no-repeat -362px -390px;}
span.modul_delete { background: url('/images/icons/icons.png') no-repeat 6px -260px;}
span.modul_text { background: url('/images/icons/icons.png') no-repeat -362px -26px;}


span.galleries_reload { background: url('/images/icons/icons.png') no-repeat -247px -465px; }
span.galleries_image_edit { background: url('/images/icons/icons.png') no-repeat -362px -26px; }
span.galleries_add { background: url('/images/icons/icons.png') no-repeat -109px -257px; }
span.galleries_image_delete { background: url('/images/icons/icons.png') no-repeat -17px -257px; }

h2.admin_news_dates { margin: 0; background: #bcdfff; padding: 2px; }

div.admin div span.delete, #obrisi_galeriju { background: #810018 url(); -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; font-size: 9px; padding: 2px 4px; border: 1px solid #4f000f; display: none; float: right; width: 40px; text-align: center; margin: 4px; line-height: 10px; color: white}
div.admin_pool div { padding: 3px;}

div.admin div span.date { background: white; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; font-size: 9px; padding: 4px; border: 1px solid #c3c3c3; float: right; width: 40px; text-align: center; margin: 4px; line-height: 10px}
div.admin div:hover span.date { display: none }
div.admin div:hover span.delete { display: block}
div.admin abrr { display: block; float: left; margin: 5px 10px; width: 70%; font-style: normal; }
div.admin abrr  small { clear: both}
.clear{ clear: both}


div.gallery_item { width: 30%; margin: 1% 1% 0 0;float: left; height: 130px; border: 1px solid white; background: url(../images/spinner.gif) no-repeat center center}
div.gallery_item:hover {background-color: #f7f7f7; -webkit-border-radius: 3px;-moz-border-radius: 3px; border: 1px solid #d3d6d4 }
div.gallery_item strong { display: block; font-weight: bold; height: 22px; text-indent: 5px; line-height: 22px; background: #f7f7f7; overflow: hidden; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; font-size: 8pt; cursor: pointer }
div.gallery_item:hover strong { background: #c1c4c2}

div.gallery_photos { float: left; }
div.gallery_photos img { margin: 6px; border: 1px solid #66ccff; -moz-box-shadow: 0 0 1em #cccccc; -webkit-box-shadow: 0 0 1em #cccccc;}
div.gallery_photos img:hover { -moz-box-shadow: 0 0 1em #66ccff; -webkit-box-shadow: 0 0 1em #66ccff;}
div.gallery_photos img.selected { border-color: #ff6666; -webkit-box-shadow: 0 0 1em #ff6666; -moz-box-shadow: 0 0 1em #ff6666;}


/* MODUL */

.modul_add {
    display:block;
    float:left;
    background-color:#f5f5f5;
    border:1px solid #dedede;
    border-top:1px solid #eee;
    border-left:1px solid #eee;

    font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
    font-size:9px;
    line-height:16px;
    height:16px;
    width: 16px;
    text-align: center;
    text-decoration:none;
    font-weight:bold;
    color:#565656;
    cursor:pointer;
}

.modul_add:hover{
    background-color:#dff4ff;
    border:1px solid #c2e1ef;
    color:#336699;
}
.modul_add:active{
    background-color:#6299c5;
    border:1px solid #6299c5;
    color:#fff;
}


#panel_moduli h3.accordianToggler {
	padding: 3px 3px 3px 10px;
	font-weight: normal;
	background: url('../images/bg-panel-header.gif') repeat-x left bottom;
	border-top: 1px solid #d1d1d1;
}
#panel_moduli div.accordianContent br { display: none}
#panel_moduli div.accordianContent label {
	display: block;
	padding: 3px 3px 3px 10px;
	border-bottom: 1px dotted #e8ebeb;
}
#panel_moduli div.accordianContent label:hover {
	background: #e8ebeb;
}

dl.modul {
	border: 1px solid transparent;
}