@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Merriweather&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap');

* {
    box-sizing: border-box;
}

html,
body {
	margin: 0;
	padding: 0;
	background-color: red;
}

a {
  text-decoration: none;
}

.social__ref {
	width: 45px;
	height: 40px;
	color: #D9D9D7 ;
	margin: 0 5px;
}

.st0
{fill:#D9D9D7;}

h1 {
	margin: 0;
	padding: 0;
	font-family: Work Sans;
}

h2 {
	margin: 0;
	padding: 0;
	font-family: Work Sans;
}

h1.title {
	color: #F22F1D;
	font-size: 96px;
	#text-align: center;
	font-weight: 700;
	text-shadow: 0px 0px 20px #0D0D0D;
}

p.subheader {
	margin: 0;
	color: #F22F1D;
	font-size: 36px;
	# text-align: center;
	font-family: Work Sans;
	font-weight: 400;
	text-shadow: -1px 0 15px #0D0D0D, 0 1px 15px #0D0D0D, 1px 0 15px #0D0D0D, 0 -1px 15px #0D0D0D;
}

.landing {
	height: 100vh;
	max-height: 1000px;
	width: 100%;
	background-color: #0D0D0D;
	background-image: linear-gradient(to right, transparent, #0D0D0D max(49%, 600px)), url(./sources/compress/mosaic.webp);
	background-size: auto 100%;
	background-attachment: fixed;
}

.right_landing {
	margin-left: auto; 
	margin-right: 0;
	height: 100%;
	width: max(70%, 700px);
	max-width: 100%;
	min-width: 50%;
	display: flex;
	align-items: center;
}

button.buy_button {
	margin: 0;
	#margin-left: 10%;
	margin-top: 10px;
	display: flex;
	align-items: center;
	color: #D9D9D7;
	background-color: #8C1B11;
	border: 0;
	border-radius: 80px;
	padding: 5px 24px;
	font-size: 36px;
	font-family: Work Sans;
	font-weight: 700;
	transition-duration: 0.6s;
	box-shadow: 0 0px 16px 0 #0D0D0D;
	cursor: pointer;
}

.ass {
	width: 100%;
}

.buy_button__icon {
	height: 40px;
	width: 40px;
	float: right;
	padding-left: 10px;
	overflow: visible;
	display: flex;
	align-items: center;
} 



button.buy_button:hover {
  background-color: #4CAF50;
  color: white;
}

div.placeholder {
	height: auto;
	background-color: #8C1B11;
}

div.post {
	width: 90%;
	min-width: 200px;
	max-width: 1600px;
	margin: 0 auto;
	padding: 50px 0px;
}

div.flexbox {
	height: 100%;
	display: flex;
	flex-wrap: wrap;
        align-items: stretch;
}

div.post_text{
	width: max(80%, min(100%, 300px));
	min-width: 100px;
	max-width: 500px;
	padding: 10px;
	margin: 0 auto;
}

div.images {
	width: 100%;
	min-width: 100px;
	max-width: 500px;
	margin: auto auto;
	/* height: 400px; */
	/* background: white; */
	padding: 10px;
}

h1.post {
	color: #0D0D0D;
	font-size: 64px;
	#text-align: center;
	font-weight: 700;
	padding-top: 60px;
}

h2.post {
	font-size: 46px;
	#text-align: center;
	font-weight: 700;
	padding-top: 60px;
}

p.post {
	/* text-align: justify;*/
	color: #0D0D0D; /* #D9D9D7; */
	font-size: 24px;
	font-family: 'IBM Plex Sans', sans-serif;
	font-weight: 400;
}

.team {
	background-color: #0D0D0D;
	color: white;
}

img.avatar {
	height: 200px; 
	border-radius: 100%;
}

div.bottom_edge {
	border-bottom-width: 4px;
	border-bottom-style: dashed;
	margin-bottom: 50px;
}

div.questions {
	width: min(700px, 100%);
	/*width: 60%;*/
	margin: 0 auto;
	color: #D9D9D7;
}

a.light {
	color: #F22F1D;
}

a.light:visited {
	color: #F22F1D;
}

a.dark {
	color: #400C08;
}

a.dark:visited {
	color: #400C08;
}

.team__members {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.team__member {
	/* margin: 0 10px; */
	width: max(20vw, 250px);
}

.team__images {
	height: 250px;
}

.team__name {
	/* height: 50px; */
	font-size: 36px;
	font-family: Work Sans;
	font-weight: 600;
}

/* .member__descr {
	width: 100%;
} */

p.member__descr {
	font-size: 20px;
	font-weight: 400;
}