/* ============================================================== */
/* ASPECT SERVICES                                               */
/* ============================================================== */
@font-face
  {
  font-family: "Open Sans";
  font-display: swap;
  src: local( "Open Sans" ), 
    url( "/fonts/open-sans-regular.woff2" ) format( "woff2" ),
    url( "/fonts/open-sans-regular.ttf" ) format( "ttf" );
  }

@font-face
  {
  font-family: "Open Sans Condensed";
  font-display: swap;
  src: local( "Open Sans Condensed" ),
    url( "/fonts/open-sans-condensed-bold.woff2" ) format( "woff2" ),
    url( "/fonts/open-sans-condensed-bold.ttf" ) format( "ttf" );
  }

@font-face
  {
  font-family: "Roboto";
  font-display: swap;
  src: local( "Roboto" ),
    url( "/fonts/roboto-regular.woff2" ) format( "woff2" ),
    url( "/fonts/roboto-regular.ttf" ) format( "ttf" );
  }

 @font-face
  {
  font-family: "Baron Neue Black";
  font-display: swap;
  src: local( "Baron Neue Black" ),
    url( "/fonts/BaronNeueBlack.woff2" ) format( "woff2" ),
    url( "/fonts/BaronNeueBlack.ttf")  format( "ttf");

  }
/* ============================================================== */
/* BASIC LAYOUT                                                   */
/* ============================================================== */
HTML
  {
  color: black;
  background: white;
  font-family: Roboto, Arial, sans-serif;
  font-size: 14pt;
  padding: 0;
  margin: 0;
  overflow-y: scroll;
  }

BODY
  {
  position:relative;
  padding: 0;
  border: 0;
  margin: 0;
  }

HEADER, MAIN, FOOTER
  {
  display: block;
  overflow: hidden;
  }

DIV.header, DIV.main, DIV.footer
  {
  box-sizing: border-box;
  max-width: 1280px;
  margin: 0 auto;
  }


/* ============================================================== */
/* GENERICS                                                       */
/* ============================================================== */
IMG
  {
  max-width: 100%;
  }

:FOCUS
  {
  outline: none;
  }

.right
  {
  float: right;
  }

.smaller
  {
  font-size: smaller;
  }

.condensed
  {
  font-family: "Open Sans Condensed", Arial, Helvetica, sans-serif;
  font-weight: normal;
  }

.blue
  {
  color: #0085C4;
  }

SUP
  {
  line-height: 0;
  }


/* ============================================================== */
/* HEADER                                                         */
/* ============================================================== */
HEADER
  {
  position: sticky ;
  top: 0;
  z-index: 99;
  color: black;
  background-color: #ebde59;
  border-bottom: solid #3853a4 4px;
  }

DIV.header
  {
  overflow: hidden;
  padding: 16px;

  }

DIV.header IMG.sitelogo
  {
  display: inline-block;
  float: left;
  height: 120px;
  }

DIV.header SPAN.heading
{
 display: inline-block;
 font-size: 84px;
 text-align: center;
 font-family: "Baron Neue Black ";
 text-transform: uppercase;
 padding-left:34px;

 }


DIV.header SPAN.tel
  {
  display: inline-block;
  font-weight: bold;
  font-size: 24pt;
  line-height: 30pt;
  color:#3853a4;
  padding-top:12px;
  }


@media screen and ( max-width: 1024px ), ( max-height: 480px )
  {
  DIV.header IMG.sitelogo
    {
    height: 100px;
    text-align:center;
    }

  DIV.header SPAN.heading
    {
    display: none;
    }

   }


/* ============================================================== */
/* MAIN                                                           */
/* ============================================================== */
MAIN
  {
  position: relative;
  min-height: calc( 100vh - 120px ) ;
  margin-top: 0;
  padding-top: 0;
  }


DIV.main
  {
  margin: 16px auto 0 auto;
  padding: 0 16px 24px 16px;
  font-size: 14pt;
  line-height: 150%;
  }

DIV.main H1
  {
  margin-top: 0;
  font-family: "Open Sans Condensed";
  font-size: 32pt;
  font-weight: normal;
  line-height: normal;
  color: #0085C4;
  margin-bottom: 16px;
  }

@media screen and ( max-width: 800px )
  {
  DIV.main H1
    {
    font-size: 24pt;
    }
  }

P.intro
  {
  font-size: 15pt;
  font-weight: bold;
  }








/* ============================================================ */
/* HOME PAGE FEATURE PANEL (USUALLY COMBINED WITH DIV.MAIN)     */
/* ============================================================ */
SECTION.feature
  {
  margin-bottom: 48px;
  }

DIV.feature
  {
  overflow: hidden;
  width: 100%;
  color: white;
  background: #3853a4;
  border-left: solid white 16px;
  border-right: solid white 16px;
  }

DIV.featuretitle
  {
  box-sizing: border-box;
  float: left;
  vertical-align: top;
  width: 33%;
  font-family: "Open Sans Condensed";
  font-weight: normal;
  font-size: 48pt;
  line-height: 133%;
  text-align: center;
  padding: 8px 24px 16px 8px;
  }

DIV.titleright DIV.featuretitle
  {
  float: right;
  padding: 8px 8px 16px 24px;
  }

DIV.featurecontent
  {
  box-sizing: border-box;
  float: right;
  vertical-align: top;
  width: 67%;
  padding: 16px 8px;
  font-size: 18pt;
  line-height: 150%;
  }

DIV.titleright DIV.featurecontent
  {
  float: left;
  }

@media screen and ( max-width: 800px )
  {
  DIV.feature
    {
    display: block;
    width: auto;
    padding: 0;
    border: 0;
    margin: 16px;
    padding: 16px;
    }

  DIV.featuretitle, DIV.titleright DIV.featuretitle
    {
    display: block;
    width: auto;
    float: none;
    font-size: 28pt;
    text-align: left;
    padding: 8px 8px 16px 8px;
    }

  DIV.featurecontent
    {
    display: block;
    width: auto;
    float: none;
    font-size: 14pt;
    padding-bottom: 16px;
    }
  }


 /* ============================================================ */
/* TWO-PART LAYOUTS (USUALLY COMBINED WITH DIV.MAIN)            */
/* ============================================================ */
DIV.twopart
  {
  display: table;
  table-layout: fixed;
  width: 100%;
  }

DIV.twopart DIV.mainbar
  {
  display: table-cell;
  vertical-align: top;
  width: 66%;
  padding: 4px 16px 0 0;
  }

DIV.twopart DIV.mainbar P:FIRST-CHILD
  {
  margin-top: 0;
  padding-top: 0;
  }

DIV.twopart DIV.sidebar
  {
  display: table-cell;
  vertical-align: top;
  width: 34%;
  padding: 4px 0 16px 16px;
  font-size: 12pt;
  color: black;
  }



@media screen and ( max-width: 720px )
  {
  DIV.twopart, DIV.twopart DIV.mainbar, DIV.twopart DIV.sidebar
    {
    display: block;
    width: auto;
    padding: 0;
    border: 0;
    margin: 0 0 16px 0;
    }


  }
/* ============================================================== */
/* SIDEBAR                                                       */
/* ============================================================== */

DIV.icons IMG
{
    width:70px;
    vertical-align:middle;
    padding-bottom:10px;
    padding-right:8px;
}

DIV.icons UL
{
    list-style-type: none;
  margin: 0;
  padding: 0;
}

DIV.icons
{
    vertical-align: middle;
}

/* ============================================================== */
/* FOOTER                                                         */
/* ============================================================== */
FOOTER
  {
  padding: 8px 16px;
  color: white;
  background: #3853a4;
  padding-bottom:24px;
  padding-top:24px;
  }

FOOTER A, FOOTER A:VISITED
  {
  color: white;
  text-decoration: none;
  }

FOOTER A:ACTIVE, FOOTER A:HOVER
  {
  color: white;
  text-decoration: underline;
  }

 span.footerphone
 {
     float:right;
 }