@charset "utf-8";
ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
	overflow: hidden;
  background-color: #6B6560;
font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	font-size:30px;
}
	li {
  	float: right; 
	}
	#home{
	float:left;
	color: #DDDED9;
	}

	li a {
	  display: block;
	 color: #E88476;
	  text-align: center;
	  padding: 30px 20px;
	text-decoration: none;
	}

	li a:hover:not(.active) {
	  background-color: #E88476;
		color: #6B6560;
	}
body{
	margin-right: 8px;
	background-color:#DDDED9;
	font-family:Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";
	font-size:24px;
}
.grid-container {
  display: grid;
  gap: 10px;
	padding: 10px;
}
	#title{
	grid-column: 1 / span 2;
	 grid-row: 1;
	font-family:Segoe, 'Segoe UI', 'DejaVu Sans', 'Trebuchet MS', Verdana, 'sans-serif';
	font-size: 60px;
	color: #6B6560;
	padding:8px;
	padding-left:30px;
	border-bottom: 8px solid #F5EFA4;
	border-left: 8px solid #F5EFA4;
	border-radius: 3px;
	width: 825px;
}
	.about{
	grid-column: 1 / span 2;
	 grid-row: 2;
	font-family:Segoe, 'Segoe UI', 'DejaVu Sans', 'Trebuchet MS', Verdana, 'sans-serif';
	font-size: 45px;
	color: #E88476;
	padding: 8px;
	padding-left:50px;
	border-left: 8px solid #F5EFA4;
	border-radius: 3px;
	}
	.logo{
		  grid-column: 3;
	  grid-row: 1 / span 2;
		width:185px;
		height:185px;
		position: relative;
		top: -100px;
		left: 100px;
	}
	.portrait{
		border:8px solid #F5EFA4;
		 grid-column: 3;
	  grid-row: 2 / span 2;
		width:475px;
		height:575px;
		}

	.flex-container{
		grid-column: 1 / span 2;
	 	grid-row: 3;
		display:flex;
		padding: 8px;
		padding-left:50px;
		padding-right:15px;
		border-left: 8px solid #F5EFA4;
		border-radius: 3px;
	}

.vertl{
	border-left: 8px solid #F5EFA4;
  	height: 500px;
	border-radius: 3px;
	padding-left:30px;
	position: absolute;
}