@charset "UTF-8";
/* CSS Document */



/*::::::::: SEMANTIC ::::*/

#content { font-weight: 400; color: #222; font-size: 1.3em; }
p { line-height: 1.5em; font-size: 1.2em; margin: 1em 0; font-weight: 400; }
p b { font-weight: 700; }
h1 { font-size: 2.2em; clear: both; font-weight: bold; letter-spacing: 1px; margin: 0 auto .25em auto; text-align: center; max-width: 80%; }
h2 { font-size: 1.7em; clear: both; font-weight: bold; letter-spacing: 1px; margin: .75em auto .75em auto; text-align: center; }
h3 { font-size: 1.3em; clear: both; line-height: 1.3em; font-weight: 700; margin: .75em auto .75em auto; padding: 0px 0px 0px 0px; text-align: left; clear: both; }
ol, ul { overflow: hidden; /* stops the bulleted lists from floating into the pics 03-02*/zoom: 1;/*for IE6, has layout*/}
ol li,
ul li { font-size: 1.2em; line-height: 1.5em; margin-left: 40px; }
li li { font-size: 1em; line-height: 1.75em; list-style-position: inside; margin-left: 40px; }

a, a:hover { color: #007cbd; font-weight: 400;/* #0F70B9; #2341fe;*/}
a:hover { color: #007cbd; text-decoration: underline; }
a:visited { color: #007cbd; }
.clickable { cursor: pointer; }
a[href=""] { color: orange; }

/*arrows after links*/
span.fui-triangle-right-large:before { content: "\e002"; color: #2341fe; font-size: .8em; }

@media (max-width:767px) {ol, ul { overflow: visible;/*allows the bullets to be seen in mobile view */}}

@media (max-width:480px) {
h1 { font-size: 1.7em; }
h2 { font-size: 1.3em; }
h3 { font-size: 1.1em; }
p { font-size: 1.0em; line-height: 1.5em; }
ol li, ul li { font-size: 1.0em; line-height: 1.5em; margin-left: 10px; }
}

sup { font-size: 70%; }


/*::::::::: semantic helpers ::::*/

.large-size { font-size: 1.3em; font-weight: 300; }
.large-size b { font-weight: 600; }
.subtle-size { font-size: 1.0em; font-weight: 300; }
.marginBottom { margin-bottom: 1em; }
.marginTop { margin-top: 1em; }



/*::::::::: audio ::::*/

audio {
    width: 100%;
    margin: 1em auto 0;
}



/*::: IMAGES  :::::*/

/*image */
.img-full { margin: 0.75em 0 0.75em 0; }

/* photo surrounds */
.photo { border: 10px solid; }

@media (max-width: 767px) {.photo { border: 5px solid; /*width:88%;*/}}
@media (max-width:480px) {.photo { border: 3px solid;/*width:88%;removed widths because affecting captioned photos */}}



/*for side by side pics with captions 03-19 */

.width25 { width: 25%; }
.width33 { width: 33%;/*max-width: 283px;*/}
.width28 { width: 28%;/*max-width: 283px;*/}
.width20 { width: 20%;/*max-width: 283px;*/}
.width15 { width: 15%;/*max-width: 283px;*/}


/* for mobile view of captioned pics*/
.width98 { width: 98%; }
.width90 { width: 90%; }
.width50 { width: 50%; }
.width49 { width: 49%; }
.width45 { width: 45%; }

/* captioned photos  */
.caption p { font-size: 90%; font-style: italic; line-height: 1em; margin: 5px 0px 20px 5px; }
@media (max-width:767px) {.caption { margin-top: 20px; }}


/*::::::::: VIDEO :::::::*/
.wistia_embed { clear: both; padding: 0px 0px 30px 0px; margin: 20px 0px 0px 0px; font-size: 98%; font-style: italic; }
@media (max-width:480px) {.wistia_embed { padding: 0px 0px 20px 0px; }}


/*::::::::: BRAND BOXES ::Drop downs::::::::::::::*/
/* MATH */
.brand-area { clear: both; margin: .75em 0 .75em 0; }
.brand-area .brand-header { font-size: 1.4em; padding: 10px 20px; border-top-left-radius: 10px; border-top-right-radius: 10px; }
.brand-area .brand-header span { font-size: .9em; font-weight: bold; letter-spacing: 1px; }
.brand-area .brand-header .fui-triangle-down { white-space: nowrap; }
.brand-area .brand-header span b { font-size: .7em; text-transform: uppercase; font-weight: 100; font-style: normal; }
.brand-area .brand-content { padding: 0 10px 10px 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; }
.brand-area .brand-content h3 { }
.brand-area .brand-content p { line-height: 1.7em; }
.brand-area .brand-content ul { margin-top: 0px; }
.brand-area .brand-header .icon-left { margin-right: 20px; margin-top: 10px; }
.brand-area .brand-header .icon-right { float: right; margin-left: 20px; margin-top: 8px; margin-right: 10px; }
.brand-area span { }
.brand-area .brand-content img { margin-top: 20px; }

@media (max-width: 767px) {
.brand-area .brand-content img { width: 100%; margin: 0px; padding-top: 10px; }
.brand-area .brand-header span b { font-size: .7em; }
}

@media (max-width:480px) {
.brand-area { margin-top: 20px; }
.brand-area .brand-header { font-size: 1.0em; padding: 10px 10px 10px 10px; }
.brand-area .brand-header .icon-left { margin-right: 10px; margin-top: 4px; }
.brand-area .brand-header .icon-right { margin-top: 4px; }
.brand-area .brand-content { padding: 0px 10px 10px 10px; }
/*just the dd*/
.brand-area .brand-header span b { font-size: .6em; font-weight: 600 }
}



/*-e-contentBox-generic-*/
/*.e-contentBox .header { background-color: #595859; color: #FFF; }
.e-contentBox a.header.collapsed ~ .hanger,
.e-contentBox .content { background-color: #f2f2f2; }*/







/* color flexslider example */
.flexslider.sand .flexborder { border: 1px solid green; background-color: green; }


/* ::::::: DATA TABLE :::::: */

/*.TableMain { border-collapse: collapse; width: 100%; }
.TableMain th { padding: .7em; vertical-align: top;  background: #666; color: #fff; }
.TableMain td { text-align: center;  padding: .7em; vertical-align: top; }
.TableMain td:first-child { text-align: left; }*/


.datatable { margin: 0px 0px 10px 0px; border-collapse: collapse; width: 100%; }
.datatable thead th { }
.datatable tr th:first-child{  }
.datatable thead tr th:first-child{  }
.datatable th, .datatable td {  padding: 7px;  }
.datatable th {  } 
.datatable td { text-align: center; }

@media only screen and (max-width: 500px) {  .datatable { font-size:80%;} }
@media only screen and (max-width: 400px) {  .datatable th { font-size:60%; padding:3px;} .datatable td { font-size:75%; padding:3px;}}


/* RESPONSIVE TABLE */

@media only screen and (max-width: 767px) {
.table-responsive.table-reverse > div >:first-child { display: table-footer-group; }
.table-responsive.table-reverse > div >:last-child { display: table-header-group; }
}

@media only screen and (min-width: 768px) {
.table-responsive { border-collapse: collapse; display: table; margin: 0; }
.table-responsive.table-cell-spacing { border-collapse: separate; border-spacing: 1em .5em; }
.table-responsive.table-full { width: 100%; }
.table-responsive > div { content: ''; display: table-row; }
.table-responsive > div > * { display: table-cell; padding-left: 2%; vertical-align: middle; min-width: 50%; }
.table-cell-padding > div > * { padding: 1em .5em; }
.table-responsive > div > *:first-child { padding-left: 0; padding-right: 2%; }
.table-responsive > div > .table-width-50 { width: 50%; }
.table-responsive > div > .table-width-66 { width: 66%; }
}




.blankSpace {
    border-bottom: 2px solid #000;
    display: inline-block;
    height: 1em;
    width: 100px;
}

#content .download-box {
  display: table;
  width: 100%;
  max-width: 480px;
  margin: 20px auto;
  cursor: pointer;
}

#content .download-box .left-box,
#content .download-box .right-box {
  display: table-cell;
  vertical-align: middle;
  padding: 10px 10px;
}

#content .download-box .left-box {
  text-align: center;
  padding-left: 5px;
  width: 50px;
}

.audioScript {
    padding: 0 10px;
    font-weight: 300;
    font-size: .9em;
}

.scriptToggle {
    
    color: #fff;
    font-size: .8em;
}

.scriptToggle:hover,
.scriptToggle:active,
.scriptToggle:focus {
    
    color: #fff;
}

.audio-box {
  display: table;
  width: 100%;
  margin: 20px auto 0 auto;
  cursor: pointer;
}

.audio-box .left-box {
  display: table-cell;
  vertical-align: middle;
  padding: 10px 10px;
}

.audio-box .right-box {
  display: table-cell;
  vertical-align: middle;
  padding: 1em;
}

.audio-box .audio-glyph {
    font-size: 4em;
}

.audio-box .left-box {
  text-align: center;
  padding-left: 5px;
  width: 25%;
}
.audio-box p {
    font-weight: 300;
}

.e-contentBox {
  margin-top: 1em;
  margin-bottom: 1em;
}

.e-contentBox .header {
  box-sizing: border-box;
  font-size: 1.3em;
  font-weight: bold;
  padding-top: 0.35em;
  padding-right: 0.75em;
  padding-bottom: 0.35em;
  padding-left: 0.75em;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  display: table;
  width: 100%;
}

.e-contentBox .header .subHeading {
  font-weight: normal;
  display: block;
  font-size: 0.9em;
}

.e-contentBox .header:before {
  content: '';
  display: table-row;
}

.e-contentBox a.header {
  text-decoration: none;
}

.e-contentBox a.header + .hanger {
  display: none;
}

.e-contentBox a.header.collapsed ~ .hanger {
  height: 10px;
  background-color: #f2f2f2;
  display: block;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.e-contentBox .collapse-glyph,
.e-contentBox .headerIcon {
  display: table-cell;
  vertical-align: middle;
  width: 1%;
}

.e-contentBox .headerIcon[class*="fui-"] {
  padding-right: 0.75em;
}

.e-contentBox .collapse-glyph[class*="fui-"] {
  padding-left: 0.75em;
}

.e-contentBox .content {
  padding-top: 0.35em;
  padding-right: 0.75em;
  padding-bottom: 0.35em;
  padding-left: 0.75em;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.e-contentBox .content *:first-child {
  /*needs to be specific to override the specific p style*/
  margin-top: 0;
}

.e-pullQuote {
  margin-left: 1em;
  border-left: 3px solid;
  font-size: 1.75em;
  font-family: Georgia, serif;
  font-weight: 700;
  line-height: 1.3em;
}

.e-pullQuote-sans {
    font-family: Lato, sans-serif;
}

.e-pullQuote .content {
  padding-top: 0.5em;
  padding-left: 0.5em;
  padding-bottom: 0.5em;
}

@media (max-width: 767px) {
  .e-pullQuote {
    display: none;
  }
}

.e-pullQuote .single {
  margin-top: 1em;
}

.e-pullQuote-visible {
    display: block;
    font-size: 1.3em;
}

.WrapIt {
  padding-right: 1em;
  padding-left: 1em;
  border-width: 4px;
  border-style: solid;
  border-color: #000;
  background-color: #f4ebce;
  margin-top: 1em;
  margin-bottom: 1em;
}

.ResWrapper {
  padding-right: 1em;
  padding-left: 1em;
  border-width: 5px;
  border-style: solid;
  border-color: #000;
}

.ActBox {
  padding: .5em 1em .5em 1em;
  background-color: #f4ebce;
  margin-top: 1em;
  margin-bottom: 1em;
}

.GrayBox {
  padding: .5em 1em .5em 1em;
  background-color: #e4e4e4;
  margin-top: 1em;
  margin-bottom: 1em;
}


.title-icon {
    display: table;
    max-width: 760px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 1em;
    margin-bottom: 1em;
}

.title-icon:before {
    content: '';
    display: table-row;
}

.title-glyph,
.title-text {
    display: table-cell;
    vertical-align: middle;
}

@media (max-width: 480px) {
  .title-glyph,
  .title-text {
      display: block;
      width: 100%;
      margin-right: auto;
      margin-left: auto;
  }

  .title-glyph {
    margin-bottom: 0.4em;
  }
}

.title-glyph {
    text-align: center;
    font-size: 3em;
    width: 35%;
}

.listNone {
    list-style-type: none;
}


xmp { background-color: #EEE; font-size: .8em; white-space: pre-wrap; word-wrap: break-word; }

.blueBox {
    margin-top: 1em;
    margin-bottom: 1em;
}

.blueBoxheader {
    text-align: center;
    background-color: #143955;
    box-sizing: border-box;
    font-size: 1.3em;
    font-weight: bold;
    color: white;
    padding-top: 0.35em;
    padding-right: 0.75em;
    padding-bottom: 0.35em;
    padding-left: 0.75em;
    display: table;
    width: 100%;
}

.blueBoxcontent {
    background-color: white;
    border: 3px solid #143955;
    padding-top: 1em;
    padding-bottom: 0.5em;
}

.colorBoxStroke
{
    width: 75%;
    padding-right: 1.5em;
    padding-left: 1.5em;  
    MARGIN-LEFT: auto;
    MARGIN-RIGHT: auto;
    border-radius: 20px 20px 20px 20px !important;
    border: 4px solid #143955;
    background-color: #e1e6f6;
    
}

.colorBoxStandards
{
    width: 75%;    
    padding-right: 1.5em;
    padding-left: 1.5em;    
    MARGIN-LEFT: auto;
    MARGIN-RIGHT: auto;
    border: 4px solid #a4a4a4;
    background-color: #e4e4e0;
    
}
