* {
  box-sizing: border-box;
}

body {
	margin: 0 ;
	background-color: #99b3cc ;
	background-image:url("/images/mapTop.jpg");
	background-repeat:no-repeat;
	background-attachment:fixed;
	background-position: top ;
	background-size: cover;
}

h1 {
    text-align: center;
    
    font-weight: normal;
    font-family: "Comic Sans MS";
	font-size: 16pt;
	color: #0000CC;
}

.left {
  /* background-color: #2196F3; */
  padding: 20px;
  float: left;
  width: 20%; /* The width is 20%, by default */
}

.left2 {
  /* background-color: #2196F3; */
  display: none;
  padding: 20px;
  float: left;
  width: 20%; /* The width is 20%, by default */
}

.main {
  /* background-color: #f1f1f1; */
  display: block;
  padding: 0px;
  float: left;
  width: 60%; /* The width is 60%, by default */
}

.container {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
 /* padding-top: 56.25%; /* 56.25  16:9 Aspect Ratio */
  aspect-ratio:  16/9 ; 
}

.container2 {
  position: relative;
  width: 100%;
  overflow: hidden;
 /* padding-top: 56.25%; /* 56.25  16:9 Aspect Ratio 
  aspect-ratio:  9/16; */
}

.footer {
  align: center;
  padding: 20px;
}

.lynSelectA {
width: 145pt ;
height: 20pt ;
  -webkit-border-radius: 10pt;
  -moz-border-radius: 10pt;
  border-radius: 10pt;
  font-family: "Comic Sans MS";
  color: #3498db;
  font-size: 12pt;
  padding: 0pt 10pt 3pt 10pt;

}

.lynBtn {
  -webkit-border-radius: 10pt;
  -moz-border-radius: 10pt;
  border-radius: 10pt;
  font-family: "Comic Sans MS";
  color: #ffffff;
  font-size: 12pt;
  background: #3498db;
  padding: 1pt 10pt 2pt 10pt;
  text-decoration: none;
}

.respifrm {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border: none;
}

.right {
  display: block;
  /* background-color: #04AA6D; */
  padding: 20px;
  float: left;
  width: 20%; /* The width is 20%, by default */
}

/* Use a media query to add a break point at 800px: */
@media screen and (max-width: 800px) {
    .main {
    width: 100%; /* The width is 100%, when the viewport is 800px or smaller */ }
   .left  {display: none; }
   .left2 {display: block; width: 50%; }
   .right {width: 50%; } 
  
}