body{font-family: eb-garamond|poppins|Pacifico|Great+Vibes|Lato; margin: 0px; background-image: linear-gradient( #f2a355, #f2cf55, #fdcb3a); background-repeat: repeat; background-size:100%}
a:link {text-decoration: none; color: none}
a:hover {text-decoration:none; cursor:pointer}
.responsive {width: 100%; height: auto;}


.video-container {position: absolute; top: 0; bottom: 0; width: 100%; height: auto; overflow: hidden;    }
   .video-container video { /* Make video to at least 100% wide and tall */ min-width: 100%; min-height: 100%;
      /* Setting width & height to auto prevents the browser from stretching or squishing the video */
      width: auto; height: auto;
      /* Center the video */
      position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}

.menu{width: 70%; margin-left: 15%; margin-right: 15%; position: relative; text-align: center; align-content: center color: white; overflow: hidden;}

.round_box{width:300px; height:300px; border-radius:50%; font-size:275%; font-family: "Great Vibes"; color: #ffed23; text-align: center; line-height: 90%; padding:8px; border:solid; border-width:5px; border-color:#fff; display: flex; justify-content: center; align-items: center; margin-top:15%; margin-left: 70%; background-color: #3f5aa7;}

.main{width:70%; align-items: center; text-align:center; justify-content: center;  font-family:"Lato"; text-align: justify; font-size:110%; line-height: 140%; font-weight: 400; margin-left: 15%; margin-right: 15%;}
.headline{font-family: "Great Vibes"; width: 100%; font-size: 300%; line-height: 100%; text-align: center; margin-top: 3%; margin-bottom: 2%; height: auto; color: #fff}
.intro{background-color: #ef387a; color: #fff; padding: 1%; font-weight: 600; text-align: center; border-top: solid; border-top-width:1px; border-top-color: #fff; border-bottom: solid; border-bottom-width:1px; border-bottom-color: #fff; margin-top: 2%; margin-bottom: 2%; border-radius: 10px}
.tab{background-color:#054489; color: #fff; text-transform: uppercase; padding: 0.5%; margin: 0.5%; font-size: 60%}
.story_im{width: 100%; height:auto; margin-bottom: 3%; margin-top: 2%}
.top_ad{width: 18.5%; float: left; border:solid; border-width: 1px; border-color: #fff; margin: 0.5%; margin-bottom: 5%; text-align: center; display: inline-block; height: 60px; align-items: center; justify-content: center; display: flex;}
.left{width:15%; float: left; top:0; left:0; text-align: center; position: fixed; padding-top: 2%}
.right{width:15%; float: left; top:0; right:0; text-align: center; position: fixed; padding-top: 2%; align-items: center}
.pagination{margin-top: 3%; text-align: center; margin-bottom:3%}
.count{padding:0.25% 0.75%; background-color: brown; color: white; font-family: 'Lato'; margin: 0.25%; font-size:75%; font-weight: bold}
.section_name{font-size:200%; color: maroon; font-weight: bolder; font-family:'Great Vibes'; text-align: center; margin-top: 3%; margin-bottom: 2%; height: auto;}
.subhead{font-size:150%; color:#fff; background-color: darkcyan; text-transform: uppercase; padding: 0.5% 0.5%; margin-top: 2%; border-bottom:solid; border-bottom-width: 3px}
.st4{width: 23%; float: left; margin-left: 1%; margin-right: 1%; margin-bottom: 3%; border-bottom:solid; border-bottom-width:3px; border-bottom-color:#fff}
.st4_im{width: 100%; padding-top: 3%; margin-bottom:0.5%; padding-bottom: 2%; height:150px; overflow: hidden}
.st4_txt{width: 100%; padding-top: 3%; margin-bottom:0.5%; text-align: center; font-family: 'Great Vibes'; font-size:120%; font-weight: bold; line-height: 125%; color:#b33817; padding-bottom: 3%; overflow: hidden}

.topnav {
  overflow: hidden;  background-image: url("../img/lady.png"); background-attachment: fixed; background-size: 100%;
	background-color: rgba(161. 197, 224, 0.8;)
}

.topnav a {float: left; display: block; color: #21475a; text-align: center; padding: 6px 8px; text-decoration: none; ont-size: 17px; font-family:"Lato"; text-transform: uppercase; font-weight: bolder}

.topnav a:hover {
   color: #cc4d2b;
}

.topnav a.active {
   background-image: url("../img/lady.png"); background-attachment: fixed; background-size: 100%;
  color: white;
}

.topnav .icon {
  display: none;
}

@media screen and (max-width: 600px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
}

@media screen and (max-width: 600px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }



@media only screen and (max-width: 620px) {
  /* For mobile phones: */
	.menu{width: 100%; margin: 0}	
	.topnav a {float: left; display: block; color: #fff; text-align: center; padding: 14px 16px; text-decoration: none; ont-size: 17px; font-family:"Lato"; text-transform: uppercase;}
		
		.round_box{width:200px; height:200px; border-radius:50%; font-size:200%; font-family: "Great Vibes"; color: #ffed23; text-align: center; line-height: 90%; padding:8px; border:solid; border-width:5px; border-color:#fff; display: flex; justify-content: center; align-items: center; margin-top:20%; margin-left: 35%; background-color: #3f5aa7; position: fixed}
	.main{width:98%; margin: 0px; padding: 1%; font-size:90%}
	.headline{font-size: 200%; margin-top: 5%}
	.intro{margin-top: 5%; margin-bottom: 5%; font-size: 90%; line-height: 125%; padding: 2%}
	.top_ad{ height: 30px; background-color: white; width: 18%}
	.left {display: none}
	.right {display: none}
	.subhead{font-size:120%; }
	.st4{width: 48%; float: left}
	.st4_im{width: 100%; padding-top: 3%; margin-bottom:0.5%; padding-bottom: 3%; height:100px; overflow: hidden}
	
}