@font-face {
  src: url(/font/Rubik.woff2);
  font-family: 'Rubik';
  font-display: swap;
}

body {
	font-family: 'Rubik', sans-serif;
	background-color: #e4e4e4;
}

#header {
	font-size: 0.9rem;
	font-weight: 700;
}

#header a {color: gray;}
#cards a {color: #000}
#header img {width: 140px}

.offer .card-item {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
}

.card-item .btn {
	width: 90%;
	background-color: #77b41f;
	color: #fff;
	white-space: pre;
	border-radius: 40px;
	padding: 15px 0;
	margin: 20px auto 10px auto;
	font-weight: 500;
}

.card-item .url, .mfo-item .url {
	color: #0d6efd;
	font-weight: 400;
	text-decoration: underline;
}
.card-item .url {font-size: 0.9rem}

.card-item .url:hover {
	text-decoration: underline;	
}

.card-item .summa-time {font-size: 1.3rem}

.all img {width: 100%}

.card-item:hover {
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}

.mfo-item table {border: 7px solid #fff; box-shadow: rgba(0, 0, 0, 0.04) 0px 3px 5px;}
.mfo-item > a, a.offer {text-decoration: none;}

/* footer */
#footer {
	font-size: 0.9rem;
}
#footer a {color: #66b41f;}

/* appAlert */
.alertA {
	position: fixed;
	display: flex;
	align-items: center;
	left: 5%;
	bottom: 5%;
	z-index: 999;
	font-size: 16px;
	border-radius: 5px;
	padding: 10px 15px;
	box-shadow:  3px 2px 10px 1px rgba(45,45,45,.2);
	background-color: rgb(245, 248, 251);
	cursor: pointer;
	visibility: hidden;
	opacity: 0;
	transition: opacity 0.3s;
}

@media (min-width: 992px) {
	.all .btn {
		width: 200px;
		margin: 0;
	}	
	.all img {width: 150px}
}

@media (max-width: 768px) {
	.alertA {
		left: 0;
		bottom: 0;
		right: 0;
		justify-content: center;
		border-radius: 0;
	}
	
	#header img {width: 100px}
	
	.card-item .summa-time {font-size: 0.85rem}
	.uform_activate {max-width: 100px}
}