@import '../default.less';
@import '../mixins.less';
//DON'T ADD IMPORTS, ABOVE ARE TO MAKE INTELLISENSE WORK

#tranking-container
{
	height: 550px;
	margin-bottom: 5px;

	tr
	{
		line-height: 17px;
	}

	&.gadget-container
	{
		position: relative;

		.premium-helper
		{
			position: absolute;
			left: 0;
			right: 0;
			top: 0;
			bottom: 20px;
			z-index: 2;
		}
	}
}

div#atlas
{
	div.section
	{
		&.top-bottom
		{
			width: 40%;
			height: 680px;
			float: right;

			html[dir='rtl'] &
			{
				float: left;
			}

			& > div
			{
				height: 300px;
				width: 100%;
				overflow: hidden;
			}

			& > h5
			{
				width: 100%;
				padding-left: 20px;
				text-align: center;
			}
		}

		&.table
		{
			float: left;
			width: 59%;
			height: 600px;

			html[dir='rtl'] &
			{
				float: right;
			}
		}

		&.ranking
		{
			width: 40%;
			height: 600px;
			float: right;
			margin-left: 1%;

			html[dir='rtl'] &
			{
				float: left;
				.margin-left-right(0%, 1%);
			}
		}

		margin-bottom: 10px;
	}

	& > div > table#pivot-table thead th
	{
		color: black;
	}

	&.premium
	{
		.ranking-div table
		{
			tbody tr:nth-child(2n + 1)
			{
				background-color: #f7f7f7;
			}

			th.active-column,
			td.active-column
			{
				background-color: #e9e9e9;
			}
		}
	}
}