
.#{$alias} {

	.#{$alias}-gAnalytics-box-statistics {
		.#{$alias}-panel-content {
			table {
				th {
					background: $white;
					border: 0;
					border-bottom: 1px solid #f4f4f4;
					color: #646464;
					font-weight: $medium;
					font-size: px(12); 
					text-align: center;
					&:first-child {
						padding-left: px(15) !important;
						text-align: left !important;
					}
				}
				td {
					border: 0;
					&:only-child {
						background: $white;
					}
					&:first-child {
						padding-left: px(15) !important;
						text-align: left !important;
					}
				}
			}
		}
	}
	
	.#{$alias}-audience-graph {
		.legend {
			table {
				font-size: px(13) !important;
				
				tr {
					padding: px(0);
					td {
						padding: px(5) 0;
					}
					td.legendColorBox {
						padding-right: px(10);
						&>div {
							border: none !important;
							padding: 0 px(5) !important;
							&>div {
								width: px(25) !important;
							}
						}
					}
				}
			}
		}
	}


	.#{$alias}-section-Google_Analytics {
		.#{$alias}-saveOptions,
		.#{$alias}-google-authorize-app {
			margin-left: 0;
			cursor: pointer;
		}
		.#{$alias}-message {
			ul {
			    display: block;
			    background: #EEEEEE;
			    border-radius: 0.5rem;
			    border: solid 0.1rem #e5e5e5;
			    line-height: 3.5;
			    margin: px(40) 0;
			    padding: px(10) px(25);
			}
		}
	}

	.#{$alias}-gAnalytics-box-statistics.col-lg-3 {
		width:33.33333%;
	}

	.#{$alias}-gAnalytics-box-statistics.smaller-width {
		width:24.9%;
	}

	

	##{$alias}-gAnalytics-wrapper {
		label {
			margin-bottom: 0;
		}
		##{$alias}-audience-visits-graph {
			height: px(300);
			overflow: hidden;
		}
		.#{$alias}-audience-container {
			padding: px(10);
			h2 {
				margin: 0 0 px(15) 0;
				font-weight: normal;
			}
		}
		#audience-choose-container {
			overflow: hidden;
			margin: px(25) 0 px(37) 0;
			div {
				display: inline-block;
				width: 13.3%;
				margin: 0 0 0 px(5);
				padding-right: px(8);
				font-size: px(12);
				input {
					margin: 0 px(4) 0 0;
				}
				label {
					font-weight: normal !important;
				}
				&:first-child {
					border: 0;
					padding-right: 0;
				}
			}
		}
		.#{$alias}-ga-summary-stat {
			overflow: hidden;
			margin: px(10) 0 0;
			padding: px(20) 0 0;
		}
		.#{$alias}-ga-summary-block {
			float: left;
		    margin: 0 0 1.5rem 0;
		    padding: px(22);
		    margin-left: 15px;
		    background: #f6f6f6;
		    border-right: 0;
		    width: 23%;
		    border-radius: px(3);
		    min-height: 4rem;
		    &:hover {
		    	.#{$alias}-ga-summery-desc {
		    		display: block;
		    	}
		    }
		    &:first-child,
		    &:nth-child(5) {
		    	margin-left: 0 !important;
		    }
		    &:first-child {
		    	span {
		    		color: #4abbf5;
		    	}
		    }
		    &:nth-child(2) {
		    	span {
		    		color: #c90dac;
		    	}
		    }
		    &:nth-child(3) {
		    	span {
		    		color: #f03a3a;
		    	}
		    }
		    &:nth-child(4) {
		    	span {
		    		color: #0ca67c;
		    	}
		    }
		    &:nth-child(5) {
		    	span {
		    		color: #68c64b;
		    	}
		    }
		    &:nth-child(6) {
		    	span {
		    		color: #4abbf5;
		    	}
		    }
		    &:nth-child(7) {
		    	span {
		    		color: #954bb3;
		    	}
		    }
		    
			.#{$alias}-ga-summery-title {
				font-size: px(14);
				width: 100%;
				text-align: center;
				span {
					font-weight: bold;
				}
			}
			.#{$alias}-ga-summery-desc {
				border-radius: 0.5rem;
				font-size: px(12);
				background: #484848;
				color: $white;
				opacity: 0.9;
				display: none;
				position: absolute;
				padding: px(25);
				a {
					color: $orange;
				}
			}
		}
		.#{$alias}-ga-filter {
			position: relative;
			padding-top: px(3);
			padding-bottom: px(3);
			height: px(25);
		}
		.#{$alias}-top-filters {
			float: right;
			margin-top: -8px;
			##{$alias}-filter-by-date {
				width: 455px;
				label {
					bottom: -9px;
					color: #727272;
					display: block;
					float: left;
					font-size: 14px;
					font-weight: $medium;
					margin: 0 13px 0 -10px;
					position: relative;
				}
				input[type=text] {
					color: #c4c4c4;
					font-size: 14px;
					float: left;
					margin: 0 px(22) 0 0;
					padding: 7px 12px 6px;
					width: px(120);
				}
			}
		}
		.#{$alias}-demographics-container table {
			border-collapse: collapse;
			border-spacing: 0;

		}
		.#{$alias}-system-container table {
			border-collapse: collapse;
			border-spacing: 0;
		}
		.#{$alias}-mobile-container table {
			border-collapse: collapse;
			border-spacing: 0;
		}
	}
	
	.#{$alias}-gAnalytics-box-statistics {
		 
		
		.#{$alias}-panel-heading {
			padding: 24px 24px 0 24px;
			h2 {
				margin-bottom: px(24) !important;
			}
		}
		.#{$alias}-panel-body {
			border-top: none;
			padding: px(24);
		}
		
		.#{$alias}-sub-headline-f1 {
			color: #9966ff;
		}
		.#{$alias}-table {  
			border-radius: 10px;
			border: 1px solid #f4f4f4;
			tr:first-of-type {
				th {
					background: #fafafa;
					padding-top: 15px;
				}
			}

			th {
				padding-top: px(2);
			}
			th, td {
				text-align: left;
				line-height: 2;
				height: auto;
				font-weight: normal;
			}
		}
	}

	.#{$alias}-content {
		.#{$alias}-main {
			.#{$alias}-pageviews-graph {
				padding: 16px 17px;
			}
			.panel {
				.panel-heading {
					h2 {
						display: inline-block;
						font-weight: $medium;
						font-size: px(18);
						color: $black;
						line-height: px(18);
						padding-left: 4px;
					}
					select.#{$alias}-ga-filter {
						width: 100%;
						display: block;
						padding: 0 0 0 px(12);
						height: px(40);
						font-weight: $normal;
						color: $black;
						font-size: px(14);
						border-radius: px(3);
					}
				}
			}
		}
	}
	#psp-filter-graph-data {
		background: #f64444;
		color: #ffffff;
		font-size: 13px;
		font-weight: $medium;
		padding: 7px 22px 8px !important;
		text-transform: capitalize;
		&:hover {
			background: #ff9f40;
		}
	}
	.#{$alias}-topchannels-graph {
		//height: 420px !important;
	}
	#psp-gAnalytics-wrapper {
		.row {
			margin-left: -30px;
			margin-right: -30px;
		}
	}
	.psp-getReferral-container .psp-table a {
		color: #999999;
		
		span {
			display: block;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			max-width: 300px;
		}

		&:hover {
			color: #9966ff;
		}
	}
	.psp-table-big {
 		tr:nth-child(even) {
 			background: #fafafa;
 		}
		td {
			border: 1px solid #f4f4f4 !important;
		}
		tbody tr:first-child td {
			background-color: #fff;
			padding-top: 10px;
			padding-bottom: 10px;
			font-size: 15px;
			font-weight: bold;
		}

		tbody td:not(:first-child) {
			text-align: center;
			color: #999999;
		}
		.psp-table-row-page > span:first-child {
			display: inline-block;
			width: 25px;
		}

		.psp-table-row-page a {
			display: inline-block;
			color:#999999;
			&:hover {
				color:#9966ff;
			}
			span {
				display: none;
			}
			& span:first-child {
				display: block;
			}
		}
		th a {
			padding: 5px 10px;
			color: #646464;
			font-size: 14px;
			text-transform: none;
			border-radius: 3px;
			
			&:hover {
				background-color: #ff9f40;
				color: #fff;
			}
			&.on {
				color: #fff;
				background-color: #ff9f40;
			}
		}

		tr.psp-allow-paging {
			display: none;

			&.is_show {
				display: table-row;
			}
		}
	}

	.psp-contentPages-container,
	.psp-getReferral-container {

		.tablenav {
			display: block;

			.displaying-num {
				width: 70px;
				display: inline-block;
			}

			.tablenav-pages {
				float: none;
				height: auto;
				display: inline-block;
			}
		}
	}

	.psp-filters-labels {
		margin-top: 30px;

		h2 {
			font-size: 12px !important;
			text-transform: uppercase;
			margin-bottom: 5px !important;
			padding-bottom: 0;
		}

		.psp-filters-labels-wrapper {

			.psp-custom-checkbox {
				display: inline-block;
				margin-right: 4px;
				vertical-align: middle;
			}
			.psp-check-filter {
				display: inline-block;
				padding-right: 15px;

				i {
					position: relative;
				}
				span {
					vertical-align: middle;
					display: inline-block;
				}
			}
		}
	}

	##{$alias}-clear-cache {
		position: absolute;
	    bottom: 0;
	    right: 0px;
	    background-color: #ff9f3f;
	    color: #fff;
	    border: 0;
	    border-bottom-right-radius: 4px;

	    &:hover {
	    	background-color: #d35400;
	    }
	}
}