div.container {
  position: relative;
}


/*Margin by percentage:*/

.topnav {
 
  overflow: hidden;
  margin-left: calc(20% + 150px);
  margin-right: 20%;
  font-size: 14px;  
}

section {
  /* position is static by default */
  margin-left: 20%;
  margin-right: 20%;
  margin-top: 50px;
  margin-bottom: 50px;

}

h1.normal {
	font-size:45px;
}

h2.normal {
	font-size:22px;
}

p.normal {
	font-size:15px;
}


.header_name {
	margin-left: 20%;
	width: 100px;
    font-size: 14px;
	}

	.IFrameWrap { 
		width: 40vw;
		height: 40vw;

	}
	
	.PictureSize {
		width: 155px;
		height: 155px;	
	}
	

	
/*Margin by pixel:*/
@media screen and ( max-width: 620px ) {
	h1.normal {
		font-size:30px;
	}

	h2.normal {
		font-size:15px;
	}

	p.normal {
		font-size:10px;
	}

	.PictureSize {
		width: 25vw;
		height: 25vw;	
	}

	section {
	  /* position is static by default */
		margin-left: 10px;
		margin-right: 10px;
		margin-top: 10px;
		margin-bottom: 10px;

	}
	
	.topnav {
	  overflow: hidden;
	  margin-right: 10px;
	  margin-left: 67px;
      font-size: 8px;
	}
	
	.header_name {
		margin-left: 10px;
        font-size: 8px;
		width: 50px;
	}

	.IFrameWrap { 
		width: calc(50vw - 10px);
		height: calc(50vw - 10px);
	}

/*	.PictureWrap { 
		width: calc(40vw - 10px);
		height: calc(40vw - 10px);
	}
*/	
}

@media screen and ( min-width: 620px ) and ( max-width: 1000px ){
	section {
	  /* position is static by default */
		margin-left: calc(50% - 300px);
		margin-right: calc(50% - 300px);
		margin-top: calc(11% - 58px);
		margin-bottom: calc(11% - 58px);

	}
	
	.topnav {
	  overflow: hidden;
	  margin-right: calc(50% - 300px);
	  margin-left: calc(35% - 150px);
	}
	
	.header_name {
		margin-left: calc(50% - 300px);
	}
	.IFrameWrap { 
		width: calc(300px + 100 * ((100vw - 620px) / 380));
		height: calc(300px + 100 * ((100vw - 620px) / 380));
	}
/*	.PictureWrap { 
		width: calc(238px + 100 * ((100vw - 620px) / 380));
		height: calc(238px + 100 * ((100vw - 620px) / 380));*/
	}

}

@media screen and ( min-width: 400px ) and ( max-width: 700px ){
	h1.normal {
		font-size:calc(30px + 15 * ((100vw - 400px) / 300));
	}

	h2.normal {
		font-size:calc(15px + 7 * ((100vw - 400px) / 300));
	}

	p.normal {
		font-size:calc(10px + 5 * ((100vw - 400px) / 300));
	}

	.topnav {
      font-size: calc(8px + 6 * ((100vw - 400px) / 300));
	}
	
	.header_name {
        font-size: calc(8px + 6 * ((100vw - 400px) / 300));
	}
	

	
}


.topnav a {
	float: right;
	color: #979A9A;
	text-align: center;
	padding: 1em 1em;
	text-decoration: none;
	background-color: white;
	transition: 0.3s
}

.topnav a:hover {
	background-color: white;
	color: #D32B08;
}

.topnav a.active {
	background-color: white;
	color: #D32B08;
}


.header_name {
	float: left;
	text-align: left;
	padding: 1em 1em;
	background-color: white;
	color: #D32B08;
	font-family:"Helvetica"
}


footer {
  position: fixed;
  bottom: 0;
  left: 0;
  padding: 1em;
  height: 1em;
  background-color: white;
  color: #979A9A;
  width: 100%;
  text-align: center;
}

table.main_columns {
    table-layout: auto;
	width: 100%;
    border-collapse: collapse;
    border: 0px solid black;
}

table.main_columns th, table.main_columns tr {
  border: 0px solid black;
  text-align: left;
  vertical-align: top;
  padding-bottom: 50px;
}

table.main_columns tr th:nth-child(1){
    width: 30%;
}

table.main_columns tr th:nth-child(2){
	padding-left:10%
}


h1 {
	font-family: "Libre Baskerville", serif;
	font-weight: normal
}

h1.normal {
	color: black;
	padding-top: 1em;
	padding-bottom: 1em;
}

h1.large_black {
	padding-top: 0.5em;
	color: black;
	font-size:2.5vw;
}

h1.large_red {
	padding-top: 0.5em;
	color: #D32B08;
	font-size:2.5vw;
	text-align: right;
}

h2 {
	font-family: "Libre Baskerville", serif;
	font-weight: normal
}

h2.normal {
	color: black;
}

red {
	color: #D32B08;
}


p {
	font-family: "Titillium Web", sans-serif;
	font-weight: normal
}

p.normal {
	color: black;
}

p.subtext {
	font-size:1.5vw;
	text-align: left;
}}	

body {
	margin-top: 0px;
  margin-bottom: 0px;
}

div.container {
    width: 100%;
    border: 0px solid gray;
}

.IFrameWrap { 
  position: relative;
  overflow: hidden;
  resize: both;
}

.IFrameWrap iframe, .IFrameWrap object, .IFrameWrap embed {
  postion: absolute;
  top: 0;
  left: 0;
  width: 100%; 
  height: 100%; 
}