/* =====================================================================
// Technophobia
// Created May 2011
// Analytics screen styles
===================================================================== */

/* Clearfixes */
#analytics-panel ul#sub-panels div.section ul.row:after,
#analytics-panel ul#sub-panels div.section div.tabs ul:after,
#analytics-panel ul.pagination:after,
#analytics-panel ul#sub-panels div.section div.tabs div.section:after,
#analytics-panel ul#sub-panels div.tool-panel:after,
#analytics-panel div.tool-panel div.export:after,
#analytics-panel div.tool-panel form.date-picker fieldset:after,
#analytics-panel div.tool-panel div.graph-manipulation:after { display: block; clear: both; visibility: hidden; height: 0; content: ".";}

/* =General Styles
--------------------------------------------------------------------- */
	
.clear {clear: both;}
.hidden {display: none; visibility: hidden;} /* For legends and any element you want to hide on the page - doesn't work with table cells and not good if you need screenreaders to read the content */
.visuallyhidden {position: absolute; left: -1000em; clip: rect(1px, 1px, 1px, 1px)} /* To remove elements off-screen and remove their effect on other elements in the document - doesn't work with table cells */
.hiddencell {text-indent: -1000em;} /* To hide text in a table cell - still read by screen readers */
.invisible {visibility: hidden;} /* To hide an element and its contents but still hold its structure on the page */
.invisiblepartial {visibility: hidden; text-indent: -1000em;} /* To hide an element and its contents but still have its structure have a partial effect on its surrounding elements */

/* =Paragraphs
--------------------------------------------------------------------- */

.formatting p {
	margin: 1em 0;
	hyphenate: auto;
	hyphenate-before: 4;
	hyphenate-lines: 3;
	word-break: hyphenate;
	}

/* ---------------------------------------------------------------------
// §: Analytics Panel
--------------------------------------------------------------------- */

#analytics-panel {
	padding: 0 0 21px;
	font-family: "Trebuchet MS", sans-serif;
	background: #eee url(../images/backgrounds/panel.gif) repeat-x 0 100%;
	display: none;
	}
	
#analytics-panel h2.panel-head {
	display: block;
	position: relative;
	z-index: 2;
	border-bottom: 1px solid #4c4c4b;
	padding: 6px 15px;
 -moz-box-shadow: 0 .1em .5em rgba(0,0,0,.55); -webkit-box-shadow: 0 .1em .5em rgba(0,0,0,.55);
	font-size: 16px;
	text-shadow: 0 -1px .2em rgba(76,76,75,.55);
	color: white;
	background: #646464 url(../images/backgrounds/section-head-dark.gif) repeat-x;
	}
	
#analytics-panel ul#sub-panels {
	display: block;
	margin: 0 auto;
	width: 972px;
	}
	
#analytics-panel ul#sub-panels li > h3 {
	display: block;
	position: relative;
	z-index: 1;
	margin-top: 5px;
	border-bottom: 1px solid #4c4c4b;
	box-shadow: 0 .1em .5em rgba(0,0,0,.55); -moz-box-shadow: 0 .1em .5em rgba(0,0,0,.55); -webkit-box-shadow: 0 .1em .5em rgba(0,0,0,.55);
	text-shadow: 0 -1px .2em rgba(76,76,75,.55);
	font-size: 18px;
	color: #ccc;
	background: #646464 url(../images/backgrounds/section-head-dark.gif) repeat-x;
	}
    
#analytics-panel ul#sub-panels li h3 a {
    display: block;
	padding: 10px 34px;
    color: #fff;
    text-decoration: none;
    }
	
#analytics-panel ul#sub-panels li:first-child > h3,
#analytics-panel ul#sub-panels li.active + li > h3 {margin-top: 0;}

#analytics-panel ul#sub-panels li.active > h3 {
	border-color: #7c7c7b;
	color: white;
	background: #a3a3a3 url(../images/backgrounds/section-head-lit.gif) repeat-x;
	}
	
/* ---------------------------------------------------------------------
// §: Analytics Sub Panel Sections
--------------------------------------------------------------------- */

#analytics-panel ul#sub-panels div.section {
	display: none;
	margin: 0 auto;
	border: solid #ddd;
	border-width: 0 1px;
	padding: 20px 19px;
	width: 920px;
	background: #f3f3f3;
	}
	
#analytics-panel ul#sub-panels li.active div.section {display: block;}
	
#analytics-panel ul#sub-panels div.section h3 {
	font-size: 20px;
	}
    
#analytics-panel ul#sub-panels div.section h4 {
	font-size: 18px;
	}
    
#analytics-panel ul#sub-panels div.section .find-out h4 {
	font-size: 14px;
	}
    
#analytics-panel ul#sub-panels div.section h4 a {
    text-decoration: none;    
    }
	
#analytics-panel ul#sub-panels div.section ul.row {
	margin-bottom: 40px;
	}

#analytics-panel ul#sub-panels div.section ul.row li {
	float: left;
	margin-left: 16px;
	padding: 20px 20px 20px 10px;
	background: white;
    border-left: 10px solid white;
	}

#analytics-panel ul#sub-panels div.section ul.fix-height li {
    min-height: 260px;
	}
	
#analytics-panel ul#sub-panels div.section ul.fix-height ul li {
    min-height: 1px;
    }
    
#analytics-panel ul#sub-panels div.section ul.row li:first-child {margin-left: 0;}

#analytics-panel ul#sub-panels div.section ul.two li {
	margin-left: 14px;
	width: 413px;
	}
	
#analytics-panel ul#sub-panels div.section ul.three li {
	width: 256px;
	}
	
#analytics-panel ul#sub-panels div.section ul.two-of {
	display: block;
	float: left;
	width: 608px;
	}
    
.chart-med-dash,
.chart-small-dash,
.chart-small,
.chart-large{
    min-height: 120px;
	background: url(../images/interface/ajax-loader.gif) no-repeat 50% 50%;
    }
    
.chart-large {
    min-height: 200px;
    }
	
/* ---------------------------------------------------------------------
// §: Analytics Sub Section Tabs
--------------------------------------------------------------------- */
	
#analytics-panel ul#sub-panels div.section div.tabs ul.menu {
	margin-left: 12px;
	}

#analytics-panel ul#sub-panels div.section div.tabs ul.menu li {
	position: relative;
	z-index: 1;
	display: block;
	float: left;
	margin-left: 10px;
	border-top: 1px solid #a3a3a3;
	width: 138px;
	background: url(../images/interface/tabs.png) repeat-y -552px -50px;
	}
	
#analytics-panel ul#sub-panels div.section div.tabs ul.menu li:first-child {margin-left: 0;}
	
#analytics-panel ul#sub-panels div.section div.tabs ul.menu li:hover,
#analytics-panel ul#sub-panels div.section div.tabs ul.menu li:focus {
	z-index: 3;
	border-color: #8d8d8d;
	background-position: -690px -50px;
	}
	
#analytics-panel ul#sub-panels div.section div.tabs ul.menu li.active {
	z-index: 2000;
	border-color: #e0e0e0;
	background-position: -414px -50px;
	}

#analytics-panel ul#sub-panels div.section div.tabs ul.menu li a {
	display: block;
	padding: 6px 10px;
	text-align: center;
	text-decoration: none;
	min-height: 50px;
	color: #444;
	background: url(../images/interface/tabs.png) no-repeat -138px 100%;
	}
	
#analytics-panel ul#sub-panels div.section div.tabs ul.menu li a:hover,
#analytics-panel ul#sub-panels div.section div.tabs ul.menu li a:focus {background-position: -276px 100%;}
	
#analytics-panel ul#sub-panels div.section div.tabs ul.menu li.active a {background-position: 0 100%;}

/* ---------------------------------------------------------------------
// §: Analytics Sub Section Tabs Content 
--------------------------------------------------------------------- */

#analytics-panel ul#sub-panels div.section div.tabs div.section {
	position: relative;
	z-index: 1000;
	top: -35px;
	margin: 0 auto;
	border-width: 1px;
	padding: 50px 19px 10px 19px;
	width: auto;
	background: white;
	}
	
#analytics-panel ul#sub-panels div.section div.tabs div.section .formatting {
    min-height: 150px;
    }
    
#analytics-panel ul#sub-panels div.section div.tabs div.section ul .formatting {
    min-height: 1px;
    }
    
/* ---------------------------------------------------------------------
// §: Analytics Sub Section Tabs reading level 
--------------------------------------------------------------------- */
 
#analytics-panel ul#sub-panels div.section ul.row li.red {
    border-left: 10px solid #e70101
    }
    
#analytics-panel ul#sub-panels div.section ul.row li.amber {
    border-left: 10px solid #ff8004
    }
    
#analytics-panel ul#sub-panels div.section ul.row li.green {
    border-left: 10px solid #00930e
    }
    
#analytics-panel ul#sub-panels div.section h5 {
    padding: 15px 0 35px 0;
    font-size: 1.05em;
    }
    
#analytics-panel ul#sub-panels div.section h5 strong {
    font-size: 1.8em;
    display: block;
    padding: 0.15em 0;
    }
    
/* ---------------------------------------------------------------------
// §: Analytics Tables
--------------------------------------------------------------------- */

.analytics-table {
    clear: both;    
    }

#analytics-panel ul#sub-panels table {
	margin: 1em 0;
	border: double #999;
	border-width: 3px 0;
	border-collapse: collapse;
	width: 100%;
	empty-cells: show;
    border-right: 0px solid;
	}
	
#analytics-panel ul#sub-panels table thead {background: #eee;}

#analytics-panel ul#sub-panels table thead th {
	border: solid #999;
	border-width: 0 0 1px 1px;
	text-align: left;
	}
	
#analytics-panel ul#sub-panels table thead th:first-child,
#analytics-panel ul#sub-panels table td:first-child {
	border-left: none;
    min-width: 35%;
	}

#analytics-panel ul#sub-panels table#dashboardEntranceKeywordsTable thead th:first-child,
#analytics-panel ul#sub-panels table#dashboardEntranceKeywordsTable td:first-child {
    min-width: 55%;
    }
    
#analytics-panel ul#sub-panels table tbody tr {
	background: #fff	;
	} 
	
#analytics-panel ul#sub-panels table tbody tr:nth-of-type(even) {
	background: #f6f6f6	;
	}
	
#analytics-panel ul#sub-panels table tbody tr:hover,
#analytics-panel ul#sub-panels table tbody tr:focus {
	color: #eee;
	background: #444;
	}
	
#analytics-panel ul#sub-panels table tbody tr:hover a,
#analytics-panel ul#sub-panels table tbody tr:focus a {
	color: #fff;
	}
	
#analytics-panel ul#sub-panels table tbody td {
	border-left: 1px solid #999;
	}
	
#analytics-panel ul#sub-panels table tbody td:last-of-type,
#analytics-panel ul#sub-panels table tbody td.last {
	border-right: none;
	}
	
#analytics-panel ul#sub-panels table th,
#analytics-panel ul#sub-panels table td {
	padding: 8px 12px;
	}
	
#analytics-panel form.choose-rows {
	display: block;
	float: left;
	width: 150px;
	}
	
/* ---------------------------------------------------------------------
// §: Small Dashboard Analytics Tables
--------------------------------------------------------------------- */

#analytics-panel ul#sub-panels ul.row table {
    font-size: 0.9em;
    margin-top: 10px;
    }
    
#analytics-panel ul#sub-panels ul.row table th,
#analytics-panel ul#sub-panels ul.row table td {
	padding: 2px 2px;
    overflow: hidden;
	}
    
#analytics-panel ul#sub-panels ul.row table td {
word-wrap: break-word;    
    }
    
/* ---------------------------------------------------------------------
// §: Tools Panel
--------------------------------------------------------------------- */

#analytics-panel div.tool-panel {
	float: left;
    padding-bottom: 10px;
	}
	
#analytics-panel div.stacked {
    margin-top: 1.1em;
	width: 263px;
	}

#analytics-panel div.tool-panel ul.pagination li {
	display: block;
	float: left;
	border-left: 1px solid #444;
	padding: 0 8px;
	}
	
#analytics-panel div.tool-panel ul.pagination li:first-child {
	border: none;
	padding-left: 0;
	}
	
#analytics-panel div.tool-panel ul.pagination {float: left;}
	
#analytics-panel div.export {float: right;}
#analytics-panel div.export strong {margin-top: 5px;}

#analytics-panel div.export strong,
#analytics-panel div.export ul,
#analytics-panel div.export li {
	display: block;
	float: left;
	margin-left: 10px;
	}

#analytics-panel div.export li.pdf a,
#analytics-panel div.export li.csv a {
	display: block;
    line-height: 1.5em;
    padding-right: 25px;
	height: 25px;
	background: url(../images/icons/pdf.png) no-repeat 100% 0;
    text-decoration: none;
	}
	
#analytics-panel div.export li.csv a {background-image: url(../images/icons/csv.png);}

#analytics-panel div.export li.pdf a:hover,
#analytics-panel div.export li.csv a:hover,
#analytics-panel div.export li.pdf a:focus,
#analytics-panel div.export li.csv a:focus {
    background-position: 100% -25px;
    color: #205885;
    text-decoration: underline;
    }

#analytics-panel div.tool-panel form.date-picker {margin-bottom: 1em;}
#analytics-panel div.tool-panel form.date-picker fieldset {border: none;}

#analytics-panel div.tool-panel form.date-picker label {
	display: block;
	float: left;
	width: 115px;
	}
	
#analytics-panel div.tool-panel form.date-picker label.first-child {width: 140px;}
	
#analytics-panel div.tool-panel form.date-picker input {
	display: block;
	float: left;
	margin-right: 3px;
	width: 67px;
	}

#analytics-panel div.tool-panel form.date-picker strong {
	display: block;
	float: left;
	margin-right: 3px;
	}
	
#analytics-panel div.tool-panel form.date-picker a.ui-datepicker-trigger {
	display: block;
	float: left;
	width: 16px;
	height: 15px;
	text-indent: -1000em;
	background: url(../images/icons/calendar.gif) no-repeat;
	}
	
#analytics-panel div.tool-panel div.graph-manipulation {
	float: right;
	margin: 1em 0 2em 0;
	}

#analytics-panel div.tool-panel div.graph-manipulation strong,
#analytics-panel div.tool-panel div.graph-manipulation ul,
#analytics-panel div.tool-panel div.graph-manipulation li {
	display: block;
	float: left;
	}
	
#analytics-panel div.tool-panel div.graph-manipulation strong {margin: 3px 3px 0 0;}
	
#analytics-panel div.tool-panel div.graph-manipulation li a {
	display: block;
	border: solid black;
	border-width: 1px 1px 1px 0;
	padding: 2px 8px;
	box-shadow: 2px 2px #ccc;
	text-decoration: none;
	background: white;
	}
	
#analytics-panel div.tool-panel div.graph-manipulation li a:hover,
#analytics-panel div.tool-panel div.graph-manipulation li a:focus {
	background: #205885;
	}
	
#analytics-panel div.tool-panel div.graph-manipulation li:first-child a {border-width: 1px;}

#analytics-panel div.tool-panel div.graph-manipulation li.active a {
	color: white;
	background: #666;
	}
        
/*find out more panel*/
li.find-out {
    position: absolute;
    left: 0;
    margin-top: -10px;
    z-index: 10;
    padding: 5px 15px;
    background: #fff;
    border: 5px solid #ddd;
	box-shadow: 0 .1em .5em rgba(0,0,0,.55);    
	display: none;
    }

#analytics-panel ul#sub-panels div.section ul.row li.find-out {
    border: 5px solid #ddd;
    min-height: 1px;
    z-index: 1000;
    padding: 10px;
    }

#analytics-panel ul#sub-panels div.section ul.row li.first-child {
    margin-left: 0;
    }
    
#analytics-panel ul#sub-panels div.section li.large-find-out-more {
    margin-left: 15px;
    }
    
li li div.find-out {
    left: -10px;
    }
    
li.find-out p {
    padding: 5px 0;
    }
    
#analytics-panel ul#sub-panels div.section li.find-out h5 {
    padding: 5px 0;
    }
    
#analytics-panel ul#sub-panels div.section li.find-out h5 a {
    float: right;
    font-size: 0.7em;
    margin-left: 20px;
    }
    
#analytics-panel ul#sub-panels div.section li.find-out ul {
    list-style: disc outside none;
    margin-left: 15px;
    }
    
#analytics-panel ul#sub-panels div.section li.find-out ul li {
    float: none;
    margin: 0;
    padding: 2px 0 2px 5px;
    background: none;
    border: none;
    width: auto;
    list-style-type: circle
    }
    
.find-out-more {
    position: relative;    
    }
    
.find-out-more .find-out {
    margin-top: 10px;   
    }
       
#analytics-panel ul#sub-panels div.section .read-more ul{
    list-style: circle;    
    }
	
/* Analytics opening/closing */
#analytics-opener {
    position: absolute;
    top: 5px;
    right: 200px;
    z-index: 100;    
    border-color: #ADC97B #396101 #396101 #ADC97B;
    border-style: solid;
    border-width: 1px;
    color: #fff;
    font-size: 0.8em;
    padding: 1px 6px;
    cursor: pointer;
	}
	
#analytics-closer {
	float: right;
    cursor: pointer;
	}
    
body .mgnlMainbar {
    z-index: 10;    
    }
    
#ui-datepicker-div {
    z-index: 100001 !important;    
    }