@charset "UTF-8";

/* --------------------------------------------
LANGUAGES
--------------------------------------------- */
#Languages h2{
	font-weight : 600;
	color : var( --blue02 );
}
#Languages h3{
	display : grid;
	align-items : center;
	justify-content : start;
	font-weight : 600;
	color : #333;
	background-color : #d4e3e9;
}
#Languages ul ul{
	columns : 2;
}
#Languages li li{
	font-weight : 400;
	color : #333;
}
#Languages li li:last-child::after{
	display : block;
	color : #a2a2a2;
	content : "and more";
}
@media screen and ( width <= 750px ){
	#Languages{
		padding-top : calc( ( 80 - 7 ) var( --remBase ) );
	}
	#Languages h2{
		font-size : 3.6rem;
		line-height : calc( 50 / 36 );
	}
	#Languages > ul{
		margin-top : calc( ( 41 - 7 ) var( --remBase ) );
	}
	#Languages > ul > li + li{
		margin-top : calc( ( 43 - 16 ) var( --remBase ) );
	}
	#Languages h3{
		height : calc( 74 var( --remBase ) );
		padding-inline : calc( 31 var( --percentBase ) );
		font-size : 2.8rem;
	}
	#Languages ul ul{
		margin-top : calc( ( 39 - 16 ) var( --remBase ) );
	}
	#Languages li li{
		font-size : 2.8rem;
		line-height : calc( 60 / 28 );
	}
}
@media print , screen and ( width > 750px ){
	#Languages h2{
		font-size : 3rem;
	}
	#Languages > ul{
		display : grid;
		grid-template-columns : repeat( 2 , calc( 450 * 100% / 930 ) );
		justify-content : space-between;
		margin-top : calc( 19 var( --remBase ) );
	}
	#Languages h3{
		height : calc( 50 var( --remBase ) );
		padding-inline : calc( 20 * 100% / 450 );
		font-size : 1.8rem;
	}
	#Languages ul ul{
		margin-top : calc( ( 28 - 10 ) var( --remBase ) );
	}
	#Languages li li{
		font-size : 1.6rem;
		line-height : 2.25;
	}
}

/* --------------------------------------------
SERVICES
--------------------------------------------- */
@media screen and ( width <= 750px ){
	#services{
		padding-top : calc( ( 86 - 16 - 7 ) var( --remBase ) );
	}
}
@media print , screen and ( width > 750px ){
	#services{
		padding-top : calc( ( 62 - 10 - 5 ) var( --remBase ) );
		padding-bottom : calc( 40 var( --remBase ) );
	}
}

/* --------------------------------------------
PRICING
--------------------------------------------- */
#pricing h2{
	font-weight : 600;
	color : var( --blue02 );
}
#pricing table{
	table-layout : fixed;
	border-collapse : collapse;
}
#pricing th , #pricing td{
	color : #333;
}
#pricing thead th{
	border-bottom : solid 1px #a2a2a2;
	border-right : solid 1px #a2a2a2;
}
#pricing thead th:nth-of-type( 1 ){
	width : calc( 222 * 100% / 930 );
	padding-top : 1px;
	font-weight : 600;
	text-align : left;
	vertical-align : bottom;
}
#pricing thead th + th{
	width : calc( 118 * 100% / 930 );
	vertical-align : bottom;
	background-repeat : no-repeat;
	background-position-x : center;
	border-top : solid 1px #a2a2a2;
}
#pricing thead th + th span{
	display : grid;
	place-items : center;
	min-height : 2lh;
	font-weight : 400;
	text-align : center;
}
#pricing thead th:nth-of-type( 2 ){
	background-image : url( "../../images/multilingual/rate/icon01.svg" );
}
#pricing thead th:nth-of-type( 3 ){
	background-image : url( "../../images/multilingual/rate/icon02.svg" );
}
#pricing thead th:nth-of-type( 4 ){
	background-image : url( "../../images/multilingual/rate/icon03.svg" );
}
#pricing thead th:nth-of-type( 5 ){
	background-image : url( "../../images/multilingual/rate/icon04.svg" );
}
#pricing thead th:nth-of-type( 6 ){
	background-image : url( "../../images/multilingual/rate/icon05.svg" );
}
#pricing thead th:nth-of-type( 7 ){
	background-image : url( "../../images/multilingual/rate/icon06.svg" );
}
#pricing tbody th , #pricing tbody td{
	border-bottom : solid 1px #a2a2a2;
	border-right : solid 1px #a2a2a2;
}
#pricing tbody th{
	font-weight : 400;
	text-align : left;
	vertical-align : middle;
	background-color : #e9f2f6;
	border-left : solid 1px #a2a2a2;
}
#pricing tbody td{
	font-weight : 400;
}
#pricing tbody td:has( span ){
	vertical-align : top;
}
#pricing tbody td:has( span ) span:nth-of-type( 1 ){
	display : block;
	font-weight : 600;
	text-align : center;
}
#pricing tbody td:has( span ) span:nth-of-type( 2 ){
	display : block;
	width : fit-content;
	margin-left : auto;
}
#pricing tbody td:not( :has( span ) ){
	text-align : center;
	vertical-align : middle;
}
@media screen and ( width <= 750px ){
	#pricing{
		padding-top : calc( 77 var( --remBase ) );
		padding-bottom : calc( ( 82 - 20 ) var( --remBase ) );
		padding-left : calc( 40 var( --viewportBase ) );
	}
	#pricing h2{
		font-size : 3.6rem;
	}
	#pricing .tableBox{
		padding-bottom : calc( 20 var( --remBase ) );
		margin-top : calc( 40 var( --remBase ) );
		overflow-x : auto;
	}
	#pricing table{
		width : calc( 1508 * 100% / 710 );
	}
	#pricing thead th{
		height : calc( 194 var( --remBase ) );
	}
	#pricing thead th:nth-of-type( 1 ){
		padding-bottom : calc( 20 var( --remBase ) );
		font-size : 3.2rem;
	}
	#pricing thead th + th{
		padding-bottom : calc( ( 28 - 3.24 ) var( --remBase ) );
	}
	#pricing thead th + th span{
		font-size : 2.268rem;
		line-height : calc( 29.16 / 22.68 );
	}
	#pricing thead th:nth-of-type( 2 ){
		background-position-y : calc( 36 var( --remBase ) );
		background-size : auto calc( 68 var( --remBase ) );
	}
	#pricing thead th:nth-of-type( 3 ){
		background-position-y : calc( 32 var( --remBase ) );
		background-size : auto calc( 67 var( --remBase ) );
	}
	#pricing thead th:nth-of-type( 4 ){
		background-position-y : calc( 36 var( --remBase ) );
		background-size : auto calc( 65 var( --remBase ) );
	}
	#pricing thead th:nth-of-type( 5 ){
		background-position-y : calc( 37 var( --remBase ) );
		background-size : auto calc( 57 var( --remBase ) );
	}
	#pricing thead th:nth-of-type( 6 ){
		background-position-y : calc( 39 var( --remBase ) );
		background-size : auto calc( 58 var( --remBase ) );
	}
	#pricing thead th:nth-of-type( 7 ){
		background-position-y : calc( 36 var( --remBase ) );
		background-size : auto calc( 63 var( --remBase ) );
	}
	#pricing tbody th , #pricing tbody td{
		height : calc( 80 var( --remBase ) );
	}
	#pricing tbody th{
		padding-inline : calc( 15 * 100% / 1508 );
		font-size : 2.268rem;
		line-height : calc( 29.16 / 22.68 );
	}
	#pricing tbody th span{
		font-size : 2.106rem;
		line-height : calc( 29.16 / 21.06 );
	}
	#pricing tbody td:has( span ){
		padding-top : calc( 19 var( --remBase ) );
	}
	#pricing tbody td:has( span ) span:nth-of-type( 1 ){
		font-size : 2.916rem;
	}
	#pricing tbody td:has( span ) span:nth-of-type( 2 ){
		padding-right : calc( 8 * 100% / 190 );
		font-size : 1.944rem;
	}
	#pricing tbody td:not( :has( span ) ){
		font-size : 2.268rem;
		line-height : calc( 29.16 / 22.68 );
	}
}
@media print , screen and ( width > 750px ){
	#pricing{
		padding-top : calc( 60 var( --remBase ) );
		padding-bottom : calc( 60 var( --remBase ) );
	}
	#pricing h2{
		font-size : 3rem;
	}
	#pricing .tableBox{
		margin-top : calc( 37 var( --remBase ) );
	}
	#pricing table{
		width : 100%;
	}
	#pricing thead th{
		height : calc( 120 var( --remBase ) );
	}
	#pricing thead th:nth-of-type( 1 ){
		padding-bottom : calc( ( 11 - 1 ) var( --remBase ) );
		font-size : 1.6rem;
		line-height : calc( 18 / 16 );
	}
	#pricing thead th + th{
		padding-bottom : calc( ( 17 - 2 ) var( --remBase ) );
	}
	#pricing thead th + th span{
		font-size : 1.4rem;
		line-height : calc( 18 / 14 );
	}
	#pricing thead th:nth-of-type( 2 ){
		background-position-y : calc( 21 var( --remBase ) );
		background-size : auto calc( 42 var( --remBase ) );
	}
	#pricing thead th:nth-of-type( 3 ){
		background-position-y : calc( 19 var( --remBase ) );
		background-size : auto calc( 41 var( --remBase ) );
	}
	#pricing thead th:nth-of-type( 4 ){
		background-position-y : calc( 21 var( --remBase ) );
		background-size : auto calc( 40 var( --remBase ) );
	}
	#pricing thead th:nth-of-type( 5 ){
		background-position-y : calc( 22 var( --remBase ) );
		background-size : auto calc( 35 var( --remBase ) );
	}
	#pricing thead th:nth-of-type( 6 ){
		background-position-y : calc( 23 var( --remBase ) );
		background-size : auto calc( 36 var( --remBase ) );
	}
	#pricing thead th:nth-of-type( 7 ){
		background-position-y : calc( 21 var( --remBase ) );
		background-size : auto calc( 39 var( --remBase ) );
	}
	#pricing tbody th , #pricing tbody td{
		height : calc( 50 var( --remBase ) );
	}
	#pricing tbody th{
		padding-inline : calc( 9 * 100% / 930 );
		font-size : 1.4rem;
		line-height : calc( 18 / 14 );
	}
	#pricing tbody th span{
		font-size : 1.3rem;
		line-height : calc( 18 / 13 );
	}
	#pricing tbody td:has( span ){
		padding-top : calc( 12 var( --remBase ) );
	}
	#pricing tbody td:has( span ) span:nth-of-type( 1 ){
		font-size : 1.8rem;
	}
	#pricing tbody td:has( span ) span:nth-of-type( 2 ){
		padding-right : calc( 7 * 100% / 118 );
		font-size : 1.2rem;
	}
	#pricing tbody td:not( :has( span ) ){
		font-size : 1.4rem;
		line-height : calc( 18 / 14 );
	}
}