@charset "UTF-8";
/* CSS Document */

body {
	font-family:"Nunito Sans", sans-serif;
    margin:auto;
    max-width:1000px;
	background-color:#999999;
	font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-variation-settings:
      "wdth" 100,
      "YTLC" 500;
	font-size:16px;
	min-width: 320px;
	padding:10px;
}
body.individualPage {
	font-family:"Nunito Sans", sans-serif;
    margin:auto;
    max-width:800px;
	background-color:#555555;
	font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-variation-settings:
      "wdth" 100,
      "YTLC" 500;
	font-size:16px;
	padding: 10px;
}
* {
	box-sizing: border-box;
}
a {
    color:darkorange;
    text-decoration:none;
}
h1 {
    font-size: 3rem;
	letter-spacing: -1.5px;
	font-family: "Nunito Sans", sans-serif;
    font-weight: 800;
    font-style: normal;
	line-height: 1.25;
	margin-bottom:0px;
	font-variant-numeric:oldstyle-numbers;
}
.individualPage h1 {
	color: #fff;
}
h2 {
	font-size:150%;
	padding-bottom:0px;
	padding-top:5px;
	margin-bottom:0px;
	color:white;
}
h3 {
	font-size:125%;
	font-family:"Nunito Sans", sans-serif;
	font-weight:500;
	width:100%;
	margin: 30px 0 10px;
}
p {
    width:100%;
    padding-top:0px;
	margin-top:10px;
	font-size:100%;
}
.intro {
    font-size:200%;
	letter-spacing:-0.25px;
}
.name {
    color:darkorange;
	letter-spacing:.25px;
	margin-top: 25px;
	padding-top: 0px;
}
.job {
    padding-top:0px;
	letter-spacing: 0.33px;
    color:rgb(200, 200, 200);
	margin-top:5px;
}
.flex-table {
    display:flex;
    padding:0px;
	flex-wrap:wrap;
	gap:10px;
}
.flex-table > a.card {
	display:flex;
	background-color:#333;
    padding:20px;
	border-radius:10px;
	box-shadow:0px 0px 25px rgba(0, 0, 0, 0.25);
	flex-wrap:wrap;
	flex-grow:2;
	flex-basis:100%;
	align-items: start;
	justify-content:center;
	text-align:center;
	gap:0px 20px;
	box-sizing:border-box;
}
div.profile {
	flex: 1 0 100%;
	width: 130px;
}
div.person {
	flex: 1 0 100%;
	width: 200px;
}
div.footer {
	height:60px;
}
iframe.yo {
    width:100%;
    /*max-width:760px;*/
    height:600px;
    float:left;
    background-color:rgba(243, 243, 243);
    padding:20px;
    border:0px solid;
	border-radius: 10px;
    box-shadow:0px 0px 25px rgba(0, 0, 0, 0.5);
    margin:10px 10px 20px 0px;
}
iframe.yo.taller {
	height: 725px;
}
img.profile {
    width:125px;
    height:125px;
    border-radius:50%; 
}
button {
    padding:10px 5px;
    background-color:darkorange;
    margin-top:10px;
    font-color:white; 
    border:0px solid darkorange;
    border-radius:3px;
}
button.second {
    background-color:lightgray;
    margin-left:100px;
}

@media (min-width:601px) {
	.flex-table > a.card {
		justify-content: flex-start;
		text-align: left;
		flex-wrap: nowrap;
		flex-basis: calc(50% - 20px);
	}
	div.profile {
		flex: 0 1 130px;
	}
	div.person {
		flex: 0 1 200px;
	}
}
@media (min-width:801px) {
	.flex-table > a.card {
		max-width: calc(50% - 20px);
	}
}