/* 
========
GENERICS
========
*/

body {font-size: 12px; font-family: Arial, Verdana, Helvetica, sans-serif; background-color: white; padding: 0; margin: 0; color: #666}
body.admin {color: white; background-color: black}
ul {padding: 0 0 1em 25px; margin: 0}
li {padding-bottom: 1em}
li.last {padding: 0 !important; margin: 0 !important; border: 0}
p {margin: 0; padding: 0 0 1em}
hr {border: 0; background: #333333; height: 1px; padding: 0; margin: 1em 0;}

/* tables */
table.standard {padding: 0; margin: 0 0 20px; border: 0; border-collapse: collapse; border-spacing: 0}
table.standard td,
table.standard th {padding: 5px 8px; font-size: 11px; border: 1px solid #444444}
table.standard td.fieldname {font-weight: bold; background-color: #212121; color: #FFD496}
table.standard td.spacer {color: #222222}
table.standard.tiny td {padding: 3px 8px; font-size: 10px}

table thead th {color: #E3DB5A; background-color: #333; font-weight: bold; text-align: left}
table thead tr .header {background: #333 url(/images/tablesorter/bg.gif) no-repeat scroll center right; cursor: pointer; text-align: left; padding-right: 25px}
table thead tr .headerSortUp {background-image: url(/images/tablesorter/asc.gif)}
table thead tr .headerSortDown {background-image: url(/images/tablesorter/desc.gif)}

table.process td {padding: 8px; vertical-align: top}
table.edit td {padding:4px; vertical-align: top}

table#selectable tr {cursor: pointer}

#pager .pagedisplay {margin: 0 10px; border: none; background-color: transparent; color: white; font-size: 11px; display: inline-block; float: left; text-align: center}
#pager img {cursor: pointer; padding: 0 2px; display: inline-block; float: left}

table tr.over {background-color: #222}

/* headings */
h1, h2, h3, h4, h5 {font-family: inherit; color: #e87817; padding: 0 0 0.5em; margin: 1em 0 1em}
h1 {font-size: 20px; padding: 0; margin: 1em 0 0}
h2 {font-size: 18px; border-bottom:1px solid #E87817; line-height: 18px}
h3 {font-size: 14px; margin-top: 0}
h4 {font-size: 13px}
h5 {font-size: 12px}

/* links */
a {color: #666; outline: none}
.admin a {color: white}

a:hover {text-decoration: underline; color: #e87817; outline: none}

/* visual & padding */
.invisible {visibility: hidden; padding: 0 !important}
.show {display: block}
.hide {display: none}
.center {text-align: center}
.centered {text-align: center; vertical-align: middle}

.red {color: red}
.green {color: #0db629}
.yellow {color: #e0e633}
.blue {color: #229af7}
.orange {color: #E87817}
.purple {color: #8a5ae3}

.clear {zoom: 1}
.clear:after {content: "."; display: block; height: 0; clear: both; visibility: hidden}

/* buttons */
.button {padding: 5px 0 10px}
.button.bottom {padding: 20px 0}
.button a {
    text-align: center; 
    display: block; 
    text-decoration: none; 
    font-size: 12px; 
    padding: 6px 0; 
    width: 175px; 
    border: 1px solid #333; 
    background: #5e5d5e url(/images/bg_button.gif) repeat-x 0 bottom; 
    color: white; 
    cursor: pointer; 
    outline: none; 
    -moz-border-radius: 4px;
    border-radius: 4px; 
    -webkit-border-radius: 4px;
}
.button a:hover {color: white; text-decoration: none}

/* loading status */
.loading {background: transparent url(/images/icon_progress4.gif) no-repeat scroll center center}


/*
=================
LAYOUT CONTAINERS
=================
*/

#container {width: 990px; margin: 20px auto 0}
#content {padding: 20px 20px 40px; border-width: 1px 0; border-style:solid; border-color: #ccc}
.admin #content {border-color:#b0b0b0}

#main {float: left; margin-bottom: 25px}

#header {position: relative; height: 72px}
#header .logged_in {top: 90px; font-size:11px; position:absolute; right:20px; text-align:right;}
#footer {text-align: right}

.lhs_box {float: left}
.rhs_box {float: right6}

.inner {padding: 20px}
.inner_10 {padding: 10px}

.debug {padding: 0 0 15px; color:#666666; font-size:10px; width: 990px; margin: 0 auto; text-align: right}

.pad_content {border:1px solid #333333; padding:25px; text-align: center}


/* 
==========
PAGINATION
==========
*/

#pagination {padding: 20px 0 0}
#pagination .page_jump {
    cursor: pointer; 
    display: inline-block; 
    margin: 0 10px 10px 0; 
    float: left; 
    padding: 4px 8px; 
    border: 2px solid #333; 
    text-decoration: none; 
    font-weight: bold;
}
#pagination .page_jump.current {background-color: #E87817; color: white; border-color: #E87817;}
#pagination .page_jump:hover {background-color: white; color: black; border-color: white}


/* 
=============
FORM ELEMENTS
=============
*/

fieldset {padding:0; margin: 0; border: 0; position: relative}
form {padding:0; margin: 0}
form ul {list-style-position: outside; list-style-type: none; padding: 0}
form li {padding: 5px 0}
td, textarea {font-size: 12px; font-family: Arial, Verdana, Helvetica, sans-serif}

.mceLayout {margin: 20px 0 !important}

form.generic {margin: 0 0 30px}
form.generic.flat {margin: 0}

form.generic .textbox {float: left; width: 250px; padding: 5px 0}
form.generic label {float: left; width: 115px; display: block; padding: 5px 0; font-weight: bold}
form.generic label.normal {float: none; width: auto}
form.generic .title {font-weight: bold; text-decoration: underline; padding-bottom:5px; font-size: 13px}

form.generic input.textbox,
form.generic textarea.textareabox {float: left; width: 250px; border: 1px solid #ccc; padding: 5px; overflow: visible; }
.admin form.generic input.textbox,
.admin form.generic textarea.textareabox {border-color: #999; background: white url(/images/bg_input.gif) repeat-x scroll 0 0}

form.generic textarea.textareabox {height: 200px}
form.generic input.normal,
form.generic input.ajax_submit {
    text-align: center; 
    font-size: 12px; 
    padding: 6px 0; 
    width: 175px; 
    border: 1px solid #555; 
    background: #5e5d5e url(/images/bg_button.gif) repeat-x 0 bottom; 
    color: white; 
    cursor: pointer; 
    outline: none; 
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -webkit-border-radius: 4px;
}

form.generic .static {float: left; width: 300px; display: block; padding: 5px 0}

form.generic .response {display: none; padding: 15px 0; font-size: 11px; text-align: center; color: white; width: 175px; color: #52a506}
form.generic .response.loading {padding: 0; height: 60px; background: transparent url(/images/icon_progress4.gif) no-repeat scroll center center}

table.edit textarea {overflow-x: hidden; overflow-y: auto; width: 200px; padding: 0; height: 66px; border: 2px solid #999; margin-right: 15px; font-size: 11px}
table.edit textarea.invalid {border-color: red}

.back_link {padding: 0 30px; background: transparent url(/images/sprite_icons.gif) no-repeat scroll -150px -397px; line-height: 32px; margin-top:25px}
.checkbox_select {padding-left: 22px; line-height: 15px; background: transparent url(/images/icon_select.gif) no-repeat scroll 0 2px; outline: none}

.char_count {text-align: center; font-size: 10px; color: red; display: none}


/*
==== 
TEXT 
==== 
*/

.notice {font-size: 10px}
.tag {font-size: 10px; text-align: center}
.small {font-size: 11px; padding: 0 10px; display: block}

.small_italic {font-size: 10px; font-style: italic}


/*
=======
MESSAGE
=======
*/

.error, .status, .notification {display: none; margin: 10px 0 0; padding: 5px 45px 10px; background: url(/images/sprite_icons.gif) no-repeat scroll 0 0}

.error {background-position: -542px 0}
.status {background-position: -504px -36px}
.notification {background-position: -432px -106px}

.error.show, .status.show, .notification.show {display: block}

.error strong, .status strong, .notification strong {font-size: 13px; margin: 0 0 4px; border: 0; padding: 0; display: block}

.error strong {color: #d11d1d}
.status strong {color: #52a506}
.notification strong {color: #f7e123}

.message ul {list-style-position: inside; list-style-type: disc; padding: 0 0 1em}
.message li {padding: 0; font-size: 11px; color: gray}

.message.flat .error,
.message.flat .status,
.message.flat .notification {padding-left: 0; background: none}


/* 
============
COOKIE TRAIL
============ 
*/

#cookie_trail {font-size: 11px}
#cookie_trail ul {list-style: none; list-style-position: outside; padding: 0}
#cookie_trail li {display: inline; text-transform: capitalize}


/* 
==== 
TABS 
==== 
*/

.tabs {padding: 0; margin: 0}
.tabs li {
	float: left; 
	display: inline-block; 
	height: 32px; 
	line-height: 32px; 
	border-width: 0 1px 1px 0; 
	border-style: solid; 
	border-color:#333; 
	font-size: 11px; 
	font-weight: bold; 
	margin-right: 1px; 
	position: relative;
	text-decoration: none;
	padding: 0 18px; 
	background-color: #555555;
	color: white;
    cursor: pointer;
    z-index: 1000;
}

.tabs li.current {background-color: #e87817 !important; color: white !important}
.tabs li.over {color: black; text-decoration: none; background-color: #f2f2f2}

.tabs .tab_submenu {display: none; padding: 0; position: absolute; left: 0; top: 33px}
.tabs li.over .tab_submenu {display: block !important}
.tabs .tab_submenu li {background-color: #777; display: block; padding: 0; text-align: center; float: none; border-right: 0}
.tabs .tab_submenu li.over {background-color: white}

#tab_content {border: 1px solid #333; padding: 25px; margin-top:1px; z-index: 50; position: relative}


/*
========== 
NAVIGATION 
========== 
*/

#navigation .logo {position: absolute; top:20px; left: 20px; width: 250px; height: 32px; background: transparent url(/Images/logo_white.gif) no-repeat 0 0; text-indent: -9999px}
.admin #navigation .logo {width: 229px; background: transparent url(/Images/logo_black.gif) no-repeat 0 0}

#navigation .links {float: right; margin-top: 20px}
#navigation ul {margin: 5px 20px 0 0; list-style: none; list-style-position: outside; padding: 0}
#navigation li {display: inline-block; float: right; margin-left: 8px}

#navigation li a {
    color: white;
    font-weight: bold;
	font-size: 11px; 
    display: inline-block;
    float: left; 
    text-decoration: none; 
    cursor: pointer; 
    border: 1px solid #ccc; 
    padding: 3px 8px;
    -moz-border-radius: 4px; 
    border-radius: 4px; 
    -webkit-border-radius: 4px;
}

#navigation li a.current {background-color:#e87817e}

#navigation li a:hover {text-decoration: none; background-color: #e87817; color: white}

.links ul {list-style: none; list-style-position: outside; padding:0}


/* 
====== 
FOOTER 
======
*/

#footer {font-size: 10px; padding: 20px}
#footer li {display: inline; padding-right: 3px}

#footer_links {float: right}
#social_links {float: left;}
#social_links img {border: 0}
