@import "reset.css";



/* Table of Content
==================================================
	# Basic styles
	# Top navigation
	# Left navigation & widgets
	# Common styles
	# Content
	# Statistic row
	# Gallery
	# Buttons
	# Content widgets
	# Progress bars	
	# Tables 
    # Pagination
	# Form styles	
	# Footer
	# Other plugin styles
	# Media queries (remove them if you don't want to use responsive layout)
==================================================*/



/* #Basic Styles
================================================== */

/* Wrappers */

html { height: 100%; background: transparent url(http://template.webpont.com/images/backgrounds/bg.jpg); }
.html { height: 100%;  }
body { min-height: 100%; font-size: 12px; color: #595959; font-family: Arial, Helvetica, sans-serif; line-height: 20px; position: relative; text-align: center; }
.wrapper { position: relative; margin: 0 3%; }
.contentWrapper { position: relative; margin: 0 3%; float: right; width: 94%; }
.chart, .bars, .updating, .pie { height: 250px; z-index: 90; max-width: 100%; }
.chartWrapper { overflow: hidden; }

/* Text */

h1 { font-size: 24px; }
h2 { font-size: 22px; }
h3 { font-size: 20px; }
h4 { font-size: 18px; }
h5 { font-size: 16px; }
h6 { font-size: 14px; }


p { padding-top: 12px; }

.textL { text-align: left; }
.textR { text-align: right; }
.textC { text-align: center; }

.red { color: #A73939; }
.green { color: #599414; }
.lGrey { color: #808080; }
.blue { color: #4286ad; }
.orange { color: #c75510; }

.f11 { font-size: 11px; }

/* Dividers */

.line { height: 8px; background: url(http://template.webpont.com/images/divider.png) repeat-x; display: block; }
.cLine { height: 4px; background: url(http://template.webpont.com/images/contentDivider.png) repeat-x; }
.sidebarSep { background: url(http://template.webpont.com/images/sidebarSep.png) no-repeat 50%; height: 8px; width: 100%; margin: 16px 0; }

/* Content */

.legendLabel span { display: block; margin: 0 5px; }
.legendColorBox { padding-left: 10px; }

.clear { clear: both; }

.last { border-bottom: none!important; }

.floatR { float: right; }
.floatL { float: left; }

.nobg { background: none!important; }
.nomargin { margin: 0; }
.nomarginL { margin-left: 0!important; }
.nomarginR { margin-right: 0!important; }
.np { padding: 0!important; }

.sideMargin { margin: 0 12px; }

#leftSide { background: url(http://template.webpont.com/images/backgrounds/leftTop.png) repeat-x 0 0; margin: 0 2px; float: left; width: 216px; padding: 0 1px; padding-bottom: 60px; } 
#rightSide { padding-bottom: 62px; overflow: hidden; }

.scroll { height: 182px; overflow: auto; }

.dn, .resp { display: none; }

select[multiple] { border: 1px solid #ddd; box-shadow: 0 0 0 2px #f4f4f4; -webkit-box-shadow: 0 0 0 2px #f4f4f4; -moz-box-shadow: 0 0 0 2px #f4f4f4; color: #656565; background: white; }

/* Placeholder colors */

::-webkit-input-placeholder { color: #b3b3b3; }
:-moz-placeholder { color: #b3b3b3; }
.test_wrap {
    width: 40%;
    margin: auto;
    padding-top: 20px;
}
.table_wraper {
    background: #F9F9F9;
    /*border: 1px solid #CDCDCD;*/
    border-top: 1px solid #78a92b;
    
    clear: both;
    width: 90%;
    
    box-shadow: 0 1px 0 #fff;
    -moz-box-shadow: 0 1px 0 #fff;
    -webkit-box-shadow: 0 1px 0 #fff;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
    border-radius: 3px;
    border-bottom: 1px solid #E7E7E7;
    margin: auto;
    margin-top: 32px;
}
table {
width: 90%;
margin: 2% auto 2% auto;
border-collapse: collapse;
border-top: 1px solid #78A92B !important;
border-left: 1px solid #CDCDCD !important;
border-right: 1px solid #CDCDCD !important;
border-bottom: 1px solid #CDCDCD !important;
border-radius: 3px;

}
table tr {
    border-bottom: 1px solid #E7E7E7;
    background-color: white;
}
    table tr:hover {
        background: transparent url(http://template.webpont.com/images/backgrounds/bg.jpg);
    }
table tr:last-child {
    border-bottom: none;

}
table td {
    padding: 8px 10px;
    border-left: 1px solid #E7E7E7 !important;
    border-bottom: 1px solid #E7E7E7 !important;
    vertical-align: middle;
}
table td:first-child {
    border-left: none;
}
table td.center {
text-align: center;
}
table td.center_imp {
text-align: center;
font-weight: bold;
}
table th {
    vertical-align: middle;
    text-align: center;
    color: #000000 !important;
    padding:4px;
font-size: 14px;
font-weight: bold;
height: 36px;
background: #EFEFEF url(http://template.webpont.com/images/backgrounds/titleBg2.png) repeat-x 0 0;
border-left: 1px solid #78A92B;
border-right: 1px solid #78A92B;
border-bottom: 1px solid #78A92B;

}


.table_head {
    font-size: 12px;
font-weight: bold;
    height: 36px;
    background: #EFEFEF url(http://template.webpont.com/images/backgrounds/titleBg2.png) repeat-x 0 0;
    border-top:1px solid #cdf07f;
    border-left:1px solid #78a92b;
    border-right:1px solid #78a92b;
    border-bottom:1px solid #78a92b;
-webkit-border-top-right-radius: 3px;
-webkit-border-top-left-radius: 3px;
-moz-border-radius-topright: 3px;
-moz-border-radius-topleft: 3px;
}
.table_head h6 {
    float: left;
font-size: 12px;
font-weight: bold;
padding: 9px 12px 8px 12px;
border-left: 1px solid #cdf07f;
color: white;
}

table .odd {
background-color: #FCFCFC;
}


table.even {
background-color: whiteSmoke;
}

table tr.hover:hover {
    background-color: #ffe785;
    color: black;
}


.titleIcon {
float: left;
padding: 11px 11px;
border-right: 1px solid #78a92b;
}

.statsRow {
background: url(http://template.webpont.com/images/backgrounds/titleRowBg.png);
}
.wrapper {
position: relative;
margin: 0 3%;
}
.controlB {
text-align: center;
padding: 11px 0 22px 0;
}
.controlB {
text-align: center;
padding: 11px 0 22px 0;
}
.controlB ul li {
display: inline-block;
margin: 11px 5px 0 5px;
background: url(http://template.webpont.com/images/backgrounds/controlB.png) repeat-x;
border: 1px solid #D5D5D5;
text-align: center;
box-shadow: inset 0 0 0 1px #fff;
-webkit-box-shadow: inset 0 0 0 1px #fff;
-moz-box-shadow: inset 0 0 0 1px #fff;
moz-border-radius: 3px;
-webkit-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;

}

.controlB ul li a {
padding: 10px 20px 4px 20px;
display: block;
font-weight: bold;
white-space: nowrap;
color: #626262;
}
.controlB ul li a span {
display: block;
margin-top: 5px;
}

.dataTables_wrapper .ui-toolbar {
padding: 5px;
}
.footer {
font-weight: normal;
background: #EFEFEF url(http://template.webpont.com/images/backgrounds/titleBg.png) repeat-x;
border-top: 1px solid #D5D5D5;
margin-top: -1px;
border-right: none;
padding: 5px;
border-bottom: 1px solid #E7E7E7;
border-left: 1px solid #E7E7E7;
border-right: 1px solid #E7E7E7;
-webkit-border-bottom-left-radius: 3px;
-webkit-border-bottom-right-radius: 3px;
-moz-border-radius-bottomleft: 3px;
-moz-border-radius-bottomright: 3px;
box-shadow: 0 1px 0 #fff;
-moz-box-shadow: 0 1px 0 #fff;
-webkit-box-shadow: 0 1px 0 #fff;

}
.dataTables_filter {
text-align: left;
margin: 4px 8px 2px 10px;
bottom: 8px;
color: #878787;
font-size: 11px;
float: left;
}
.dataTables_paginate {
width: auto;
}
.dataTables_paginate {
text-align: right;
margin: 6px;
}
.ui-buttonset {
margin-right: 5px;
}
.itemsPerPage {
display: block;
float: left;
margin-right: 10px;
}
.dataTables_filter input[type="text"] {
padding: 3px 20px 3px 5px!important;
border: 1px solid #D5D5D5;
width: 200px!important;
position: relative;
margin-left: 6px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-khtml-border-radius: 2px;
border-radius: 2px;
color: #878787;
}
input[type=text].error {
    border: 1px solid #C42D38;
    background-color: #FFAEAE;
}
.dataTables_filter .srch {
position: relative;
left: -15px;
top: -14px;
background: url( http://template.webpont.com/images/searchSmall.png) no-repeat 0 0;
border: none;
width: 9px;
height: 9px;
float: right;
}
.ui-buttonset .ui-button {
background: #FAFAFA;
border: 1px solid #D5D5D5;
line-height: 14px;
font-size: 11px;
}
.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled {
opacity: .35;
filter: Alpha(Opacity=35);
}

.paging_full_numbers .ui-button {
padding: 2px 6px;
cursor: pointer;
margin-right: 3px !important;
}
.dataTables_paginate .last {
border-bottom: 1px solid #D5D5D5!important;
}
input[type="text"],input[type="password"],textarea {
display: block;
margin: auto;
font-size: 11px;
padding: 5px 6px;
background: white;
border: 1px solid #DDD;
width: 100%;
font-family: Arial, Helvetica, sans-serif;
box-shadow: 0 0 0 2px #F4F4F4;
-webkit-box-shadow: 0 0 0 2px #F4F4F4;
-moz-box-shadow: 0 0 0 2px #f4f4f4;
color: #656565;
}
.selector {
position: relative;
height: 28px;
background: url(http://template.webpont.com/images/forms/select_left.png) no-repeat top left;
float: left;
width: 190px;
position: relative;
padding-left: 10px;
}
.selector span{
width: 190px;
cursor: pointer;
position: absolute;
right: 0;
height: 28px;
background: url(http://template.webpont.com/images/forms/select_right.png) no-repeat center right;
top: 0;
line-height: 28px;
font-size: 11px;
}
.selector select {
width: 200px;
font-size: 12px;
position: absolute;
height: 28px;
top: 0;
left: 0;
}
.container {
    padding-top: 20px;
    padding-bottom: 20px;
margin: auto;
width: auto;

}
.checker input, .radio input, .selector select {
cursor: pointer;
}
.checker {
width: 15px;
height: 15px;
position: relative;
float: left;
}
.checker span.checked {
background-position: center bottom;
}
.checker span {
background: 
transparent url(http://template.webpont.com/images/forms/checkbox.png) no-repeat 0 0px;
vertical-align: middle;
height: 15px;
width: 15px;
display: -moz-inline-box;
display: inline-block;
text-align: center;
}
.checker input {
width: 15px;
height: 15px;
opacity: 0;
filter: alpha(opacity:0);
display: inline-block;
background: none;
}

.formRow .checker, .formRow .radio {
margin-right: 12px;
margin-top: 4px;
}
.radio {
width: 15px;
height: 15px;
position: relative;
float: left;}

div.radio span.checked {
background-position: center bottom;
}
.radio span {
background: 
transparent url(http://template.webpont.com/images/forms/radio.png) no-repeat 0 0;
vertical-align: middle;
height: 15px;
width: 15px;
display: block;
display: -moz-inline-box;
display: inline-block;
text-align: center;
}
div.radio input {
opacity: 0;
filter: alpha(opacity:0);
text-align: center;
display: inline-block;
background: none;
width: 15px;
height: 15px;
}



.button, button, input[type="submit"], input[type="reset"], input[type="button"] {
font-size: 10px;
font-weight: bold;
background-image: url(http://template.webpont.com/images/ui/usualButtons.png);
background-repeat: repeat-x;
text-transform: uppercase;
white-space: nowrap;
cursor: pointer;
font-family: Arial, Helvetica, sans-serif;
line-height: 12px;
display: inline-block;
height: 29px;
padding: 0px 10px 0px 10px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-khtml-border-radius: 2px;
border-radius: 2px;
background-position: 0 0;
border: 1px solid #C7C7C7;
color: #595959;
}

.redB {
background-position: 0 -170px !important;
border: 1px solid #9F352B !important;
color: white !important;
}
.blueB {
background-position: 0 -85px !important;
border: 1px solid #3672A0 !important;
color: white !important;
}
.greenB {
background-position: 0 -425px !important;
border: 1px solid #7CA82A !important;
color: white !important;
}
.greyishB {
background-position: 0 -255px !important;
border: 1px solid #576270 !important;
color: white !important;
}
.brownB {
background-position: 0 -340px !important;
border: 1px solid #99682B !important;
color: white !important;
}
.dredB {
background-position: 0 -510px !important;
border: 1px solid #893F3F !important;
color: white !important;
}
.violetB {
background-position: 0 -595px !important;
border: 1px solid #7E6095 !important;
color: white !important;
}
.dblueB {
background-position: 0 -680px !important;
border: 1px solid #2E6691 !important;
color: white !important;
}
.blackB {
background-position: 0 -765px !important;
border: 1px solid #2F2F2F !important;
color: white !important;
}
.orangeB {
background-position: 0 -849px !important;
border: 1px solid #FF6600 !important;
color: white !important;
}




.button span {
padding: 7px 18px 8px 18px;
display: inline-block;
height: 12px;
}

.pages li.prev {
margin-right: 15px;
}
.pages li.next {
margin-left: 15px;
}
.pages li {
display: inline-block;
margin: 5px 2px;
}
.pages li a {
height: 25px;
padding: 4px 8px;
text-decoration: none;
color: #666;
font-weight: bold;
background: url(http://template.webpont.com/images/backgrounds/pagingBg.png) repeat-x 0 0;
border: 1px solid #D5D5D5;
font-size: 11px;
}

.pages li .active {
background: url(http://template.webpont.com/images/backgrounds/sideGradient.png) repeat-x;
color: white;
border-color: #424852;
}

.pager {
margin: auto;
width: auto;
text-align: center;
margin-top: 30px;

}
.hidden {
    display: none;
}
.statsPlus, .statsMinus {
padding-left: 20px;
}
.statsPlus {
background: url(http://template.webpont.com/images/icons/grown.png) no-repeat 0 2px;
color: #599414;
}
.statsMinus {
background: url(http://template.webpont.com/images/icons/dropped.png) no-repeat 0 2px;
color: #A73939;
}

.tipsy-w {
    display: block;
    opacity: 0.8;
}
.tipsy {
    opacity: 0.8;
padding: 4px;
font-size: 11px;
position: absolute;
z-index: 100000;
}
.tipsy-w .tipsy-arrow {
top: 50%;
margin-top: -4px;
left: 0;
width: 5px;
height: 9px;
}
.tipsy-arrow {
position: absolute;
background: url('http://template.webpont.com/images/tipsy.gif') no-repeat top left;
width: 9px;
height: 5px;
}
.tipsy-inner {
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
padding: 2px 8px 2px 8px;
background-color: black;
color: white;
max-width: 200px;
text-align: center;

}

.tipsy-h .tipsy-arrow {
bottom: -1px;
margin-top: -4px;
left: 50%;
width: 9px;
height: 9px;
}

.checkers label {
float: left;
margin-right: 24px;
padding: 2px 0;
cursor: pointer;
}

.widget {
background: #F9F9F9;
border: 1px solid #CDCDCD;
margin-top: 32px;
clear: both;
box-shadow: 0 1px 0 white;
-moz-box-shadow: 0 1px 0 #fff;
-webkit-box-shadow: 0 1px 0 white;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
}
    .widget .table_head {
        border-left: none;
        border-right: none;
    }
.widget .body {
padding: 12px 16px;
}

.widget .title {
height: 36px;
border-bottom: 1px solid #CDCDCD;
background: #FAFAFA;
background: -moz-linear-gradient(top, #FAFAFA 0%, #EFEFEF 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FAFAFA), color-stop(100%,#EFEFEF));
background: -webkit-linear-gradient(top, #FAFAFA 0%,#EFEFEF 100%);
background: -o-linear-gradient(top, #FAFAFA 0%,#EFEFEF 100%);
background: -ms-linear-gradient(top, #FAFAFA 0%,#EFEFEF 100%);
background: linear-gradient(to bottom, #FAFAFA 0%,#EFEFEF 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fafafa', endColorstr='#efefef',GradientType=0 );
}
.widget .title .titleIcon {
float: left;
padding: 11px 11px;
border-right: 1px solid #D5D5D5;
}
.widget .title h6 {
float: left;
font-size: 12px;
font-weight: bold;
padding: 9px 12px 8px 12px;
}

.legend table {
    width: auto !important;
}
.legend table td {
    padding: 0px 0px 0px 10px;
}
.legend table tr,td {
    border: none !important;
}