:root{
    --global-font-family: Arial, sans-serif;
    --h1-font-family: Copperplate, Arial, sans-serif;
    --rounded: 20px;
    /*COLOR SCHEME 1*/
    /*
    --colord1: #FFD9DA;
    --colord2: #EA638C;
    --colord3: #89023E;
    --colord4: #30343F;
    --colord5: #1B2021;
    */

    
    /*COLOR SCHEME 2*/
    
    --colord1: #FFD9DA;
    --colord2: #EA638C;
    --colord3: #5A213E;
    --colord4: #30343F;
    --colord5: #1B2021;
    
}
html{
	height: 100%;
  	width: 100%;
  	margin: 0px;
  	background-color: var(--colord3, black);
}
body{
  	margin: 0px;
  	background-color: var(--colord3, black);
}
.hero{
	max-width: 200px;
	float: right;
}
.topnav{
	margin: 0%;
	padding: 0px;
	position: fixed;
	z-index: 4;
  	overflow: hidden;
	width: 100%;
  	background-color: var(--colord3, black);
  	box-shadow: 0px 10px 10px var(--colord3, black);
    
}

.topnav a{
	float: right;
	color: var(--colord1, white);
	text-align: center;
	text-decoration: bold;
	font-family: var(--global-font-family, sans-serif);
	font-size: 20px;
	padding: 20px 20px;
}

.topnav a:hover{
  	background-color: var(--colord1, lightpink);
  	color: var(--colord5, black);
}

.topnav p{
  	float: left;
  	color: var(--colord1, white);
  	text-align: center;
  	text-decoration: none;
  	font-family: var(--global-font-family, sans-serif);
  	font-size: 16px;
  	padding: 2px 2px;
}

.logo a{
  	float: left;
  	padding: 2px 2px;
}

.side_float{
  	overflow: hidden;
  	float: left;
  	width: 45%;
  	padding: 25px;
  	text-align: center;
  	font-family: var(--global-font-family, sans-serif);
  	background-color: var(--colord1, gray);
  	border-radius: var(--rounded, 20px);
  	box-shadow: 0px 4px 8px var(--colord5, black), 0px 6px 20px var(--colord4, gray);
  	margin: auto;
}

.center_float{
  	overflow: hidden;
  	display: inline-block;
  	float: top;
  	width: 95%;
	margin: auto;
  	padding: 25px;
  	text-align: center;
  	font-family: var(--global-font-family, sans-serif);
  	background-color: var(--colord1, gray);
  	border-radius: var(--rounded, 20px);
  	box-shadow: 0px 4px 8px var(--colord5, black), 0px 6px 20px var(--colord4, gray);
}

.section1_parent{
  	overflow: hidden;
  	width: 100%;
  	margin: auto;
  	padding: 100px;
  	background-color: var(--colord2, yellow);
}
.section2_parent{
  	overflow: hidden;
  	width: 100%;
  	margin: auto;
  	padding: 15px;
  	background-color: var(--colord3, green);
}

.pink_transition{
	background-image: "IMG_7978.jpg";
    background-size: contain;
    background-repeat: no-repeat;
    width: 100%;
    height: 0;
    padding-top: 66.64%; /* (img-height / img-width * container-width) */
                /* (853 / 1280 * 100) */
}
.triplet_col{
	overflow: hidden;
  	float: top;
  	width: 75%;
  	margin: auto;
  	padding: 15px;
  	background-color: var(--colord1, white);
}

.col_blurb{
	width: 30%;
  	float: left;
  	padding: 1%;
  	font-family: var(--h1-font-family, sans-serif);
}
.img{
  	min-width: 100%;
  	min-height: 100%;
  	width: auto;
  	height: auto;
}

.h1{
  	font-size: 40px;
  	text-decoration: bold;
  	font-family: var(--h1-font-family, sans-serif);
}

.p{
  	font-family: var(--global-font-family, sans-serif);
  	font-size: 16px;
}