@font-face {
    font-family: 'lato-black';
    src: url(../fonts/lato/Lato-Black.ttf);
}
@font-face {
    font-family: 'lato-reg';
    src: url(../fonts/lato/Lato-Regular.ttf);
}
@font-face {
    font-family: 'lato-light';
    src: url(../fonts/lato/Lato-Light.ttf);
}
@font-face {
    font-family: 'lato-hairline';
    src: url(../fonts/lato/Lato-Hairline.ttf);
}
@font-face {
    font-family: 'lato-hairline-italic';
    src: url(../fonts/lato/Lato-HairlineItalic.ttf);
}

@font-face {
    font-family: 'trim-poster';
    src: url(../fonts/trim-poster/trim-poster.ttf);
}

@font-face {
    font-family: 'harriet-reg';
    src: url(../fonts/harriet_text/harriet_text_regular.ttf);
}



@font-face {
    font-family: 'harriet-light';
    src: url(../fonts/harriet_text/harriet_text_light.ttf);
}
@font-face {
    font-family: 'harriet-bold';
    src: url(../fonts/harriet_text/harriet_text_bold.ttf);
}

.p{
  margin-bottom:10px;
  font-size:20px;
  font-family:'harriet-light', 'harriet';
  font-weight: 100;
}
.p-head{
  font-size:24px;
      line-height:1.3em;
  font-family:'akkurat','lato-black';
   font-weight: 800;
   margin-bottom:15px;
}


.label-xl-black{
  margin-bottom:10px;
  font-size:46px;
  font-family:'akkurat','lato-black';
  font-weight: 800;
}
.label-xl-light{
    margin-bottom:10px;
  font-size:46px;
  font-family:'akkurat','lato-black';
  font-weight: 800;
}

.label-lg-black{
    margin-bottom:10px;
  font-size:26px;
      line-height:1.3em; 
  font-family:'akkurat','lato-black';
   font-weight: 800;
}
.label-lg-light{
    margin-bottom:10px;
  font-size:26px;
    line-height:1.3em;
  font-family:'akkurat','lato-light';
  font-weight: 100;
}


.label-md-black{
  font-size:20px;
      line-height:1.3em;
  font-family:'akkurat','lato-black';
   font-weight: 800;
}
.label-md-light{
  font-size:20px;
      line-height:1.3em;
  font-family:'akkurat','lato-light';
  font-weight: 100;
}



.label-sm-black{
  font-size:16px;
    line-height:1.3em;
  font-family:'akkurat','lato-black';
   font-weight: 800;
}
.label-sm-light, .plot-citation{
  font-size:16px;
  line-height:1.3em;
  font-family:'akkurat','lato-light';
  font-weight: 100;
}

.plot-citation{
  font-size:14px;
  color:#999;
}

.label-xs-black{
  font-size:12.5px;
    line-height:1.3em;
  font-family:'akkurat','lato-black';
   font-weight: 800;
}
.label-xs-light{
  font-size:12.5px;
  line-height:1.3em;
  font-family:'akkurat','lato-light';
  font-weight: 100;
}

.axis text, .tick-text{
  font-family:'akkurat', 'lato-light';
  font-size:12px;
  font-weight:lighter;
  color:#999;
  fill:#999;
}



.red1{
  color:#a00000;
    margin-bottom:.3em;
}
.red2{
  color:#d34242;
    margin-bottom:.3em;
}
 
.black{
  font-family:'akkurat','lato-black';
   font-weight: 800;
}

/*br{
  line-height:2.5em;
}*/
/*this is for between 480 and 770 tablet*/
@media screen and (min-width: 450px) and (max-width: 768px) {



}




/*this is only for iphone*/
@media only screen and (max-width: 449px) {
  .p{
    font-size:17.5px;
    line-height:1.45em;
  }
  .label-lg-black{
    font-size:20px;
  }
  .label-lg-light{
    font-size:20px;
  }


  .label-md-black{
    font-size:17px;
  }
  .label-md-light{
    font-size:17px;
  }


  .label-sm-black{
    font-size:14px;
  }
  .label-sm-light{
    font-size:14px;
  }

  .plot-citation{
    font-size:14px;

  }

  .label-xs-black{
    font-size:14px;
  }
  .label-xs-light{
    font-size:14px;
  }
  .axis text, .tick-text, .plot-citation{
    font-size:11.5px;
  }

}

.cont a, .cont a:active{
  color:black;
  text-decoration: none;
  border-bottom:.5px solid #999;
}
.cont a:hover{
  background-color:black;
  color:white;
}