* {
	padding: 0;
	margin: 0;
	border: 0;
}
*,
:after,
:before {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
:active,
:focus {
	outline: 0;
}
a:active,
a:focus {
	outline: 0;
}
aside,
footer,
header,
nav {
	display: block;
}
body,
html {
	width: 100%;
	font-size: 100%;
	line-height: 1;
	font-size: 14px;
	-ms-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scrollbar-gutter: stable;
	color: var(--white);
	font-family: var(--font-main);
}
button,
input,
textarea {
	font-family: var(--font-main);
}
input::-ms-clear {
	display: none;
}
input,
textarea {
	-moz-appearance: none;
	appearance: none;
	-webkit-appearance: none;
	border-radius: 0;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
	color: inherit;
}
input::-moz-placeholder,
textarea::-moz-placeholder {
	color: inherit;
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
	color: inherit;
}
input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
	color: inherit;
}
input::placeholder,
textarea::placeholder {
	color: inherit;
}
textarea {
	resize: none;
}
button {
	cursor: pointer;
	background-color: transparent;
}
button::-moz-focus-inner {
	padding: 0;
	border: 0;
}
a {
	display: inline-block;
	color: inherit;
	font-family: var(--font-main);
}
a,
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: none;
}
ul li {
	list-style: none;
}
img {
	display: block;
	width: 100%;
	height: 100%;
	-o-object-fit: contain;
	object-fit: contain;
	-o-object-position: center;
	object-position: center;
	vertical-align: top;
}
svg {
	display: block;
	width: 100%;
	height: 100%;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--font-title);
	font-size: inherit;
	font-weight: inherit;
}

p,
span {
	font-family: var(--font-main);
}

picture {
	display: block;
	width: 100%;
	height: 100%;
}
input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
input[type='number'] {
	-moz-appearance: textfield;
}
@font-face {
	font-family: 'Tomorrow';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('/top5meilleurcasino-fonts/top5meilleurcasino-Tomorrow-Regular.ttf') format('truetype'),
		url('/top5meilleurcasino-fonts/top5meilleurcasino-Tomorrow-Regular.woff2') format('woff2');
}
@font-face {
	font-family: 'Tomorrow';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('/top5meilleurcasino-fonts/top5meilleurcasino-Tomorrow-Medium.ttf') format('truetype'),
		url('/top5meilleurcasino-fonts/top5meilleurcasino-Tomorrow-Medium.woff2') format('woff2');
}
@font-face {
	font-family: 'Tomorrow';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('/top5meilleurcasino-fonts/top5meilleurcasino-Tomorrow-SemiBold.ttf') format('truetype'),
		url('/top5meilleurcasino-fonts/top5meilleurcasino-Tomorrow-SemiBold.woff2') format('woff2');
}
@font-face {
	font-family: 'Tomorrow';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('/top5meilleurcasino-fonts/top5meilleurcasino-Tomorrow-Bold.ttf') format('truetype'),
		url('/top5meilleurcasino-fonts/top5meilleurcasino-Tomorrow-Bold.woff2') format('woff2');
}

@font-face {
	font-family: Mulish;
	font-style: normal;
	font-weight: 900;
	font-display: swap;
	src: url('/top5meilleurcasino-fonts/top5meilleurcasino-Mulish-Black.ttf') format('truetype'),
		url('/top5meilleurcasino-fonts/top5meilleurcasino-Mulish-Black.woff2') format('woff2');
}

:root {
	--font-main: Tomorrow, sans-serif;
	--font-title: Tomorrow, sans-serif;
	--container-width: 1240px;
	--container-step: 20px;
	--container-step-tablet: 20px;
	--container-step-mobile: 20px;
	--container: calc(var(--container-width) + (var(--container-step) * 2));
	--black: #060606;
	--white: #ffffff;
}
.container {
	max-width: var(--container);
	margin: 0 auto;
	padding: 0 var(--container-step);
}
@media (max-width: 991px) {
	.container {
		padding: 0 var(--container-step-tablet);
	}
}
@media (max-width: 600px) {
	.container {
		padding: 0 var(--container-step-mobile);
	}
}

.w-100 {
	width: 100%;
}

.h-100 {
	height: 100%;
}

.d-flex {
	display: flex;
}

.flex-col {
	flex-direction: column;
}

.flex-row {
	flex-direction: row;
}

.flex-row-col {
	flex-direction: row;
}

@media (max-width: 991px) {
	.flex-row-col {
		flex-direction: column;
	}
}

.gap6 {
	gap: 6px;
}

.gap10 {
	gap: 10px;
}

.gap20 {
	gap: 20px;
}

.gap20-10 {
	gap: 20px;
}

.gap40-20 {
	gap: 40px;
}

.fs20-16 {
	font-size: 20px;
	font-weight: 500;
	line-height: 120%;
}

.fs16 {
	font-size: 16px;
	font-weight: 400;
	line-height: 120%;
}

.fw700 {
	font-weight: 700;
}

.pad-b60-40 {
	padding-bottom: 60px;
}

@media (max-width: 991px) {
	.gap20-10 {
		gap: 10px;
	}
	.gap40-20 {
		gap: 20px;
	}

	.fs20-16 {
		font-size: 16px;
	}

	.pad-b60-40 {
		padding-bottom: 40px;
	}
}

.text-uppercase {
	text-transform: uppercase;
}

.text-center {
	text-align: center;
}

.justify-between {
	justify-content: space-between;
}

.justify-center {
	justify-content: center;
}

.align-center {
	align-items: center;
}

.btn {
	font-family: Mulish;
	border-radius: 8px;
	background: linear-gradient(180deg, #ffd902 0%, #ff6a00 100%);
	padding: 20px;
	color: var(--white);
	font-size: 16px;
	font-weight: 900;
	line-height: 120%;
	text-transform: uppercase;
	text-align: center;
}

@media (max-width: 991px) {
	.btn {
		font-size: 14px;
	}
}

.burger {
	width: 42px;
	flex-direction: column;
	cursor: pointer;
	display: none;
	gap: 7px;
}

.burger span {
	display: block;
	height: 1px;
	background-color: var(--white);
	border-radius: 2px;
}

.header__wrap {
	background: linear-gradient(180deg, #111f68 0%, #223ece 100%);
	padding: 19px 0;
}

.header__disclaimer {
	text-align: center;
	background: var(--BLack, #060606);
	padding: 10px 0;
	p {
		font-size: 10px;

		font-weight: 500;
		line-height: 100%;
	}
}

.header__nav-list {
	gap: 40px;
}

@media (max-width: 991px) {
	.burger {
		display: flex;
	}

	.header__nav {
		display: none;
		position: absolute;
		top: 88px;
		right: 0;
		background: linear-gradient(0deg, #111f68 0%, #223ece 100%);
		flex-direction: column;
		z-index: 1000;
		width: 100%;
		padding: 20px 0;
	}

	.header__nav.open {
		display: flex;
		max-width: 200px;
	}

	.header__nav-list {
		flex-direction: column;
		gap: 20px;
	}
}

@media (max-width: 600px) {
	.header__nav {
		top: 98px;
	}
}

.terms {
	color: var(--white);
	background-color: var(--black);
	padding: 50px 0;
}

.terms__wrapper {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.terms h1 {
	font-family: var(--font-title);
	font-size: 60px;
	font-weight: 800;
	padding-bottom: 10px;
}

.terms h2 {
	font-family: var(--font-title);
	font-size: 20px;
	font-weight: 700;
	line-height: 120%;
}

.terms p,
li {
	font-family: var(--font-main);
	font-size: 20px;
	font-weight: 400;
	line-height: 120%;
}

@media (max-width: 991px) {
	.terms {
		padding: 20px 0;
	}

	.terms__wrapper {
		gap: 10px;
	}

	.terms h1 {
		font-size: 30px;
	}

	.terms h2 {
		font-size: 14px;
	}

	.terms p,
	li {
		font-size: 14px;
	}
}

.hero {
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.4) 100%),
		url('/top5meilleurcasino-imgs/top5meilleurcasino-hero-back.webp') lightgray 50% / cover no-repeat;
	padding: 120px 0;

	h1 {
		font-size: 60px;
		font-weight: 700;
		line-height: 100%;
		text-transform: uppercase;
	}
}

.hero__list {
	gap: 40px;
	justify-content: center;
}

.hero__item {
	background-repeat: no-repeat;
	padding-left: 35px;
}

@media (max-width: 991px) {
	.hero {
		padding: 40px 0;

		h1 {
			font-size: 26px;
		}
	}

	.hero__list {
		gap: 20px;
		align-items: center;
	}
}

.page-back {
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.4) 100%),
		url('/top5meilleurcasino-imgs/top5meilleurcasino-background.webp') lightgray 50% / cover no-repeat;
}

.company {
	padding: 20px 0 60px 0;
}

.company__cards {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.company__card {
	display: flex;
	flex-direction: row;
	gap: 20px;
}

.company__card-logo,
.company__card-raiting,
.company__card-text {
	border-radius: 10px;
	border: 1px solid #ffd902;
	background: var(--black);
	height: 120px;
	padding: 20px;
}

.company__card-logo {
	width: 220px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.company__card-text {
	overflow: hidden;
	width: 100%;
	box-sizing: border-box;
	flex: 1;
	min-width: 350px;

	p {
		font-size: 16px;
		font-weight: 700;
		line-height: 120%;
	}
}

.company__card-pay {
	img {
		height: 32px;
	}
}

.company__card-raiting {
	p {
		font-size: 14px;
		font-weight: 400;
		line-height: 120%;
	}

	span {
		font-size: 26px;
		font-weight: 700;
		line-height: 100%;
	}
	img {
		height: 24px;
	}
}

.company__card-countries { 
	display: flex;
	gap: 10px; 

	li {
		flex-shrink: 0;
	}

	p {
		white-space: nowrap;
		font-size: 12px;
		font-weight: 400;
		line-height: 120%;
	}
	div {
		background-repeat: no-repeat;
		width: 16px;
		height: 12px;
		background-size: cover;
	}
}

.company__card-jouer {
	.btn {
		width: 218px;
		height: 76px;
	}
}

@media (max-width: 991px) {
	.company {
		padding: 20px 0 40px 0;
	}

	.company__cards {
		gap: 26px;
	}
	.company__card {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}

	.company__card-text {
		order: 1;
		padding: 20px 10px;
		min-width: 100%;

		> p {
			font-size: 14px;
		}
	}
}

@media (max-width: 640px) {
	.company__card {
		display: flex;
		flex-direction: column;
		gap: 10px;
	}

	.company__card-text {
		order: inherit;
	}

	.company__card-logo {
		width: 100%;
	}

	.company__card-pay {
		display: none;
	}

	.company__card-descr {
		gap: 10px;
		max-height: 91px;

		> div {
			flex: 1;
			height: 100%;
		}
	}

	.company__card-raiting {
		max-width: max-content;
		span {
			font-size: 24px;
		}
		img {
			height: 24px;
		}
	}

	.company__card-jouer {
		.btn {
			width: 100%;
			height: 91px;
		}
	}
}

.rewiews {
	h2 {
		text-align: center;
		font-size: 40px;
		font-weight: 700;
		line-height: 100%;
	}
}

.rewiews__cards {
	display: grid;
	grid-template-columns: repeat(2, auto);
	gap: 20px;
}

.rewiews__card {
	padding: 20px;
	border-radius: 10px;
	border: 1px solid var(--white);
	background: linear-gradient(180deg, #111f68 0%, #223ece 100%);
	display: flex;
	gap: 14px;
}

.rewiews__person {
	min-width: 80px;
	align-items: center;

	> div {
		width: 70px;
		height: 70px;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: 50% 11%;
	}

	> span {
		font-size: 14px;
		font-weight: 500;
		line-height: 120%;
	}
}

.rewiews__text {
	> div {
		background-repeat: repeat;
		width: 120px;
		height: 22px;
	}
}

@media (max-width: 991px) {
	.rewiews {
		h2 {
			font-size: 22px;
		}
	}
}

@media (max-width: 600px) {
	.rewiews__cards {
		grid-template-columns: repeat(1, auto);
		gap: 10px;
	}
}

.faq {
	h2 {
		text-align: center;
		color: var(--Gold, #ffd902);
		font-size: 40px;
		font-weight: 700;
		line-height: 100%;
	}
}

.faq__card {
	padding: 20px;
	border-radius: 10px;
	border: 1px solid var(--Gold, #ffd902);
	background: var(--BLack, #060606);

	h3 {
		color: var(--Gold, #ffd902);
		font-size: 20px;
		font-weight: 600;
		line-height: 120%;
	}
}

.why {
	h2 {
		text-align: center;
		font-size: 40px;
		font-weight: 700;
		line-height: 100%;
	}
}

.why__block {
	padding: 20px;
	border-radius: 10px;
	background: var(--Blue, linear-gradient(180deg, #111f68 0%, #223ece 100%));
}

.footer {
	background: var(--BLack, #060606);
	padding: 50px 0;

	> div {
		display: flex;
		flex-direction: column;
		gap: 30px;
	}
}

.footer__notify {
	border-radius: 20px;
	background: var(--Gold, #ffd902);
	padding: 40px 20px;

	p {
		font-size: 16px;
		color: var(--black);
		font-weight: 400;
		line-height: 120%;
	}
}

.footer__text {
	p {
		font-size: 14px;
		font-weight: 400;
		line-height: 120%;
	}
}

.footer__nav-list {
	display: flex;
	align-items: center;
	justify-content: space-between;

	a {
		font-size: 14px;
		font-weight: 500;
		line-height: 120%;
	}
}

.footer__partners {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 20px;
}

.footer__partners-item {
	> div {
		height: 64px;
		width: 64px;
		background-repeat: no-repeat;
		background-size: cover;
	}

	img {
		height: 40px;
		background-repeat: no-repeat;
	}
}

.responsable {
	padding: 80px 0;

	h1 {
		font-size: 40px;
		font-weight: 700;
		line-height: 100%;
		text-align: center;
	}

	li {
		margin-bottom: 10px;
		list-style-type: disc;
		margin-left: 20px;
	}
}

@media (max-width: 991px) {
	.responsable {
		padding: 40px 0;

		h1 {
			font-size: 22px;
		}
	}
	.faq,
	.why {
		h2 {
			font-size: 22px;
		}
	}

	.faq__card {
		h3 {
			font-size: 16px;
		}
	}

	.footer {
		padding: 20px 0;

		> div {
			gap: 20px;
		}
	}

	.footer__notify {
		padding: 20px;
	}

	.footer__nav-list {
		flex-direction: column;
		gap: 10px;
		align-items: baseline;
	}

	.footer__partners {
		justify-content: center;
	}

	.footer__partners-item {
		> div {
			height: 40px;
			width: 40px;
		}
	}
}

@media (max-width: 600px) {
	.footer__partners {
		justify-content: flex-start;
	}
}

.contactez {
	padding: 80px 0;
}

.contactez__block {
	padding: 40px;
	border-radius: 10px;
	border: 1px solid var(--White, #fff);
	background: var(--Blue, linear-gradient(180deg, #111f68 0%, #223ece 100%));
	display: flex;
	flex-direction: column;
	gap: 24px;
	h1 {
		font-size: 32px;
		text-align: center;
		font-weight: 700;
		line-height: 100%;
		text-transform: uppercase;
	}
}

.status {
	display: none;
}

.form {
	display: flex;
	flex-direction: column;
	gap: 16px;
	width: 100%;

	input,
	textarea {
		color: var(--white);
		padding: 14px 16px;
		font-size: 16px;
		font-weight: 400;
		line-height: 120%;
		border-radius: 8px;
		border: 1px solid var(--White, #fff);
		background: rgba(255, 255, 255, 0.4);
	}

	button {
		padding: 12px 16px;
		max-width: 610px;
		margin: 14px auto 0 auto;
		width: 100%;
	}
}

.form.active .status {
	display: block;
}

@media (max-width: 991px) {
	.contactez {
		padding: 40px 0;
	}

	.contactez__block {
		padding: 20px 10px;
		gap: 20px;

		h1 {
			font-size: 22px;
		}
	}

	.form {
		button {
			margin: 4px auto 0 auto;
		}
	}
} 

@media (max-width:991px) {
  .company__card-countries {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-animation-name: ticker;
    animation-name: ticker;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-duration: 10s;
    animation-duration: 10s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
  }
} 



@-webkit-keyframes ticker {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }

  100% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0)
  }
}

@keyframes ticker {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }

  100% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0)
  }
}
