@charset "UTF-8";
/* CSS Document */

 html {
        /* Size of largest container or bigger */
        min-width: 1080px;
    }
h1{
    font-size:150%;
    font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif
    }
    h2{
    font-size:90%;
    font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, sans-serif
    }
  
.container{
   margin:-10px;
  text-align:center;
  border:2px solid #DFEDFF;
  background-color:#B2D9F9;
  }
  
#yearwrapper{
height:270px;
border:2px solid #DFEDFF;
}

#yearwrapper2{
height:270px;
border:2px solid #DFEDFF;
}

#yearwrapper3{
height:270px;
width:100%;
border:2px solid white;
}


#yearwrapperbottom{
height:270px;
border:2px solid #DFEDFF;
}

#yearwrappermeter{
height:290px;
width:100%;
border: 0;
border-width: 0;
}


#yearChart
{ width:100%;
  height:100%;
}


#predictChart
{ width:100%;
  height:100%;
  }
  
#meter
{ 
  width:100%;
  height:100%;
}
#acceptRateChart
{ width:100%;
  height:100%;
}
#aidChart
{ width:100%;
  height:100%;
}
#enrollmentChart
{ width:100%;
  height:100%;
}
#graduationRateChart6
{ width:100%;
  height:100%;
}
#map_wrapper {
   height:270px;
   width:200px;
   border:2px solid #DFEDFF;
}

#map_canvas {
    width: 100%;
    height: 100%;
    float: left
}

.row {
  height:50%;
  display: flex;
  flex-flow: row wrap;
  margin: 0 -10px;
  margin-top:10px;
  margin-bottom: 10px;
}
.row:last-child {
  margin-bottom: 0;
}
[class*="col-"] {
  padding: 10px;
  width: 100%;
}
 
@media all and ( min-width: 600px ) {
 
  /* set col widths */
  .col-2-3 {
    width: 64%;
  }
  .col-1-2 {
    width: 48%;
  }
  .col-1-3 {
    width: 30.17%;
  }
  .col-7-24 {
    width: 25%;
  }
  .col-1-4 {
    width: 20%;
  }
  .col-1-5 {
    width: 16%;
  }
  .col-1-6 {
    width: 18%;
  }
  .col-1-8 {
    width: 11%;
  }
   .col-9-24 {
    width: 30%;
  }
 
}

nav {
  float: left;
  width: 15%;
  margin-left: -10px;
  margin-top:-6px;
}

.menu { 
  width: auto;
  padding: 0px;
  list-style: none;
 
}

.menu a {
  display: block;
  width: 100%;
  height: 15px;
  text-align: left;
  color: #3366ff;
  padding-top: 0px;
  padding-bottom: 0px;
  background: white;

}
a:active, a:hover {
  background: #99ccff;
}




section {
  margin-left: 0%;
}