/*temp multi comp*/
/*comparison*/

/* min 
	576
	768
	992
	1200
*/

#vcx-multi-comparison{
	display: none;
}

.vcx-comparison .container{
	padding:0;
}

.vcx-comparison__table{
	font-size: .8em;
}

.vcx-comparison__table .table__cell{
	position: relative;
}

@media screen and (min-width: 768px) {
    
	.vcx-comparison__table{
		font-size: 1em;
	}
 
}

.vcx-comparison > section:nth-child(2){
	background: #2d2d2d;
	color: #fff;
}

.vcx-comparison__table .table__cell:first-child{
	font-size: 80%;
}

.vcx-comparison__table .table__head{
	position: sticky;
	top:0;
	z-index: 1;
}

.vcx-comparison__table .table__head-wrap{
	background-color: #fff;
	z-index: 1;
}


@media screen and (max-width: 991px) {
    
	.vcx-comparison__table .table__head-wrap > .table__row:first-child{
		align-items: flex-end;
	}
 
}

.vcx-comparison__table .table__head-wrap img{
	max-height: 3em;
}

@media screen and (max-width: 575px) {
   
	.vcx-comparison__table .table__head-wrap img{
		display: block;
		margin: 0 auto;
	}

}

.vcx-comparison__table .table__head-wrap,
.vcx-comparison__table > .table__body{
	padding: .25em .5em .5em .5em;
}

@media screen and (min-width: 768px) {
    
	.vcx-comparison__table .table__head-wrap,
	.vcx-comparison__table > .table__body{
		padding: .25em 2em .5em 2em;
	}
 
}

@media screen and (max-width: 767px) {
    
	.vcx-comparison__table > .table__body--images{
		display: none;
	}
 
}

.vcx-comparison__table .table__head.-sticking:before{
	content: "";
	position: absolute;
	z-index: -1;
	-webkit-box-shadow: 0 0 1em rgb(0 0 0 / 20%);
	box-shadow: 0 0 1em rgb(0 0 0 / 20%);
	bottom: 0;
	width: 80%;
	height: 10%;
	-moz-border-radius: 100%;
	border-radius: 100%;
	left: 15%;
	right: 5%;
}

.vcx-comparison__table .vcx-comparison__score{
	font-size: 2em;
}
.vcx-comparison__table .vcx-comparison__rating{
	margin-top: -.5em;
}

.vcx-comparison__table > .table__body--scores{
	margin-top: 1em;
	margin-bottom: 1.5em;
	background-color: #fafafa;
}

.vcx-comparison__table  .table__body--scores .table__body:first-child > .table__row{
	font-size: 1.5em;
}

.vcx-comparison__table > .table__body--scores > .table__body:not(:first-child) > .table__row:first-child{
	font-size: 1.25em;
}

.vcx-comparison__table > .table__body--scores > .table__body > .table__row .table__cell:first-child:before{
	content: "";
	display: inline-block;
	height: .9em;
	width: .9em;
	margin-right: .25em;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}


.vcx-comparison__table #vcx_comparison_main_scores .table__body:first-child .table__row .table__cell:first-child:before{
	background-image: url(/vcx/phonecam-2025/frontend/images/camera_main.svg);
	height:1.2em;
	width:1.2em;
	vertical-align: text-bottom;
}
.vcx-comparison__table #vcx_comparison_selfie_scores .table__body:first-child .table__row .table__cell:first-child:before{
	background-image: url(/vcx/phonecam-2025/frontend/images/camera_selfie.svg);
	height:1.2em;
	width:1.2em;
	vertical-align: text-bottom;
}
.vcx-comparison__table #vcx_comparison_main-performance_scores .table__body:first-child .table__row .table__cell:first-child:before{
	background-image: url(/vcx/phonecam-2025/frontend/images/camera_main_performance.svg);
	height:1.2em;
	width:1.2em;
	vertical-align: text-bottom;
}

.vcx-comparison__table .table__cell[data-title="Main - Image Quality"]:before{
	background-image: url(/vcx/v2020/frontend/images/score_image-quality.svg);
}

.vcx-comparison__table .table__cell[data-title="Main - Video"]:before{
	background-image: url(/vcx/v2020/frontend/images/score_video.svg);
}

.vcx-comparison__table .table__cell[data-title="Main - Performance"]:before{
	background-image: url(/vcx/v2020/frontend/images/score_performance.svg);
}

.vcx-comparison__table .table__cell[data-title="Main - Performance - Timing"]:before{
	background-image: url(/vcx/v2020/frontend/images/score_timing.svg);
}

.vcx-comparison__table .table__cell[data-title="Main - Performance - Stabilization"]:before{
	background-image: url(/vcx/v2020/frontend/images/score_stabilization.svg);
}

.vcx-comparison__table .table__cell[data-title="Main - Image Quality - Bright - NoZoom"]:before, 
.vcx-comparison__table .table__cell[data-title="Main - Video - Bright"]:before, 
.vcx-comparison__table .table__cell[data-title="Selfie - Bright"]:before{
	background-image: url(/vcx/v2020/frontend/images/score_sunny.svg);
}

.vcx-comparison__table .table__cell[data-title="Main - Image Quality - Medium - NoZoom"]:before,
.vcx-comparison__table .table__cell[data-title="Main - Video - Medium"]:before, 
.vcx-comparison__table .table__cell[data-title="Selfie - Medium"]:before {
	background-image: url(/vcx/v2020/frontend/images/score_indoor.svg);
}

.vcx-comparison__table .table__cell[data-title="Main - Image Quality - Low - NoZoom"]:before,
.vcx-comparison__table .table__cell[data-title="Main - Video - Low"]:before, 
.vcx-comparison__table .table__cell[data-title="Selfie - Low"]:before {
	background-image: url(/vcx/v2020/frontend/images/score_night.svg);
}



.vcx-comparison__table > .table__body > .table__body:not(:first-child){
	padding: .25em 0 .75em 0;
	margin: .5em 0;
	background-color: #f5f5f5;
}

.vcx-comparison__table .table__body--scores .table__row:first-child{
	margin:.5em 0;
}

.vcx-comparison__table > .table__body--details{
	margin-bottom: 1.5em;
	background-color: #fafafa;
}


.vcx-comparison__table .table__row .table__cell:first-child{
	text-align: right;
	flex:2;
}

@media screen and (min-width: 992px) {
    
	.vcx-comparison__table .table__row .table__cell:first-child{
		flex:1;
	}
 
}

.vcx-comparison__table .table__row .table__cell:not(first-child){
	text-align: center;
}


#rating-details-toggle{
	width: auto;
	margin: 1em auto;
	font-weight: bold;
}

.vcx-comparison h2,
.vcx-comparison h3{
	margin-top: 3em;
	margin-bottom: 1.5em;
}

.vcx-comparison__table .table__body--images .table__cell.-loading .vcx-comparison-device__image-wrap{
	opacity: 0;
}

.vcx-comparison__table .table__body--images .table__cell.-inactive .vcx-loader{
	display: none;
}

.vcx-comparison-device__image-wrap{
	transition: all 1s;
}

.vcx-comparison-device__image{
	height: 10vw;
	max-height: 25vh;
	max-width: 200px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 2em;
}

.vcx-comparison-device__image img{
	max-height:100%;
	max-width: 100%;
}

.vcx-comparison-device__image-caption{
	font-size:.6em;
	margin-top: 0;
}

.vcx-comparison__device-wrap{
	display: flex;
	justify-content: center;
	align-items: center;
}

.vcx-comparison__device-name{
	display: flex;
	flex-direction: column;
	padding: 1em .5em;
}

@media screen and (max-width: 991px) {
    
	.vcx-comparison__device-name{
		line-height: 1.1em;
		writing-mode: vertical-rl;
		transform: rotate(180deg);
		align-items: flex-start;
	}
 
}

.vcx-comparison__device-name span:last-child{
	font-weight: bolder;
}

.vcx-comparison__table .vcx-comparison__score{
	font-size: 2em;
}

.vcx-comparison__table .vcx-comparison__rating{
	margin-top: -.5em;
	display:none;
}

.vcx-comparison__device-name span:last-child{
	font-weight: bolder;
}

/*ranking*/

#vcx-ranking.-loading .vcx-ranking{
	opacity: 0;
}

.vcx-ranking__compare{
	margin-right: -.5em;
	align-self: stretch;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 3;
	cursor:pointer;
}

.vcx-ranking__compare span{
	position: relative;
	height: 1em;
	width: 1em;
	display: block;
	border: 1px solid #000;
	opacity: .2;
	transition: all .25s;
}

.vcx-ranking__compare.-checked span{
	opacity: 1;
}
.vcx-ranking__compare.-checked span:before{
	font-family: Font Awesome\ 5 Pro;
	content: "\f00c";
	position: absolute;
	font-size: .75em;
	left: .1em;
	font-weight: 800;
	top: -.1em;
}
.vcx-ranking__compare:hover span{
	border: 1px solid #eb912d;
}

.vcx-ranking__compare:hover span:before{
	color: #eb912d;
}

.vcx-ranking__table .table__row:hover .vcx-ranking__compare span{
	opacity: 1;
}


#compare-open,
#compare-close{
	position: sticky;
	display: block;
	bottom: 2em;
	margin:0 auto;
	z-index: 4;
}


#compare-open.--inactive{
	background-color:#888;
	padding-right: 1em;
	cursor:not-allowed;
}

#compare-open.--inactive > span:first-child{
	margin-right: 1em;
}

#compare-open > span:first-child{
	padding: .1em .25em; 
}

#compare-open > span span:last-child{
	font-size: .7em;
}

#compare-close{
	border:1px solid #555;
	background-color: #333;
}

/**/


.table__row{
	display:flex;
	align-items: center;
}

.table__cell{
	flex:1;
}

.vcx-ranking{
	min-height:50vh;
	user-select: none;
	transition: all .2s;
}

.vcx-ranking__wrap{
  	margin:0 auto;
  	max-width:780px;
  
  	-webkit-overflow-scrolling: touch;
  
  	background: radial-gradient(farthest-side at 0% 50%, rgba(0,0,0,.2), rgba(0,0,0,0)), radial-gradient(farthest-side at 100% 50%, rgba(0,0,0,.2), rgba(0,0,0,0)) 100% 0;
	background-color: white;
	background-repeat: no-repeat;
	background-size: 10px 100%;
  
}


@media screen and (max-width: 991px) {

	.vcx-ranking__wrap{
		overflow:auto;
	}

}

/*=== LEGEND ===*/

.vcx-ranking__legend-wrap{
	max-width: 550px;
    margin: 0 auto;
}

.vcx-ranking__legend{
	margin: 2em 0;
    text-align: center;
    font-size: .6em;
}

.vcx-ranking__legend span{
	margin-right:1em;
  	white-space: nowrap;
	vertical-align:middle;
}

.vcx-ranking__legend span i{
	font-size: .6em;
  	vertical-align: middle;
}

.vcx-ranking__legend-toggle{
  	margin-bottom: 1em;
    cursor: pointer;
    font-size: .8em;
    display: flex;
    justify-content: center;
}

.vcx-ranking__legend-toggle:before{
	content:"\f036";
	font-family: "Font Awesome\ 5 Pro";
	font-weight: 400;
	line-height: 1.5em;
	vertical-align: middle;
}

.vcx-ranking__legend-toggle:after{
	content:"99";
	font-size: 1.25em;
	line-height: 1.25em;
	vertical-align: middle;
	transform: translateY(-.15em);
}

.vcx-ranking__legend-toggle i{
	font-size: 1.5em !important;
  	color: #eb912d;
	margin: 0 .25em;
}

.vcx-ranking--visual .vcx-ranking__legend-toggle i{
	transform: rotate(180deg);
}

/*
.vcx-ranking:not(.vcx-ranking--visual) .vcx-ranking__table .table__head .table__row .table__cell:nth-child(4) > span:first-child,
.vcx-ranking--visual .vcx-ranking__table .table__head .table__row .table__cell:nth-child(4) > span:nth-child(2),
.vcx-ranking:not(.vcx-ranking--visual) .vcx-ranking__table .table__body .table__row .table__cell:nth-child(3) > div:first-child,
.vcx-ranking--visual .vcx-ranking__table .table__body .table__row .table__cell:nth-child(3) > div:nth-child(2){
	display:none;
}*/

/*=== TABLE ===*/

.vcx-ranking__table{
	min-width: 40em;
	background: linear-gradient(to right, white 30%, rgba(255,255,255,0)), linear-gradient(to left, white 30%, rgba(255,255,255,0)) 100% 0;
	background-size: 50px 100%;
	background-repeat: no-repeat;
}

.vcx-ranking__table .table__head{
	font-weight: bold;
	height:4em;
	font-size:.8em;
	padding: 0 .75em;
	position:relative;
}


@media screen and (min-width: 992px) {

	.vcx-ranking__table .table__head{
		position: sticky;
		top:0;
		z-index: 1;
		background-color:#fff;
	}

}

.vcx-ranking__table .table__head .table__row{
 	display:flex;
	height:4em;
}

.vcx-ranking__table .table__head .table__row.affix{
	top:0;
	width:536px;
	background-color:#fff;
	z-index:2;
 	box-shadow: 0 5px 5px -5px rgba(0,0,0,.2);
	
}

.vcx-ranking__table .table__head .table__cell{
	text-align: center;
	align-self: stretch;
  	display: flex;
  	align-items: center;
}

.vcx-ranking__table .table__head .table__row .table__cell{
	flex:1;
}

.vcx-ranking__table .table__head .table__cell:nth-child(2){
	padding-left:.6em;
}

.vcx-ranking__table .table__head .table__cell:nth-child(n+4){
  justify-content: center;
}

.vcx-ranking__table .table__head .table__cell:not(.colSearch):hover{
	cursor:pointer;
}

.vcx-ranking__table .table__head .table__cell:not(.colSearch):hover, 
.vcx-ranking__table .table__head .table__cell.active {
  color: #eb912d;
}



@media screen and (max-width: 991px) {
    
	.vcx-ranking__table .table__head{
	  padding-right:17px;
	}
 
	.vcx-ranking__table .table__head .table__row.affix{
		position:static !important;
		width:auto;
	}
 
}

@media screen and (max-width: 1199px) {
	.vcx-ranking__table .table__head .table__row.affix{
		width:100%;
		padding-right:2.5em;
	}
}



.vcx-ranking__table .table__body{
	padding: .5em;
}

.vcx-ranking__table .table__body .table__row{
	display:flex;
	position: relative;
	transition: all .1s;
	z-index: 0;
}

.vcx-ranking__table .table__body .table__row:hover{
	box-shadow: 0 0 1px 2px #cecece;
}

.vcx-ranking__table .table__body .table__row:hover .table__cell:not(.vcx-ranking__compare){
	color: #eb912d;
	transition: all .2s;
	z-index: 1;
}

.vcx-ranking__table .table__body .table__row:nth-child(even){
	background: rgba(0,0,0,.03);
}


.vcx-ranking__table .table__body .table__row .table__cell{
	flex: 1;
	text-align:center;
}

.vcx-ranking__table .table__body .table__row .table__cell:nth-child(2){
	text-align:left;
}
	 
.vcx-ranking__table .table__body .table__row .table__cell:not(nth-child(2)){
	justify-content:center;
}

.vcx-ranking__table .table__body .table__row .table__cell:nth-child(2) a{
	position: absolute;
	height:100%;
	width:100%;
	left: 0;
	display: block;
	z-index: 2;
}

.vcx-ranking__table .table__body .table__row .table__cell:nth-child(2) span{
	font-weight: 400;
	padding: .5em 0;
	padding-left: .6em;
	width: 100%;
	min-width: 18em;
	display: inline-block;
}

.vcx-ranking__table .table__body .table__row .table__cell:nth-child(2) span:after{
  font-family: "Font Awesome\ 5 Pro";
  content: "\f036";
  font-size: .8em;
  margin-left: 1.3em;
  margin-top: -.2em;
  opacity: 0;
  color: #eb912d;
  vertical-align: middle;
  transition: all 200ms;
  display: inline-block;
}


.vcx-ranking__table .table__body .table__row:hover .table__cell:nth-child(2) span:after{
  margin-left: .3em;
  opacity: 1;
  transition: all 700ms;
}

.vcx-ranking__table .table__body .score--visual{
	display:flex;
	justify-content: center;
	vertical-align:middle;
	font-size: .8em;
}

.vcx-ranking__table .table__body .score--numeric{
	margin:0 .5em;
	vertical-align:middle;
}



@media screen and (max-width: 991px) {
 
	.vcx-ranking__table .table__body{
	  max-height: 55vh;
	  overflow: auto;
	}

}


/*=== SEARCH ===*/

.vcx-ranking__search{
	position:relative;
	height: 3em;
	display: flex;
	align-items: center;
	font-weight: normal;
	
}

.vcx-ranking__search i{
	position:absolute;
	left:.5em;
}

.vcx-ranking__search.active i{
	color: #eb912d;
	font-weight:400;
}

input.vcx-ranking__search-input{
	position: relative;
	max-width: 10em;
    padding: 0 0 0 2em;
    font-size: 1em;
	cursor:text;
}

input.vcx-ranking__search-input,
input.vcx-ranking__search-input:focus{
	border: none;
	box-shadow: none;
	outline: transparent;
	border-color:transparent;
	background-color:transparent;
}

input.vcx-ranking__search-input:empty:not(:focus):before{
  	content:attr(data-text)
}

input.vcx-ranking__search-input:after{
	content:"";
	width:100%;
	height:1px;
	position:absolute;
	left:0;
	bottom:0;
	background-color:#000;
}

.vcx-ranking__search.active input.vcx-ranking__search-input{
	font-weight:700;
	color: #eb912d;
}

.vcx-ranking__search-btn-empty{
	border:none;
	background-color:transparent;
	display:none;
}

.vcx-ranking__search.active .vcx-ranking__search-btn-empty{
	display:inline-block;
}

.vcx-ranking__search-btn-empty:after{
	font-family: "Font Awesome\ 5 Pro";
  	content: "\f00d";
	font-weight:100;
}

/* phonecam v2025 specific */

/* ranking table head */

.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell:nth-child(1){
	flex:.08;
}

.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell:nth-child(2){
	flex:0.25;
}

.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell:nth-child(3){
	text-align:left;
	flex:0.9;
}

.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell:nth-child(4){
	flex:.4;
	display: flex;
	justify-content: center;
}

.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell:nth-child(5),
.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell:nth-child(6),
.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell:nth-child(7){
	flex:.285;
	font-size:1.4em;
	
}

.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell:nth-child(5) span,
.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell:nth-child(6) span,
.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell:nth-child(7) span{
	font-size:.6em;
	margin-left:.25em;
}
.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell:nth-child(4):before,
.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell:nth-child(5):before,
.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell:nth-child(6):before,
.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell:nth-child(7):before{
	content: "";
	height: 100%;
    width: 1.25em;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center; 
}

.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__cell[data-col="VCX"]:before{ 
    width: 3em !important;  
	background-image: url(/vcx/phonecam-2025/frontend/images/vcx_logo.png);
}

.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__cell[data-col="Main"]:before{   
	background-image: url(/vcx/phonecam-2025/frontend/images/camera_main.svg);
}

.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__cell[data-col="Selfie"]:before{   
	background-image: url(/vcx/phonecam-2025/frontend/images/camera_selfie.svg);
}

.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__cell[data-col="Performance"]:before{   
	background-image: url(/vcx/phonecam-2025/frontend/images/camera_main_performance.svg);
}

/* ranking table body */


.vcx-ranking--v2025 .vcx-ranking__table .table__body .table__row .table__cell:first-child{
	flex: .1;
}

.vcx-ranking--v2025 .vcx-ranking__table .table__body .table__row .table__cell:nth-child(2){
	flex: 1;
	overflow-x: hidden;
}

.vcx-ranking--v2025 .vcx-ranking__table .table__body .table__row .table__cell:nth-child(2) span{
	overflow-x: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
}

.vcx-ranking--v2025 .vcx-ranking__table .table__body .table__row .table__cell:nth-child(3){
	flex: .35;
	z-index:0;
}

.vcx-ranking--v2025 .vcx-ranking__table .table__body .table__row .table__cell:nth-child(4),
.vcx-ranking--v2025 .vcx-ranking__table .table__body .table__row .table__cell:nth-child(5),
.vcx-ranking--v2025 .vcx-ranking__table .table__body .table__row .table__cell:nth-child(6){
	flex: .24;
	font-size:.9em;
	z-index:0;
}


@media screen and (max-width: 1199px) {
 
	.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell:nth-child(3){
		
	}

}

@media screen and (max-width: 991px) {
	.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell{
		
	}
	.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell:nth-child(3){
	
	}
}

@media screen and (max-width: 575px) {
	.vcx-ranking--v2025 .vcx-ranking__table .table__head .table__row .table__cell:nth-child(2){
		
	}
		
	
}


/*=== SCORE VISUALIZATION ===*/


.vcx-ranking--visual .vcx-ranking__score .score-numeric,
.vcx-ranking:not(.vcx-ranking--visual) .vcx-ranking__score .score-bar{
	display:none;
}

.vcx-ranking__score{
	position:relative;
	display:flex;
	justify-content:center
}

.vcx-ranking__score--best:before{
	position:absolute;
	top:0;
	content: "\f521";
    font-family: "Font Awesome\ 5 Pro";
    font-weight: 600;
    line-height: 1em;
	font-size:.5em;
    vertical-align: middle;
	transform: translateY(-1.2em);
	color:#888;
	z-index:1;
	
}

.vcx-ranking__table .active .vcx-ranking__score--best:before{
	color:#eb912d;
}

.vcx-ranking__score .score-bar{
	width: 70%;
	margin: 0 auto;
	position:relative;
	height:.301em;
	background-color:#d1d1d1;
}

[data-col="VCX"] .vcx-ranking__score .score-bar{
	height:.401em;
}

.vcx-ranking__score .score-bar__bar{
	content:"";
	position:absolute;
	height:100%;
	left:0;
	top:0;
	background-color:#888;
}

.vcx-ranking__table .active .score-bar__bar{
	color:#eb912d;
	background-color:#eb912d;
}

.vcx-ranking__score .score-visual{
	display: none;
}

.vcx-ranking__score .score-numeric{
}



/* Stars */

.vcx-ranking__table .table__body .star{
	color:inherit;	
  	position:relative;
}

.vcx-ranking__table .table__body .star:before{
	content:"\f005";
	font-family:"Font Awesome\ 5 Pro";
	font-weight:100;
	color:inherit;	
	opacity: .4;
}

.vcx-ranking__table .table__body .star-full:after{
	content:"\f005";
	font-family:"Font Awesome\ 5 Pro";
	font-weight:700;
	color:inherit;	
	
    position: absolute;
    transform: translateX(-100%);
}

.vcx-ranking__table .table__body .star-half:after{
	content:"\f089";
	font-family:"Font Awesome\ 5 Pro";
	font-weight:700;
	color:inherit;	
	
    position: absolute;
    transform: translateX(-100%);
}



/*---=== Common Styles ===---*/

/*--- Loader ---*/

.vcx-loader{
	position: absolute;
	top: 0;
	left: 0;
	height:100%;
	width:100%;
	display: flex;
	justify-content: center;
	align-items: center;
	display: none;
}

*.-loading .vcx-loader{
	display: flex;
	z-index: 2;
}

.vcx-loader:before,
.vcx-loader:after{
	content: "";
	position: absolute;    
	height: 2em;
	width: 2em;
	background-repeat: no-repeat;
}

.vcx-loader:before{
	background-image: url(/vcx/v2020/frontend/images/loading_circle.svg);
	filter: invert(80%);
}

.vcx-loader:after{
	background-image: url(/vcx/v2020/frontend/images/loading_third.svg);
	filter: invert(100%) brightness(50%);
	animation: loaderRotate 1s cubic-bezier(0.1, 0, 0.9, 1) 0s infinite normal forwards;
}

@keyframes loaderRotate {
	100% {
	  transform: rotate(360deg);
	}
 }

/*--- Rating Visual (stars) ---*/

.vcx-rating-visual{
   position: relative;
   display: inline-block;
   font-size: .8em;
}

@media screen and (max-width: 575px) {
   
	.vcx-comparison__table .vcx-rating-visual{
		font-size:.5em;	
	}

}

.vcx-rating-visual__icons{
   display:flex;
}

.vcx-rating-visual__icon{
   position: relative;
   font-style: normal;
}

.vcx-rating-visual__icon:before{
   content: "\f005";
   font-family: "Font Awesome\ 5 Pro";
   font-weight: 100;
   color: inherit;
}

.vcx-rating-visual--animated .vcx-rating-visual__icon:after{
   opacity: 0;

   animation-fill-mode: forwards;
   animation-name: shrink-in;
   animation-duration:.5s;
}

.vcx-rating-visual--animated .vcx-rating-visual__icon:nth-child(1):after{
   animation-delay:.5s;
}
.vcx-rating-visual--animated .vcx-rating-visual__icon:nth-child(2):after{
   animation-delay:.6s;
}
.vcx-rating-visual--animated .vcx-rating-visual__icon:nth-child(3):after{
   animation-delay:.7s;
}
.vcx-rating-visual--animated .vcx-rating-visual__icon:nth-child(4):after{
   animation-delay:.8s;
}
.vcx-rating-visual--animated .vcx-rating-visual__icon:nth-child(5):after{
   animation-delay:.9s;
}

.vcx-rating-visual__icon:after{
   position: absolute;
   font-family: "Font Awesome\ 5 Pro";
   font-weight: 700;
   left:0;
}

.vcx-rating-visual__icon--half:after{
   content: "\f089";
}

.vcx-rating-visual__icon--full:after{
   content: "\f005";
}

@keyframes shrink-in {
   0%{
     opacity: 0;
     transform: scale(10);
   }
   100% {
     opacity: 1;
     transform: scale(1);
   }
 }


 .vcx-rating-visual__vcx-version{
   display: block;
   font-weight: 400;
   font-size: 1.25rem;
   text-align: right;
}