/*
Theme Name: Chameleon Circuit
Theme URI: tpl_chameleoncircuit
Description: A full featured unlimited colors admin panel theme from Themio
Author: Themio
Author URI: http://themio.net
Version: 1.0

/* Structure
-------------------------------------------------------------------*/
@import url(reset.css);
@import url(global.css);
@import url(typography.css);
@import url(buttons.css);
@import url(jqueryui.css);
@import url(jquery.cleditor.css);
@import url(iphonecheckbox.css);
@import url(superfish.css);
@import url(fullcalendar.css);
@import url(colorbox.css);
@import url(uploadify.css);
@import url(tipsy.css);

@import url(config.css);

html {font-size: 100%;}
body {font-size: .75em;line-height: 1.5; background: url(../images/bg.png) repeat;}

a {text-decoration: none; color: #004a80; cursor: pointer;}
a:hover {text-decoration: underline}

#actualbody {background: #f1f1f1; border: 1px solid #c2c2c5; border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; padding: 10px 0; margin-bottom: 70px;}

/* Typography
-------------------------------------------------------------------*/
h1 {font-size: 3em}
h2 {font-size: 2.4em}
h3 {font-size: 1.6em}
h4 {font-size: 1.4em}
h5 {font-size: 1.2em}
h6 {font-size: 1em}

p {margin: 5px 0}

/* Header
-------------------------------------------------------------------*/
header {background-image: url(../images/header_bg.png); background-repeat: no-repeat; padding-top: 10px}

nav {
     background-image: url("../images/menu/bg-r.png"); background-repeat: no-repeat; background-position: top right;
    -moz-border-radius-topleft: 3px;
    -moz-border-radius-topright: 3px;
    -moz-border-radius-bottomright: 0px;
    -moz-border-radius-bottomleft: 0px;
    -webkit-border-radius: 3px 3px 0px 0px;
    border-radius: 3px 3px 0px 0px; 
    margin-top: 10px;
}
#navcontainer {background: url("../images/menu/bg.png") repeat-x scroll left top; margin-right: 3px}

#logo {
    background: url(../images/logo_small.png) no-repeat;
    width: 45px; height: 37px; display: block; float: left; margin-top: 1px;
}

nav ul {float:right}
nav ul li {float: left;}
/*nav ul li a {color: #929292; padding: 18px 10px; font-weight: bold; font-size: 0.9em} jona */ 
nav ul li a {color: #333333; padding: 18px 10px; font-weight: bold; font-size: 0.9em}
nav ul li a:hover {text-decoration: none}
nav ul li.sep {border-left: 1px solid #000}
nav ul li.hsep {border-top: 1px solid #000}
nav ul li a.ui-tabs-selected, nav ul li a:hover {color:#fff}
nav ul .icon {height: 20px; width: 20px; margin: 0 auto; display: block}
nav ul .notification {background: #b01e1e;border-radius: 30px 30px 30px 30px;-moz-border-radius: 30px 30px 30px 30px;-webkit-border-radius: 30px 30px 30px 30px;box-shadow: 1px 1px 1px #333333;color: #E4E4E4;display: block;font-size: 10px;height: 6px;line-height: 4px;padding: 5px;position: absolute;right: 23px;text-align: center;top: 1px;}
nav ul .notificationg {background: #336600;border-radius: 30px 30px 30px 30px;-moz-border-radius: 30px 30px 30px 30px;-webkit-border-radius: 30px 30px 30px 30px;box-shadow: 1px 1px 1px #333333;color: #E4E4E4;display: block;font-size: 10px;height: 6px;line-height: 4px;padding: 5px;position: absolute;right: 23px;text-align: center;top: 1px;}
nav ul .notificationo {background: #FF6600;border-radius: 30px 30px 30px 30px;-moz-border-radius: 30px 30px 30px 30px;-webkit-border-radius: 30px 30px 30px 30px;box-shadow: 1px 1px 1px #333333;color: #E4E4E4;display: block;font-size: 10px;height: 6px;line-height: 4px;padding: 5px;position: absolute;right: 23px;text-align: center;top: 1px;}
nav ul .notificationy {background: #FF9900;border-radius: 30px 30px 30px 30px;-moz-border-radius: 30px 30px 30px 30px;-webkit-border-radius: 30px 30px 30px 30px;box-shadow: 1px 1px 1px #333333;color: #E4E4E4;display: block;font-size: 10px;height: 6px;line-height: 4px;padding: 5px;position: absolute;right: 23px;text-align: center;top: 1px;}
nav ul .notificationb {background: #113578;border-radius: 30px 30px 30px 30px;-moz-border-radius: 30px 30px 30px 30px;-webkit-border-radius: 30px 30px 30px 30px;box-shadow: 1px 1px 1px #333333;color: #E4E4E4;display: block;font-size: 10px;height: 6px;line-height: 4px;padding: 5px;position: absolute;right: 23px;text-align: center;top: 1px;}

nav .sf-menu li.active {background: url(../images/menu/selected.png) no-repeat bottom center;}
nav ul li.active {opactiy: 0.2}

#user {width: 225px; float: left; padding: 10px 0 0 10px}
#user ul {float: left}
#user li {margin: 0}
#user strong, #user strong a {color: #333}
#user .username {display: block}
/*#user li, #user a {color: #777; padding: 0} jona */
#user li, #user a {color: #222; padding: 0}

#user img {width: 32px; height: 32px; background:url(../images/menu/avatarframe.png); border-radius: 2px; -moz-border-radius: 2px; -webkit--moz-border-radius: 2px; display: block; float: left; margin-right: 5px; padding: 5px;}
#user ul a {text-decoration: underline}

#pagetitle {background: #fff; padding: 10px}
#pagetitle h1 {font-size: 1.75em; line-height: 1em}

/* Breadcrumbs and Pagination
-------------------------------------------------------------------*/
.breadcrumbs li {font-size: 0.75em; color: #999; float: left;}
.breadcrumbs li a {color: #4d4d4d}

.pagination {padding: 10px 10px 0}

.pagination li {
    background: #ededed; border: 1px solid #a5a5a5; font-size: 0.88em;
    background: -moz-linear-gradient(top, #ededed 0%, #ebebeb 50%, #e7e7e7 51%, #e3e3e3 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ededed), color-stop(50%,#ebebeb), color-stop(51%,#e7e7e7), color-stop(100%,#e3e3e3));
    background: -webkit-linear-gradient(top, #ededed 0%,#ebebeb 50%,#e7e7e7 51%,#e3e3e3 100%);
    background: -o-linear-gradient(top, #ededed 0%,#ebebeb 50%,#e7e7e7 51%,#e3e3e3 100%);
    background: -ms-linear-gradient(top, #ededed 0%,#ebebeb 50%,#e7e7e7 51%,#e3e3e3 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#e3e3e3',GradientType=0 );
    background: linear-gradient(top, #ededed 0%,#ebebeb 50%,#e7e7e7 51%,#e3e3e3 100%);
    float: left; padding: 2px 5px; display: inline-block; text-align: center;
    margin: 5px; cursor: pointer; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;
    font-weight: bold; line-height: 1.2em; color: #666;
    box-shadow: 0 1px 0 0 white inset; -moz-box-shadow: 0 1px 0 0 white inset; -webkit-box-shadow: 0 1px 0 0 white inset;
}
.pagination li a {color: #666}
.pagination li a:hover {text-decoration: none}
.pagination li.active, .pagination li.active a {color: #111}
.pagination li.disabled, .pagination li.disabled a {cursor: default; color: #aaa}

/* Widgets
-------------------------------------------------------------------*/
.widget {margin-top: 15px; margin-bottom: 10px; 
        background-image: url(../images/menu/title-r.png); background-repeat: no-repeat; background-position: top right;
        -moz-border-radius:4px;border-radius:4px; -moz-border-radius:4px;
}

.widget_title {
    -moz-border-radius-topleft: 4px;-moz-border-radius-topright: 0px;-moz-border-radius-bottomright: 0px;-moz-border-radius-bottomleft: 0px;
    -webkit-border-radius: 4px 0px 0px 0px; border-radius: 4px 0px 0px 0px;
    margin-right: 4px;
    background: url(../images/menu/title.png) top left;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset; -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset; -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset;
}

.widget_title h2 {font-size: 1.2em; color: #fff; text-shadow: 0 -1px 0px #000; display: inline; line-height: 2.3em; padding: 0 10px; font-weight: normal}
.widget_title ul {float: right;}
.widget_title ul li {float:left; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;margin: 5px;}

.widget_title ul li a {display: block;padding: 4px 6px 5px 9px;margin-right: 3px}

.widget_title .ui-tabs-selected {background: url(../images/form/tab-r.png) no-repeat top right; }
.widget_title .ui-tabs-selected a {background: url(../images/form/tab.png) no-repeat top left; margin-right: 3px;}

.widget_title .ui-tabs-nav li {font-size: 0.87em;font-weight: bold;}

.widget_title .ui-state-default a {color: #aaa}
.widget_title .ui-state-hover a {text-decoration: none; color: #fff}
.widget_title .ui-tabs-selected a {color: #fff;}

.ui-toolbar input[type='text'], .ui-toolbar input[type='password'], .ui-toolbar input[type='file'], .ui-toolbar textarea, .ui-toolbar select,
.widget_options input[type='text'], .widget_options input[type='password'], .widget_options input[type='file'], .widget_options textarea, .widget_options select {margin-bottom: 0px}
    
.widget_body {border-radius:0 0 4px 4px;-moz-border-radius:0 0 3px 3px; background: #fff; padding-bottom: 10px; border: 1px solid #c1c1c1;}
.widget_options {background: #f7f7f7; border-bottom: 1px solid #d4d4d4; padding: 10px}

.widget_content {padding: 5px 10px ;}

/* Tables
-------------------------------------------------------------------*/
table {width: 100%}
caption {background: #525252;color: #FFFFFF;font-weight: bold;line-height: 2em;}
thead th, thead td {color:#777; font-size: 0.917em; font-weight: bold; vertical-align: middle; padding: 10px 5px}
td {text-align: left; padding: 5px; vertical-align: middle}
tbody tr.odd  {background:#f7f7f7}
tbody tr.even {background:#ededed}

table.simple td:first-child {padding-left: 10px}

table .piped, table .piped a {color:#777; font-size: 0.917em;}

.simple thead {border-bottom: 1px solid #d4d4d4}

/* Form
-------------------------------------------------------------------*/
/* label {font-weight: bold;} */

input[type='text'], input[type='password'], input[type='file'], textarea, select {
    background-color: #f6f6f6;
    border: 1px solid #cbcbcb;
    border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;
    padding: 6px 5px;
    box-shadow: 0 1px 0px #E0E0E0 inset; -moz-box-shadow: 0 1px 0px #E0E0E0 inset; -webkit-box-shadow: 0 1px 0px #E0E0E0 inset;
}

input[type='text'] {width: 20%}
input.medium {width: 33%}
input.fifty {width: 50%}
input.large {width: 98.5%; width: -moz-available;}
input.cal {background: url(../images/calendar.gif) no-repeat right; background-color: white; border: 1px solid #cbcbcb; padding: 3px 5px;}
select {min-width: 20%}
select.small {padding:2px 1px}

.infobar {color: #bbbbbb; font-size: 0.833em; display: block; padding-bottom: 3px;}

.nested ul, .nested ol {margin-left: 2em}

span.vanadium-advice {margin-left: 15px}
span.vanadium-invalid {background: url("../images/fugue/cross.png") no-repeat scroll left center transparent; padding:1px 0 1px 18px}

.upload {display: inline}
.realupload {position: relative;left: -21%;opacity:0;-moz-opacity:0;filter:alpha(opacity:0);z-index:2;width:20%;}
.fakeupload {background-image:url(../images/form/selectfile.png);background-position: 100% 50%;background-repeat:no-repeat;}

.inputHighlight {color: #959595 !important}

/* Login Page
-------------------------------------------------------------------*/
#login {margin-top: 300px}
#login .widget_content {width: 60%; margin: 5px auto 10px;}
#login label {margin-top: 10px}
#login input[type=submit] {padding: 4px 10px; margin: 10px 0 10px}

/* Footer
-------------------------------------------------------------------*/
footer {background: #121212; color: #fff; font-size: 0.9em;}
footer a {color: #aaa}

/* Gallery
-------------------------------------------------------------------*/
.gallery {display: block;}
.gallery .btn {display: none}
.gallery li {width: 106px; display: inline-block; margin: 10px 0; float: left;zoom: 1;*display:inline; position:relative;}
.gallery li .hor-list li {display: inline !important; float: none !important; width: 3.5em}
.gallery li img {height: 80px; width: 80px; display: block; background: #fafafa; padding: 6px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border: 1px solid #dfdfdf; margin: 0 auto;}
.gallery li .hor-list {text-align: center; color: #999}

.img_options {position: absolute; z-index: 99; top: 6px;}
.img_options li {float: none; text-align: center; display: block;}

.grid_16 .gallery li {width: 114px;}
.grid_15 .gallery li {width: 107px;}
.grid_14 .gallery li {width: 113px;}
.grid_13 .gallery li {width: 122px;}
.grid_12 .gallery li {width: 112px;}
.grid_11 .gallery li {width: 123px;}
.grid_10 .gallery li {width: 111px;}
.grid_9 .gallery li {width: 124px;}
.grid_8 .gallery li {width: 109px;}

/* Search
-------------------------------------------------------------------*/

header .search {
    background: url("../images/form/h_search.png") no-repeat transparent !important;
    border: 0 none !important;
    box-shadow: none !important; color: #DDDDDD;
    width: 200px !important;
    padding:7px 25px 8px 5px;
    margin-top: 10px;
}

.search, .dataTables_filter input[type='text'] {
    border: 1px solid #b6b6b6;
    border-radius:3px;-webkit-border-radius:3px; -moz-border-radius:3px;
    padding: 3px 20px 3px 3px;
    background: url(../images/custom/search_s.png) no-repeat 98% center #fff !important;
    box-shadow: 0 1px 1px #BBBBBB inset; -moz-box-shadow: 0 1px 1px #BBBBBB inset; -webkit-box-shadow: 0 1px 1px #BBBBBB inset;
    float: right;
}

.widget_options .search {padding: 3px 5px}

/* jona...
-----------------------------------------------------------------*/
sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -1em;
}

sub {
    bottom: -0.25em;
}

.rotatec {
text-align: center;
/*  width:130px; */
/*  height:50px; */
  -ms-transform:rotate(180deg); /* IE 9 */
  -moz-transform:rotate(180deg); /* Firefox */
  -webkit-transform:rotate(180deg); /* Safari and Chrome */
  -o-transform:rotate(180deg); /* Opera */
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); /* Internet Explorer */
}

.rotatel {
/* float: left;*/
text-align: right;
/*  width:130px; */
/*  height:50px; */
  -ms-transform:rotate(180deg); /* IE 9 */
  -moz-transform:rotate(180deg); /* Firefox */
  -webkit-transform:rotate(180deg); /* Safari and Chrome */
  -o-transform:rotate(180deg); /* Opera */
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); /* Internet Explorer */
}

.rotater {
/* float: left;*/
text-align: left;
/*  width:130px; */
/*  height:50px; */
  -ms-transform:rotate(180deg); /* IE 9 */
  -moz-transform:rotate(180deg); /* Firefox */
  -webkit-transform:rotate(180deg); /* Safari and Chrome */
  -o-transform:rotate(180deg); /* Opera */
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); /* Internet Explorer */
}

.rotate90 {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.comment {
  color : #999999;
}
.pending {
	color: #666;
}
.reject {
	color: #B94A48;
}
.gtrust {
        color: #468847;
}
.btrust {
	color: #3A8ABF;
}

.unselectable {
	-webkit-user-select: none;
        -webkit-touch-callout: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        color: #cc0000;
}

.top {
	border-top: thin solid;
	border-color: black;
}
.bottom {
	border-bottom: thin solid;
	border-color: black;
}
.leftb {
	border-left: thin solid;
	border-color: black;
}
.rightb {
	border-right: thin solid;
	border-color: black;
}

.small {font-size: .75em;line-height: 1.0;}

.mandatory::placeholder, label.mandatory {
	color: #FF0000;
	opacity: 0.5;
}

