* {
				box-sizing: border-box;
				/*background-color: rgb(255 255 255 / 50%);*/
			}
			body {
				/*background-image: url("./images/bgleave1.gif");
				background-repeat: repeat-xy;
				background-opacity:50%;*/
				font-family: "Consolas", monospace;
				color: var(--text);
				padding: clamp(24px, 4vw, 60px);
			}

			:root {
				--gap: clamp(18px, 2vw, 40px);
				--body-size: clamp(15px, 1.15vw, 24px);
				--section-size: clamp(22px, 1.7vw, 38px);
				--title-size: clamp(22px, 1.7vw, 44px);
			}
			.container {
				max-width: 1450px;
				margin:auto;
			}
			
			ul {
  				padding-left: 0;
 				margin: 0; /* lol inbdebt*/
			}


			.main {
				display:flex;
				gap: clamp(30px, 3vw, 60px);
				align-items: flex-start;
			}

			.personal {
				display: flex;
				gap: clamp(18px, 1.5vw, 28px);
				align-items: stretch;
			}

			.frog {
				width: clamp(130px, 13vw, 240px);
				overflow: hidden;
				flex-shrink: 0;
			}
			.frog img {
				width: 100%;
				height: 100%;
				object-fit:contain;
				display: block;
			}

			.whomst {
				flex: 1;
				display: flex;
				flex-direction: column;
				gap: clamp(10px, 1vw, 18px);
				min-width: 0;
			}

			.intro {
				font-size: var(--title-size);
				line-height:1.4;
			}

			.intro2 {
				font-size: var(--body-size);
				line-height: 1.4;
			}

			.intro strong {
				color: var(--dark);
				font-weight:800;
			}

			.pics {
				width:100%;
				overflow: hidden;
			}

			.pics img {
				width: 100%;
				/*vertical-align:baseline;*/
				object-fit: cover;
				display:block;
			}

			hr {
				border: none;
				border-top: 1px solid #bbb;
				margin:clamp(24px, 2vw, 36px) 0;
			}

			.links {
				display: grid;
				grid-template-columns: repeat(3, 1fr);
				gap: clamp(30px, 3vw, 60px);
			}

			.sectHeader {
				font-size: var(--section-size);
				color: black;
				margin-bottom: 18px;
				font-weight: 800;
			}

			ul {
				list-style: none;
			}

			.links li {
				margin-bottom: 10px;
			}
			.links a {
				text-decoration: none;
				color: black;
				font-size: var(--body-size);
			}
			
			.links a:hover {
				color: #bbb;
			}

			@media (max-width: 950px) {
				.main {flex-direction: column;}
				.blog {width: 100%;}
			}

			@media (max-width: 700px) {
				.personal 	{flex-direction: column;}
				.frog 	{width: 100%; max-width: 260px;}
				.links 		{grid-template-columns: 1fr;}
			}