.poppins-regular {
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.poppins-bold {
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-style: normal;
}
* {
	padding:0px;
	margin:0px;
	border:none;
}
body, html {
	width:100%;
	height:100%;
}
body {
	background-color:#d9d9d9;
	color:#df3327;
	font-family:"Poppins", Verdana, Arial, Helvetica, sans-serif;
	font-size:24px;
}

#logo img {
	width:225px;
	height:auto;
}
#social img {
	width:71px;
	height:auto;
}

#team {
	display: flex;
  	justify-content: flex-start;
	flex-wrap: nowrap;
	position:relative;
	margin-top:100px;
	margin-bottom:40px;
}
#team > div {
	transform: skew(-27deg);
	background-color:#df3327;
	width: 100%;
  	max-width: 100%;
	min-width:300px;
  	flex: 1 1 450px;
	padding:20px 50px;
	border:1px solid white;
}
#team > div .content {
	transform:skew(27deg);
	color:#FFF;
}
#team > div:first-child {
	border-left:none;
	padding-left:0px;
}
#team .content p {
	text-align:right;
	text-transform:uppercase;
}
#team .content p a, #portfolio a {
	color:#FFF;
	text-decoration:none;
}
#team .content h2 {
	text-align:left;
	font-size:24px;
	margin-bottom:44px;
	text-transform:uppercase;
}
#team::before {
	content:"";
	width:50%;
	position:absolute;
	top:0px;
	left:0px;
	bottom:0px;
	right:50%;
	transform:translateX(-50%);
	background-color:#df3327;
	border:1px solid white;
	border-right:none;
}

#logo::after {
	content:"";
	width:100vw;
	height:0px;
	border-bottom:2px solid #df3327;
	position:absolute;
	top:auto;
	left:0px;
	bottom:-10px;
}
#logo {
	position:relative;
	margin-left:220px;
	padding-left:20px;
}

#contacts {
	display:grid;
	grid-template-columns:1fr 1fr 1fr 290px;
}
#contacts a {
	color:#df3327;
	text-decoration:none;
}
#contacts p {
	padding-top:20px;
	border-top:2px solid #df3327;
}
#contacts p#social {
	padding-top:0px;
	border:none;
	text-align:center;
}
#contacts p#social a img {
	margin:-15px 5px 0 5px;
}

#portfolio {
	width:100%;
	text-align:right;
	margin-bottom:80px;
	position:relative;
}
#pfHolder {
	width:100%;
	max-width:790px;
	background-color:#df3327;
	margin-left:auto;
	padding:55px;
	padding-left:75px;
	text-align:left;
	transform: skew(-27deg);
	border:1px solid #FFF;
	border-right:none;
}
#pfHolder a {
	font-weight:bold;
	display:inline-block;
	width:230px;
	text-transform:uppercase;
	transform: skew(27deg);
	padding-left:80px;
	background-image:url(i/ico_pf.svg);
	background-repeat:no-repeat;
	background-position:left center;
	background-size:63px auto;
}

#portfolio::after {
	content:"";
	width:50%;
	position:absolute;
	top:0px;
	left:auto;
	bottom:0px;
	right:0px;
	transform:translateX(50%);
	background-color:#df3327;
	border:1px solid white;
	border-left:none;
}

a {
	opacity:1;
	transition:opacity 0.3s ease;
}
a:hover {
	opacity:0.6;
}

#page {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  box-sizing: border-box;
  position:relative;
  overflow:hidden;
}

#pageContent {
  width:90%;
  max-width:1350px;
  margin-top:50px;
  margin-bottom:50px;
}

@media screen and (max-width: 1200px) {
	
	#pageContent {
		margin-top:5vw;
	}
	#team {
		display:block;
	}
	#team > div {
		display:block;
		border-left:none;
		width:25em;
		max-width:80%;
		border-top:none;
		padding-left:0px;
	}
	#team > div:first-child {
		border-top:1px solid #FFF;
	}
	#logo {
		margin-left:0px;
		padding-left:0px;
	}
	#pfHolder {
		padding:55px;
		padding-right:0px;
	}
	#contacts {
		display:block;
	}
	#contacts p {
		border:none;
	}
	#contacts p#social {
		text-align:left;
	}
	#contacts p#social a img {
		margin-top:35px;
	}
	
	
}