/* ------------------------------------------------------------ *\
	Top 10 Operators
\* ------------------------------------------------------------ */

.top10-operators {
	margin-bottom: 50px; 
	margin-top: 50px;
}

.top10-operators .top10-operators-head {
	position: relative; 
}

.top10-operators .top10-operators-head h2 {
	position: relative; 
	font-weight: 400; 
	padding: 0 45px 5px 0; 
	margin-top: 0; 
}

.top10-operators .top10-operators-head h2:after {
	content: '';
	position: absolute; 
	right: 0; 
	top: 0; 
	display: inline-block; 
	width: 30px; 
	height: 30px; 
	background: rgba(255, 255, 255, .35); 
	border-radius: 4px;
}

.top10-operators .top10-operators-head h2 span {
	font-weight: 700; 
}

.top10-operators .top10-operators-head i {
	position: absolute; 
	right: 3px; 
	top: 4px; 
	transition: .3s;
}

.top10-operators .dropdown-content > .active {
	display: flex; 
}

@media ( min-width: 768px ) {
	.top10-operators .top10-operators-head h2 br {
		display: none; 
	}
	.top10-operators .top10-operators-head h2:after {
		top: -1px;
	}

	.top10-operators .top10-operators-head i {
		top: 3px; 
	}

	.top10-operators .dropdown.open h2 i {
		top: 0px; 
	}
	.top10-operators .top10-operators-select:after {
		top: -4px; 
	}

	.top10-operators .dropdown-menu {
		margin-top: -3px; 
	}
}

@media ( min-width: 992px ) {
	.top10-operators {
		/*margin-bottom: 200px; */
	}
}

/* ------------------------------------------------------------ *\
	Top10 Operators Box
\* ------------------------------------------------------------ */

.top10-operators-boxes {
	display: none; 
	flex-wrap: nowrap;
	overflow-x: auto;
	justify-content: space-between;
	margin: 0 -15px; 
}

.top10-operators-boxes.active {
	display: flex; 
}

.top10-operators-box {
	width: 70px; 
	flex: 1 0 70px;
	/* max-width: 70px; */
	color: #fff; 
	text-align: center; 
	/*max-width: 	calc(10% - 13px);*/
}


.top10-operators-box + .top10-operators-box {
	margin-left: 13px; 
}

.top10-operators-box:first-child {
	margin-left: 15px; 
}

.top10-operators-boxes .top10-operators-box:last-child {
	padding-right: 15px; 
	flex: 1 0 85px; 
	width: 85px; 
	/* max-width: 85px; */
}

.top10-operators-box .top10-operators-box-num {
	display: inline-block; 
	vertical-align: middle; 
	width: 36px; 
	height: 36px; 
	border-radius: 50%;
	line-height: 36px; 
	border: 1px solid rgba(255, 255, 255, .5);
	text-align: center; 
	margin-bottom: 10px; 
}

.top10-operators-box .top10-operators-box-body {
	margin-bottom: 2px; 
	min-height: 174px; 
	padding: 10px; 
	border-radius: 10px 10px 0 0;
	background: #00153e; 
}

.top10-operators-box .top10-operators-box-logo {
	width: 100px;
	height: 50px; 
	line-height: 50px; 
	-webkit-transform: translate(50%, 100%) rotate(-90deg); /* Safari */
	-moz-transform: translate(50%, 100%) rotate(-90deg); /* Firefox 3.6 Firefox 4 */
	/*-moz-transform-origin: right top; */
	-ms-transform: translate(50%, 100%) rotate(-90deg); /* IE9 */
	-o-transform: translate(50%, 100%) rotate(-90deg); /* Opera */
	transform: translate(50%, 100%) rotate(-90deg); /* W3C */  
	-webkit-transform-origin: left bottom;
	-moz-transform-origin: left bottom;
	-ms-transform-origin: left bottom;
	-o-transform-origin: left bottom;
	transform-origin: left bottom;
	display: block; 
}

.top10-operators-box-logo img {
	vertical-align: baseline;
}

.top10-operators-box .top10-operators-box-footer {
	min-height: 40px; 
	padding: 10px;
	border-radius: 0 0 10px 10px; 
	background: #00153e; 
}

.top10-operators-box .top10-operators-box-footer i {
	font-size: 14px; 
	margin-right: 5px; 
}

@media ( min-width: 768px ) {
	.top10-operators-boxes {
		margin: 0; 
	}

	.top10-operators-box:first-child {
		margin-left: 0; 
	}

	.top10-operators-boxes .top10-operators-box:last-child {
		padding-right: 0; 
		flex: 1 0 70px;
		/* max-width: 70px;  */
		width: 70px; 
	}

	.top10-operators .top10-operators-head h2 {
		display: inline-block; 
	}

	.top10-operators .top10-operators-head h2 br {
		display: none; 
	}

	.top10-operators .dropdown {
		display: inline-block; 
	}
}

@media ( min-width: 992px ) {
	.top10-operators-box .top10-operators-box-logo {
		width: 116px;
		height: 54px;
		line-height: 54px; 
	}
	.top10-operators-box {
		max-width: 	calc(10% - 13px);
	}
}

@media ( min-width: 1200px ) {
	.top10-operators-boxes .top10-operators-box:last-child {
		padding-right: 0; 
		flex: 1 0 70px;
		/* max-width: 70px; */
		width: 70px; 
	}

	.top10-operators-box .top10-operators-box-logo {
		line-height: 69px; 
		margin-left: 8px;
	}
}
