body {
 margin:0; padding:0;
}

@font-face {
    font-family: 'Lato';
    src: url('fonts/Lato-Light.eot');
    src: url('fonts/Lato-Light.eot?#iefix') format('embedded-opentype'),
        url('fonts/Lato-Light.woff2') format('woff2'),
        url('fonts/Lato-Light.woff') format('woff'),
        url('fonts/Lato-Light.ttf') format('truetype'),
        url('fonts/Lato-Light.svg#Lato-Light') format('svg');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('fonts/Lato-Black.eot');
    src: url('fonts/Lato-Black.eot?#iefix') format('embedded-opentype'),
        url('fonts/Lato-Black.woff2') format('woff2'),
        url('fonts/Lato-Black.woff') format('woff'),
        url('fonts/Lato-Black.ttf') format('truetype'),
        url('fonts/Lato-Black.svg#Lato-Black') format('svg');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('fonts/Lato-Regular.eot');
    src: url('fonts/Lato-Regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/Lato-Regular.woff2') format('woff2'),
        url('fonts/Lato-Regular.woff') format('woff'),
        url('fonts/Lato-Regular.ttf') format('truetype'),
        url('fonts/Lato-Regular.svg#Lato-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('fonts/Lato-Bold.eot');
    src: url('fonts/Lato-Bold.eot?#iefix') format('embedded-opentype'),
        url('fonts/Lato-Bold.woff2') format('woff2'),
        url('fonts/Lato-Bold.woff') format('woff'),
        url('fonts/Lato-Bold.ttf') format('truetype'),
        url('fonts/Lato-Bold.svg#Lato-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: 'Monotype Corsiva';
    src: url('fonts/MonotypeCorsiva.eot');
    src: url('fonts/MonotypeCorsiva.eot?#iefix') format('embedded-opentype'),
        url('fonts/MonotypeCorsiva.woff2') format('woff2'),
        url('fonts/MonotypeCorsiva.woff') format('woff'),
        url('fonts/MonotypeCorsiva.ttf') format('truetype'),
        url('fonts/MonotypeCorsiva.svg#MonotypeCorsiva') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}
.container{ width:90%; margin:0 auto;}
#logo{width:200px; margin:20px 0; float:left;}
#logo img{width:100%; height:auto; display:block;}
.ampopup-content{font-family: 'Lato'; font-size:1.2em;}
.ampopup-content a{ color:#00367e;}
.tagline{ width:auto; float:left; text-align:center; margin:30px 0 0 10px;color:#000; font-family: 'Lato'; font-weight: normal; font-size:30px;}
.tagline span{color:#f81111;}
.tagline h6{ text-align:center; margin:00px 0 0 10px;color:#000;  font-family: 'Monotype Corsiva'; font-weight: normal; font-size:25px; font-style: italic;}
.tagline hr{ background:#efefef; margin:5px 0;}
#chartdiv {
  width: 100%;
  height: 470px;
}
.ampopup-header{
  background-color:none;
}

.ampopup-header{
  display: none;
}

#sidebar {
  width: 200px;
  background: #d7e3fb;
  position: absolute;
  height: 100%;
  top: 0;
  right: -200px;
  transition: left 0.5s ease; display:none;z-index:998;  font-family: 'Lato';
}

#sidebar.visible {
  right: 0px; display:block;
  transition: left 0.7s ease;
}

#sidebar ul {
  margin: 0;
  padding: 0;
}

#sidebar li {
  list-style: none;
  
 
}

#sidebar li a {
  text-decoration: none;
  color: white; background: #00367e;
  border-bottom: 1px solid #233140; text-decoration:none; display:block;padding: 10px;  font-family: 'Lato';
}
#sidebar li a:hover{ background:#777;}

#sidebar-btn {
  
  vertical-align: middle;
  width: 20px;
  height: 15px;
  cursor: pointer;
  margin: 20px;
  position: absolute;
  right: 20px;
  top: 0px;display:block; z-index:999;
}

#sidebar-btn span {
  background-color: #00367e;
  height: 2px;
  display: block;
  margin-bottom: 5px;
}

#sidebar-btn span:nth-child(2) {
  width: 75%;
}
#sidebar h4{ padding: 20px 10px; margin:0; color:#00367e;  font-family: 'Lato';}

/* Menu styles
===========================*/

.bottom{ font-size:18px; padding:10px 30px; color:#fff; background:#888; position: fixed; bottom:40px; width:100%; text-align: center;}
.comingsoon{ font-size:4em; padding:0 70px 0 0 ; color:#00367e;  position: absolute; top:45%; left:50%; margin-left:-25%; width:50%; text-align: center; display:block; }
.comingsoon a{ text-decoration:none;color:#f81111;  font-family: 'Monotype Corsiva'; font-weight: normal;
    font-style: italic;  padding:20px;  display:block; text-align:center;background:url(images/home-icon.png) no-repeat; background-position:right;}
.comingsoon a:hover{ color:#000;  }




@media only screen and (min-width:1367px){
	
	#chartdiv {
 
  height: 700px;
}
#logo{width:400px;}	
	.comingsoon { font-size:6em; position: absolute; top:45%; left:50%; margin-left:-35%; width:60%; }
	.home a{ font-size:3em; }
	
	}
@media only screen and (min-width:1767px){
	
	#chartdiv {
 
  height: 850px;
}
	
		.comingsoon { font-size:8em; }
	
	}	

@media only screen and (max-width:736px){
	.tagline{font-size:18px; margin-top:10px;}
	
	#chartdiv {
  width: 100%;
  height: 500px;
}
	#logo{width:100px; }
	
.comingsoon{ font-size:24px; left: 40%;
    margin-left: -40%;
    width: 80%; font-size: 3em;} 

.comingsoon a{ background-size:40px;}}
@media only screen and (max-width:414px){
.comingsoon {
    font-size: 2.4em;
    padding: 0 70px 0 0;
    color: #00367e;
    position: absolute;
    top: 45%;
    left: 50%;
    margin-left: -50%;
    width: 90%;
 }
 #chartdiv {
  width: 100%;
  height: 300px;
}
 }