body {
   background-color:#081d44;
   padding-top:0;
}
.mag_help_banner {
   background-color:#B0C4DE;
   color:#000000;
   width:100%;
   text-align:center;
   margin-top:0;
   margin-bottom:0;
   padding:0;
}

#main {
   margin-top:0;
   margin-bottom:0;
   background-color:white;
   width:100%;
   height:100%;
   border-style:solid;
   border-width:2px;
   border-color:#202092;
   border-radius: 0px;
}
#main h1 {
   text-align: center;
   color: #202092;
   font-size:large;
}
#main h2 {
   font-size:large;
   font-weight:bold;
}

.center_div {
   margin: 0 auto;
}


h1.menu {
   font-size:12px;
   text-align:left;
   background-color:#C3CCF5;
}
.div_one {
   margin-left: 20px;
}
.div_two {
   margin-left: 15px;
}

#body_div {
   max-width:650px;
   height:100%;
   margin:0 auto;
   padding-left:10px;
   padding-right:10px;
   font-family: ariel,helvetica,san serif;
   font-size:14px;
}

img.figures {
   width:600px;
   border-style: solid;
   border-width: 1px;
   border-radius: 3px;
   display: block;
   margin-left: auto;
   margin-right: auto;
   padding: 10px;
}
img.logo {
   width:100px;
   border:0px;
   display: block;
   margin-left: auto;
   margin-right: auto;
   padding: 10px;
}
a {
   text-decoration:none;
   color:blue;
}
a:hover {
   text-decoration:underline;
   color:red;
}

.button_sim {
  font: bold 11px Arial;
  text-decoration: none;
  text-align: left;
  color: #333333;
  background-color: #EEEEEE;
  padding: 4px 6px 3px 6px;
  border-top: 1px solid #B3B3B3;
  border-right: 1px solid #333333;
  border-bottom: 1px solid #333333;
  border-left: 1px solid #B3B3B3;
  border-radius: 3px;
}

select {
  background-color: #E6E6E6;
  color: #000000;
}

/* Side navigation menu */

#menuSideNav {
   border: 2px solid #081d44;
}
.sidenav {
   font-family: ariel,helvetica,san serif;
   font-size:12px;

   height: 100%; /* 100% Full-height */
   width: 0; /* 0 width - change this with JavaScript */
   position: fixed; /* Stay in place */
   z-index: 1; /* Stay on top */
   background-color: #e8effc;
   overflow-x: hidden; /* Disable horizontal scroll */
   transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}
/* if screen is wide enough, don't hide the side menu */
@media screen and (min-width: 1080px) {
   .sidenav {
      width:250px;
      font-family: ariel,helvetica,san serif;
      font-size:12px;

      height: 100%; /* 100% Full-height */
      position: fixed; /* Stay in place */
      z-index: 1; /* Stay on top */
      background-color: #e8effc;
      /*overflow-x: hidden; /* Disable horizontal scroll */
      /*padding-top: 5px; /* Place content 60px from the top */
      /*transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
   }
}

/* The navigation menu links */
.sidenav a {
   padding: 2px 2px 2px 8px;
   width:190px;
   font-family: ariel,helvetica,san serif;
   font-size:12px;
}

/* When you mouse over a navigation link, change its color */
.sidenav a:hover, .offcanvas a:focus{
    color: red;
}
/* Position and style the close button (top right corner) */
.sidenav .closebtn {
    font-size: 36px;
    margin-top:5px;
}
a.closebtn:hover {
   text-decoration:none;
}

/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
/*
#main {
    transition: margin-left .5s;
    padding: 20px;
}
*/

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
    .sidenav {padding-top: 15px;}
}
@media screen and (max-width: 660px) {
    .mag_help_banner h1 {font-size:16px;font-weight:bold;}
}
@media screen and (max-width: 400px) {
    .mag_help_banner h1 {font-size:14px;font-weight:bold;}
}
@media screen and (max-width: 320px) {
    .mag_help_banner h1 {font-size:12px;font-weight:bold;}
}
