/*****************************************************************************************************************************/
/* Reset - Redefinitions des balises HTML */
/*****************************************************************************************************************************/
/*****************************************************************************************************************************/
@import url(fonts.css);

*{margin:0; padding:0;}
*, *:after, *::before{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, select, textarea, blockquote{font-family:var(--fontMain); font-size:20px; color:var(--colorMain); font-weight:400;}

fieldset, img{border:0}
address, caption, cite, code, dfn, em, strong, th, var{font-style:normal; font-weight:normal;}

a, button{color:var(--colorMain); text-decoration:none; cursor:pointer; border:none; outline:none; transition:all 0.3s ease 0s;}
a:hover{text-decoration:none;}

input:focus, a:focus, textarea:focus, select:focus, button:focus{outline:none;}

ul li{list-style:none;}

table{border-collapse:collapse; border-spacing:0;}

iframe{border:none;}

img{vertical-align:middle;}

*::-webkit-input-placeholder {font-size: 16px; color:var(--colorBlack);}
*:-moz-placeholder {font-size: 16px; color:var(--colorBlack); opacity: 1;}
*::-moz-placeholder {font-size: 16px; color:var(--colorBlack); opacity: 1;}
*:-ms-input-placeholder {font-size: 16px; color:var(--colorBlack);}


/* variables */
:root {
	--colorMain: #969696;
	--colorWhite: #fff;
	--colorClubs: #FFE500;
	--colorVenues: #ED273B;
	--colorFestivals: #00CCF6;
	--colorShops: #FD801A;
	--colorGreen: #419B60;
	--colorBlue: #2ECFFF;
	--colorPurple: #BB8CD2;
	--colorViolet: #5891FF;
	--colorRed: #FF4545;
	--colorDark: #3C3C3B;
	--colorBlack: #000;
	--colorBg: #181818;
	--colorInter: #121212;
	--colorFooter: #EFEFEF;
	--colorNote: #C1C1C1;
	--colorBorder: #E0E0E0;

	--fontMain: 'Inter', sans-serif;
	--fontAlt: 'Sherman-Display';
}



/*****************************************************************************************************************************/

/*****************************************************************************************************************************/
/* CLASS génériques */
/*****************************************************************************************************************************/
	strong{font-weight:normal;}
	em{font-style:italic;}

	.img-responsive{width:100%; height:auto;}
	.img-cover{width:100%; height:100%; object-fit:cover; object-position:center;}

	.hidetext{font-size:0; text-indent:-9999px; display:block;}

	.hide-desk{display:none;}
	.hide-mob{display:block;}



/*****************************************************************************************************************************/

/*****************************************************************************************************************************/
/* Structure generale */
/*****************************************************************************************************************************/
	body {
		text-align: center;
		background: var(--colorBg);
		-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	}

	#header,
	#middle,
	#footer,
	.wrapper {
		position: relative;
		width: 100%;
		margin: 0 auto;
		text-align: left;
	}

	#middle,
	#footer {
		overflow: hidden;
	}

	.wrapper {
		max-width: 1350px;
		padding: 0 25px;
	}

	.d-flex {
		display: flex;
	}


	/* bouton */
	.btn {
		display: inline-flex;
		align-items: center;
		height: 60px;
		padding: 0 30px;
		background-color: var(--colorGreen);
		border-radius: 60px;
		font-size: 25px;
		color: var(--colorWhite);
		font-weight: 600;
	}

	.btn:after {
		content: '';
		width: 17px;
		height: 17px;
		margin-left: 43px;
		background: url(../img/arrow.svg) no-repeat;
		background-size: 100% 100%;
	}

	.btn:hover {
		background-color: var(--colorWhite);
		color: var(--colorGreen);
	}

	.btn:hover:after {
		background-image: url(../img/arrow-hover.svg);
	}


	/* textes */
	.categorie {
		font-family: var(--fontAlt);
		font-size: 22px;
		letter-spacing: 6px;
	}

	.tt-h2 {
		font-size: 54px;
		color: var(--colorWhite);
		font-weight: 700;
		line-height: 96%;
		letter-spacing: -1.5px;
	}

	.art-equity .categorie, 
	.art-equity .txt-color {
		color: var(--colorBlue);
	}

	.art-techno .categorie, 
	.art-techno .txt-color {
		color: var(--colorGreen);
	}

	.art-data .categorie, 
	.art-data .txt-color {
		color: var(--colorPurple);
	}

	.art-innov .categorie, 
	.art-innov .txt-color {
		color: var(--colorViolet);
	}

	.art-royalties .categorie, 
	.art-royalties .txt-color {
		color: var(--colorRed);
	}

	.art-next .categorie, 
	.art-next .txt-color {
		color: var(--colorGreen);
	}

	.paragraphe {
		font-weight: 500;
		line-height: 130%;
		letter-spacing: -0.5px;
	}

		.paragraphe strong {
			color: var(--colorWhite);
			font-weight: 700;
		}


	/* anim textes chapo */
	.typewriter {
		display: inline-block;
	}

	.type-off {
		visibility: hidden;
	}

		.typewriter p {
			overflow: hidden;
			white-space: nowrap;
			border-right: 2px solid;
			width: 0;
			animation: typing 1.5s steps(20, end) forwards, blinking 1s infinite, cursor 0s forwards 3s;
		}
  
	@keyframes typing {
		from { width: 0 }
		to { width: 100%; }
	}

	@keyframes blinking {
		from, to {border-right-color: transparent;}
		50% {border-right-color: var(--colorCursor);}
	}

	@keyframes cursor {
		to {border-right-color: transparent;}
	}



/* -------------- header -------------- */
#header {
	position: fixed;
	top: 0;
	height: 100px;
	background: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 80%);
	z-index: 100;
}

#header:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: var(--colorBlack);
	opacity: 0;
	transition: all 0.3s ease 0s;
}

.scrolled #header:before {
	opacity: 1;
}

	#header .wrapper {
		display: flex;
		align-items: flex-end;
		justify-content: space-between;
	}

		
		/* logo */
		#header .logo {
			width: 96px;
			margin: 14px 0 0 5px;
		}


		/* nav */
		.nav ul {
			display: flex;
			margin: 0 5px 10px 0;
		}

			.nav ul li {
				margin-left: 40px;
				font-size: 22px;
				font-weight: 600;
				line-height: 28px;
				letter-spacing: -0.5px;
				text-shadow: 0 2px 2px rgba(0, 0, 0, 0.45);
			}

				.nav ul li a {
					color: var(--colorWhite);
				}

				.nav ul li .lk-color {
					color: var(--colorGreen);
				}


		/* burger */
		.burger {
			display: none;
		}



/* -------------- middle -------------- */
/* section header */
.section-header {
	position: relative;
}

	
	/* visuels */
	.visu-header {
		position: relative;
		width: 100vw;
		height: 100vh;
	}

		.visu-header div {
			position: absolute;
			top: 0;
			left: 0;
			width: 100vw;
			height: 100vh;
			opacity: 0;
			animation: swapBg 12s ease infinite forwards;

		}

		.visu-header .bg-1 {
			animation-delay: -3s;
		}

		.visu-header .bg-2 {
			animation-delay: 0s;
		}

		.visu-header .bg-3 {
			animation-delay: 3s;
		}

		.visu-header .bg-4 {
			animation-delay: 6s;
		}

		@keyframes swapBg {
			15%, 25% {
				opacity: 0;
			}
			40%, 50% {
				opacity: 1;
			}
			65%, 75% {
				opacity: 0;
			}
			90%, 100% {
				opacity: 0;
			}
		}


	/* texte */
	.section-header .wrapper {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
	}

		.section-header .txt-header {
			width: 85%;
			max-width: 645px;
			padding-top: 80px;
		}

			.section-header .tt-h1 {
				display: flex;
				flex-direction: column;
			}

			.section-header .tt-h1, 
			.section-header .tt-h1 div {
				font-size: 78px;
				color: var(--colorWhite);
				font-weight: 700;
				line-height: 96%;
				letter-spacing: -2px;
			}

				.section-header .tt-h1 .bot {
					margin-top: -10px;
				}

				.scrolling-words-box {
					height: 95px;
					margin: -5px 0 -7px;
					display: inline-block;
					overflow: hidden;
					vertical-align: middle;
					mask-image: linear-gradient(0deg, transparent 5%, rgba(13, 24, 26, 1) 15%, rgba(13, 24, 26, 1) 88%, transparent 98%);
				}

					.scrolling-words-box ul {
						margin-bottom: 5px;
						animation: scrollUp 12s ease 1.7s infinite forwards;
					}

					@keyframes scrollUp {
						12% {
							transform: translateY(-0%);
						}
						15%, 25% {
							transform: translateY(-20%);
						}
						37% {
							transform: translateY(-20%);
						}
						40%, 50% {
							transform: translateY(-40%);
						}
						62% {
							transform: translateY(-40%);
						}
						65%, 75% {
							transform: translateY(-60%);
						}
						87% {
							transform: translateY(-60%);
						}
						90%, 100% {
							transform: translateY(-80%);
						}
					}

						.scrolling-words-box ul li {
							display: flex;
							align-items: center;
							height: 95px;
							padding-bottom: 15px;
							font-size: 78px;
							font-weight: 700;
							line-height: 96%;
							letter-spacing: -2px;
						}

						.color-1 {
							color: var(--colorClubs);
						}

						.color-2 {
							color: var(--colorVenues);
						}

						.color-3 {
							color: var(--colorFestivals);
						}

						.color-4 {
							color: var(--colorShops);
						}


			.section-header .intro {
				margin-top: 20px;
				padding-right: 6.2%;
				font-size: 22px;
				color: var(--colorWhite);
				font-weight: 500;
				line-height: 130%;
				letter-spacing: -0.5px;
			}

			.section-header .bouton {
				margin-top: 58px;
			}


/* article */
.article {
	position: relative;
}

	.article .texte header {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}

	.art-techno .texte header, 
	.art-next .texte header {
		align-items: center;
	}

	.article .tt-h2 {
		margin-top: 25px;
	}

	.article .paragraphe {
		margin-top: 18px;
	}


/* animation visuel */
.visu-bg, 
.visu-carte {
	position: absolute;
	top: 0;
	left: 0;
	filter: brightness(1);
}


/* section equity */
.art-equity .wrapper {
	display: flex;
	align-items: center;
}

	.art-equity .visuel {
		width: 56.3%;
		margin-left: -5%;
	}

	.art-equity .texte {
		width: 36.5%;
		margin-left: -17px;
	}


/* section technology */
.art-techno {
	background-color: var(--colorInter);
}

	.art-techno .wrapper {
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
	}


		/* sticker */
		.art-techno .sticker {
			display: flex;
			flex-direction: column;
			justify-content: center;
			position: absolute;
			top: 190px;
			right: 31px;
			width: 238px;
			height: 238px;
			border: 12px solid var(--colorGreen);
			border-radius: 238px;
			font-size: 15px;
			color: var(--colorWhite);
			font-weight: 700;
			line-height: 150%;
			letter-spacing: -0.5px;
		}

			.art-techno .sticker .line-top {
				font-size: 13px;
			}

			.art-techno .sticker strong {
				font-size: 73px;
				font-weight: 800;
				line-height: 85%;
				letter-spacing: -4.5px;
			}

				.art-techno .sticker strong sup {
					top: -0.6em;
					margin-left: 3px;
					font-size: 39px;
					letter-spacing: -1px;
				}


		/* contenu */
		.art-techno .texte {
			width: 85%;
			max-width: 640px;
			margin-top: 165px;
		}


		/* slider logos */
		.art-techno .slider-logos {
			margin-top: 50px;
			padding-left: 25px;
			mask-image: linear-gradient(90deg, transparent 5%, rgba(13, 24, 26, 1) 20%, rgba(13, 24, 26, 1) 80%, transparent 95%);
		}

			.art-techno .slider-logos .logo-item {
				padding: 0 50px;
			}

			.art-techno .slider-logos .img-slider {
				width: auto;
				height: 100px;
			}


		/* encarts */
		.art-techno .boxes {
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			margin: 18px -18px 0;
			padding-bottom: 84px;
		}

			.art-techno .boxes .box-item {
				display: flex;
				flex-direction: column;
				align-items: center;
				width: 230px;
				height: 136px;
				margin: 30px 18px 0;
				padding: 16px 8px 0;
				background: url(../img/box-techno.png) no-repeat;
				background-size: 100% 100%;
				font-size: 22px;
				color: var(--colorGreen);
				font-weight: 700;
				line-height: 110%;
				letter-spacing: -0.5px;
			}

			.art-techno .boxes .box-item:before {
				content: '';
				width: 66px;
				height: 26px;
				margin-bottom: 23px;
				background: url(../img/wave.svg) no-repeat;
				background-size: 100% 100%;
			}




/* section data */
.art-data .wrapper {
	display: flex;
	align-items: center;
}

	.art-data .texte {
		width: 47.7%;
	}

		.art-data .texte .paragraphe {
			padding-right: 20%;
		}

	.art-data .visuel {
		position: relative;
		width: 58.8%;
		margin-right: -8.8%;
	}


/* section temoignage */
.art-temoin {
	position: relative;
	height: 48.4vw;
	max-height: 774px;
}

	.art-temoin .visu-bg {
		width: 100%;
		height: 100%;
	}


	/* texte */
	.art-temoin .texte {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		width: 85vw;
    	max-width: 820px;
		text-align: center;
	}

		.art-temoin .texte .quote {
			display: flex;
			flex-direction: column;
			align-items: center;
			padding-bottom: 50px;
			font-size: 54px;
			color: var(--colorWhite);
			font-weight: 600;
			font-style: italic;
			line-height: 120%;
			letter-spacing: -1.5px;
		}

		.art-temoin .texte .quote:before {
			content: '';
			width: 79px;
			height: 64px;
			margin-bottom: 50px;
			background: url(../img/quote.svg) no-repeat;
			background-size: 100% 100%;
		}

		.art-temoin .texte .auteur, 
		.art-temoin .texte .role {
			font-size: 24px;
			color: var(--colorWhite);
			font-weight: 700;
			line-height: 120%;
			letter-spacing: -0.5px;
		}

		.art-temoin .texte .role {
			font-size: 19px;
			font-weight: 500;
		}


/* section innovative */
.art-innov .wrapper {
	display: flex;
	align-items: center;
}

	.art-innov .visuel {
		width: 38%;
		margin: 0 130px 0 25px;
	}

	.art-innov .texte {
		width: 50%;
		padding: 136px 0 158px;
	}


		/* encarts */
		.art-innov .boxes {
			display: flex;
			flex-wrap: wrap;
			margin-top: 30px;
		}

			.art-innov .boxes .box-item {
				display: flex;
				flex-direction: column;
				align-items: center;
				width: 198px;
				height: 102px;
				margin: 20px 15px 0 0;
				padding: 13px 8px 0;
				background: url(../img/box-innov.png) no-repeat;
				background-size: 100% 100%;
			}

				.art-innov .boxes .img-icon {
					width: auto;
					height: 26px;
				}

				.art-innov .boxes .intitule {
					padding-top: 10px;
					font-size: 15px;
					color: var(--colorViolet);
					font-weight: 700;
					text-align: center;
					line-height: 110%;
					letter-spacing: -0.5px;
				}

				.art-innov .boxes .note {
					padding-top: 10px;
					font-size: 11px;
					color: var(--colorNote);
					text-align: center;
					line-height: 120%;
					letter-spacing: -0.3px;
				}


/* section royalties */
.art-royalties {
	background-color: var(--colorInter);
}

	.art-royalties .wrapper {
		display: flex;
		align-items: center;
		padding-top: 153px;
		padding-bottom: 153px;
	}

		.art-royalties .texte {
			flex: 0 0 50%;
			width: 50%;
		}

			.art-royalties .list-rub {
				display: flex;
				position: relative;
				margin-top: 22px;
			}

				.art-royalties .list-rub li {
					font-weight: 500;
					line-height: 130%;
					letter-spacing: -0.5px;
				}

				.art-royalties .list-rub li + li {
					margin-left: 30px;
				}

					.art-royalties .list-rub li a {
						color: var(--colorMain);
						font-weight: 600;
					}

					.art-royalties .list-rub .rub-on a {
						color: var(--colorWhite);
					}

					.art-royalties .list-rub li a:after {
						content: '';
						width: 100%;
						height: 1px;
						border-top: 2px solid transparent;
						display: block;
						transition: all 0.3s ease 0s;
					}

					.art-royalties .list-rub li a:hover:after, 
					.art-royalties .list-rub .rub-on a:after {
						border-top-color: var(--colorMain);
					}

			.art-royalties .texte .txt-carte {
				display: none;
			}

			.art-royalties .texte .txt-carte:first-of-type {
				display: block;
			}


		/* slider rubriques */
		.art-royalties .slider-rubq {
			width: 50vw;
			margin-left: 4%;
			mask-image: linear-gradient(to left, rgba(13, 24, 26, 1) 90%, transparent 100%);
		}

			.art-royalties .slider-rubq .slick-list {
				padding: 0 30% 0 0;
			}

				.art-royalties .slider-rubq .inner {
					position: relative;
					width: 379px;
					margin: 0 auto;
					border-radius: 26.5px;
				}

					.art-royalties .slider-rubq .bg-rub {
						width: 379px;
						height: 428px;
					}

					.art-royalties .slider-rubq .txt-over {
						position: absolute;
						top: 0;
						left: 50%;
						transform: translateX(-50%);
						width: 300px;
						padding-top: 26px;
					}

						.art-royalties .slider-rubq .tt-rub {
							display: flex;
							justify-content: center;
							align-items: center;
							height: 72px;
							margin-bottom: 18px;
							font-size: 32px;
							color: var(--colorWhite);
							font-weight: 700;
							text-align: center;
							line-height: 110%;
							letter-spacing: -1px;
						}

						.art-royalties .slider-rubq .visuel {
							margin: 0 7.33%;
						}


/* section next steps */
.art-next {
	padding: 114px 0 166px;
}

	.art-next .wrapper {
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
	}


		/* contenu */
		.art-next .texte {
			width: 44.6%;
		}


		/* steps */
		.art-next .steps {
			display: flex;
			margin-top: 45px;
		}

			.art-next .steps .step-item {
				display: flex;
				flex-direction: column;
				align-items: center;
				width: 320px;
				margin: 0 39px;
				font-size: 24px;
				font-weight: 600;
				line-height: 130%;
				letter-spacing: -0.5px;
			}

			.art-next .steps .step-item:before {
				content: '';
				width: 43px;
				height: 41px;
				margin-bottom: 11px;
				background: url(../img/tick.svg) no-repeat;
				background-size: 100% 100%;
			}

				.art-next .steps .step-item strong {
					color: var(--colorWhite);
					font-weight: 700;
				}


		/* bouton */
		.art-next .bouton {
			margin-top: 80px;
		}


/* modal formulaire */
.content-modal {
	padding: 64px 11.7%;
	text-align: left;
}

	.content-modal .paragraphe {
		margin-top: 15px;
	}


	/* formulaire */
	.content-modal .formulaire {
		margin-top: 34px;
	}

	.form-bloc {
		position: relative;
		width: 100%;
	}

	.form-bloc + .form-bloc {
		margin-top: 20px;
	}

		.form-bloc input[type=text],
		.form-bloc input[type=password],
		.form-bloc input[type=email],
		.form-bloc input[type=date],
		.form-bloc textarea {
			width: 100%;
			height: 50px;
			padding: 0 30px;
			border: 1px solid var(--colorBorder);
			border-radius: 25px;
			outline: 0;
			font-size: 16px;
			color: var(--colorBlack);
			line-height: 100%;
		}

		.form-bloc textarea {
			height: 126px;
			padding-top: 20px;
			border-radius: 25px;
			resize: vertical;
			display: block;
		}

		.form-bloc.error input[type=text],
		.form-bloc.error input[type=password],
		.form-bloc.error input[type=email],
		.form-bloc.error input[type=date],
		.form-bloc.error textarea {
			border-color: var(--colorRed);
		}


		/* texte erreur */
		.form-bloc .txt-error {
			position: absolute;
			top: calc(100% + 1px);
		    left: 30px;
		    width: 100%;
			font-size: 12px;
			color: var(--colorRed);
			font-style: italic;
			text-align: left;
			display: none;
		}

		.form-bloc.error .txt-error {
			display: block;
		}


		/* checkbox */
		.type-options {
			display: flex;
			justify-content: space-between;
			margin: 20px 0;
		}

			.check-container {
				position: relative;
				font-size: 16px;
				color: var(--colorWhite);
				display: block;
				cursor: pointer;
				user-select: none;
			}

				.check-container .txt-label {
					padding: 1px 0 0 25px;
					line-height: 20px;
					display: block;
				}

				.check-container input {
					position: absolute;
					width: 0;
					height: 0;
					opacity: 0;
					cursor: pointer;
				}

				.check-container .checkmark {
					position: absolute;
					top: 0;
					left: 0;
					width: 20px;
					height: 20px;
					background: var(--colorWhite);
					border: 1px solid var(--colorBorder);
					border-radius: 6px;
					transition: all 0.3s ease 0s;
				}

				.check-container input:checked ~ .checkmark {
					background-image: url(../img/tick.svg);
					background-repeat: no-repeat;
					background-position: center;
					background-size: 16px 15px; 
				}


		/* input file */
		.file-item {
		    margin-top: 20px;
		}

		.file-item .input-file {
			width: 100%;
		    font-size: 16px;
		}

		.file-item input[type=file]::file-selector-button {
			padding: 0 15px;
			background-color: var(--colorWhite);
			border: 1px solid var(--colorBorder);
			border-radius: 4px;
			font-size: 16px;
			text-align: center;
			line-height: 30px;
		}


		/* bouton */
		.form-bouton {
			display: flex;
    		justify-content: flex-end;
			margin-top: 10px;
		}

			.form-bouton .btn {
				height: 48px;
				padding: 0 62px;
				font-size: 20px;
			}

			.form-bouton .btn:after {
				display: none;
			}



/* -------------- footer -------------- */
#footer {
	padding: 78px 0;
	background-color: var(--colorFooter);
}

	#footer .wrapper {
		display: flex;
		align-items: center;
	}

		
		/* bloc logo */
		#footer .ft-left {
			width: 29.6%;
		}

			#footer .ft-left .logo {
				width: 161px;
			}

			#footer .ft-left .accroche {
				margin-top: 20px;
				font-size: 18px;
				color: var(--colorBlack);
				letter-spacing: -0.5px;
			}

			#footer .ft-left .address {
				margin-top: 16px;
				font-size: 15px;
				line-height: 130%;
				letter-spacing: -0.5px;
			}


		/* bloc contact */
		#footer .contact {
			display: flex;
			flex-wrap: wrap;
			width: 70.4%;
		}

			#footer .contact .tt-ft {
				width: 100%;
				font-size: 34px;
				color: var(--colorDark);
				font-weight: 700;
				letter-spacing: -1px;
			}

			
			/* newsletter */
			#footer .contact .email {
				width: 53.7%;
				margin: 20px 15.15% 0 0;
			}

				#footer .contact .news form {
					display: flex;
					align-items: center;
					position: relative;
					width: 100%;
					height: 48px;
					margin-top: 20px;
					padding: 0 5px;
					background-color: var(--colorWhite);
					border: 1px solid var(--colorBorder);
					border-radius: 48px;
				}

					#footer .contact .news form .foot {
						position: absolute;
						top: 100%;
						left: 0;
					}

						#footer .contact .news form .foot div {
							padding: 2px 24px 0;
							font-size: 15px;
						}

					#footer .contact .input-news, 
					#footer .contact input[type=text], 
					#footer .contact .btn-news, 
					#footer .contact button {
						height: 38px;
						padding: 0 24px;
						border: none;
						border-radius: 38px;
						font-size: 16px;
					}

					#footer .contact .input-news, 
					#footer .contact input[type=text] {
						flex: 1;
						background-color: var(--colorWhite);
						color: var(--colorBlack);
					}

					#footer .contact .btn-news, 
					#footer .contact button {
						background-color: var(--colorGreen);
						color: var(--colorWhite);
						font-weight: 600;
					}

					#footer .contact .btn-news:hover, 
					#footer .contact button:hover {
						opacity: .6;
					}


			/* network */
			#footer .contact .network {
				width: 31.15%;
				margin-top: 20px;
			}

				#footer .contact .list-btn {
					display: flex;
					margin-top: 12px;
				}

					#footer .contact .list-btn li + li {
						margin-left: 13px;
					}

						#footer .contact .list-btn .btn-ico {
							width: 32px;
							height: 32px;
							background-repeat: no-repeat;
							background-size: 100% 100%;
							border-radius: 32px;
						}

						#footer .contact .list-btn .ico-lkn {
							background-image: url(../img/lkn-icon.svg);
						}

						#footer .contact .list-btn .ico-x {
							background-image: url(../img/x-icon.svg);
						}

						#footer .contact .list-btn .ico-insta {
							background-image: url(../img/insta-icon.svg);
						}

						#footer .contact .list-btn .btn-ico:hover {
							opacity: .6;
						}