/*
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: 2.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(jquery.pnotify.default.html);

@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,h2,h3,h4,h5,h6 {font-weight: normal}
h1 {font-size: 2em}
h2 {font-size: 1.8em}
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: 25px;
}
#navcontainer {background: url("../images/menu/bg.png") repeat-x scroll left top; margin-right: 3px}

#logo {
    background: url(../images/logo.png) no-repeat;
    width: 219px; height: 39px; display: block; float: left; margin-top: 5px;
}

nav ul {float:right}
nav ul li {float: left;}
nav ul li a {color: #929292; padding: 18px 8px; font-size: 1em}
nav ul li a:hover {text-decoration: none}
nav ul li.sep {border-left: 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: 6px;width: 6px;}

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: #fff}
#user .username {display: block}
#user li, #user a {color: #777; 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.simple td:last-child {padding-right: 10px}

table .piped, table .piped a {color:#777; font-size: 0.917em;}

.simple thead {border-bottom: 1px solid #d4d4d4}

/* Form
-------------------------------------------------------------------*/
input[type='text'], input[type='password'], input[type='file'], textarea, select {
    background-color: #f6f6f6;
    border: 1px solid #929292;
    border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;
    padding: 6px 5px;
    
}

input[type='text'] {width: 20%}
input.medium {width: 33%}
input.fifty {width: 50%}
input.large {width: 95%; width: -moz-available;}
select {min-width: 20%}
select.small {padding:2px 1px}

.infobar {color: #8F8F8F; 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
-------------------------------------------------------------------*/
#loginpage {background-image: url(../images/login_bg.png); background-repeat: no-repeat; background-position: top center;}
#loginpage img {position: relative; top: 130px}
#login {margin-top: 130px}
#login .widget_content {width: 85%; margin: 5px auto 10px;}
#login label {margin-top: 10px; }
#login label.left {margin-top: 5px}
#loginpage input[type=text], #loginpage input[type=password] {width:270px; width:-moz-available}
#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 {height: 80px; width: 80px;  display: inline-block; margin: 10px 0; float: left;zoom: 1;*display:inline; position:relative;
	border:1px solid #e1e1e1;
	border-radius: 5px;
	text-align:center;
	padding:5px;
	margin-right:5px;
	background-color:#222936;
}
.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 a{ color:white;}
.gallery li img {display: block; background: #fafafa; padding: 6px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border: 1px solid #dfdfdf; margin: 0 auto; margin-top:10px; margin-bottom:5px;}
.gallery li .hor-list {text-align: center; color: #999}
.gallery .btn {box-shadow:inset 0 1px 0 0 #5fa1ce; -moz-box-shadow:inset 0 1px 0 0 #5fa1ce; -webkit-box-shadow:inset 0 1px 0 0 #5fa1ce}

.img_options {position: absolute; z-index: 99; top: 15px;}
.img_options li {float: none; text-align: center; display: block; margin: 7px 0}

.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; */ /* Remove for semi-transparent search */
    border: 0 none !important;
    box-shadow: none !important; color: #DDDDDD;
    width: 200px !important;
    padding:7px 25px 8px 5px;
    margin-top: 10px;
    font-family: Tahoma;
    font-size: 12px;
    color: #545454;
}

.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}

/* Sidebar
-------------------------------------------------------------------*/
#sidebar{position:absolute;top:0;left:0;width:204px;height:100%;background-image: url(../images/menu/sidebar_bg.png); background-repeat: repeat-y; background-position: top right}
@media screen{
  body>div#sidebar{position:fixed;}
}
* html body{overflow:hidden;}
* html #wrap{height:100%;overflow:auto;}
#wrap.sidebarred {margin-left: 204px;} /* same as width of #sidebar */

.sidebarred #pagetitle {margin-top: 20px;padding: 15px 10px;-moz-border-radius-topleft: 5px;-moz-border-radius-topright: 5px;-moz-border-radius-bottomright: 0px;-moz-border-radius-bottomleft: 0px;-webkit-border-radius: 5px 5px 0px 0px;border-radius: 5px 5px 0px 0px; }
.sidebarred #pagetitle h1 {line-height: 1.2em}

#sidebar nav {margin-top: 0}
#sidebar #user {width: 184px; padding: 12px 12px 12px 8px; background: url(../images/menu/sidebar_top.png) no-repeat top left}
#sidebar .username a {display: block}

#sidemenu {display: block; width:204px;}
#sidemenu .icon {float: right}
#sidemenu .icon img {vertical-align: bottom}
#sidemenu .title, #sidemenu li li a {font-size: 12px}
#sidemenu li {position: relative; display: block; width: 202px;} /* width of #sidebar */
#sidemenu li a {padding: 10px; color: #777;}
#sidemenu li ul {display: block; }
#sidemenu .notification {top: 4px;}
#sidemenu .active a {background: url(../images/menu/sidebar_acc_border.png) bottom repeat-x; }
#sidemenu .active {background: url(../images/menu/sidebar_acc_border.png) top repeat; }
#sidemenu li.sep {border-top: 1px solid #000000}
#sidemenu li li {background: url(../images/menu/bullet.png) 12px center no-repeat;}
#sidemenu li li a {display: block; background: url(../images/menu/sidebar_acc_active.png);  padding: 5px 0px 5px 25px;}