@font-face{font-family:'Benton Gothic Light';src:url('https://s3.amazonaws.com/latimes-datadesk-template/fonts/0.5.0/benton-gothic-light.eot');src:url('https://s3.amazonaws.com/latimes-datadesk-template/fonts/0.5.0/benton-gothic-light.eot?#iefix') format('embedded-opentype'),url('https://s3.amazonaws.com/latimes-datadesk-template/fonts/0.5.0/benton-gothic-light.woff') format('woff'),url('https://s3.amazonaws.com/latimes-datadesk-template/fonts/0.5.0/benton-gothic-light.ttf') format('truetype');font-weight:normal;font-style:normal}

/*NAV STYLES*/
.lat_logo {
    max-width: 150px;
    height: 40px;
    padding-right: 10px;
    margin-top: -5px;
}
#tophat-container{
    display: none;
}
.big-build{
    margin-top: 20px;
}
.triptych.chart-triptych{
  max-width: 1000px;
  margin: 40px auto;
  text-align: center;
}
.triptych.chart-triptych .figcaption{
  text-align: left;
}
.triptych.chart-triptych img{
  max-width: 300px;
}
.promo {
    margin: 20px 15px;
    padding: 1.5em 1em 0.5em 1em;
    background: #f4f4f4;
    display: none;
}
img.top-svg, figure.heroic img.top-svg {
    width: 144px;
    margin: 20px 2px;
    display: block;
}
h3.series_title {
    /* text-align: center; */
    margin-top: 0px;
    margin-bottom: 15px;
    font-size: 17px;
    font-family: 'Benton Gothic Light';
}
h3.title {
  margin-top: 3px;
  padding-left: 8px;
  font-size: 23px;
}
span h3.part, span h3.part:hover {
    text-decoration: none!important;
}
h3.part {
    font-size: 12px;
    text-align: left;
    font-family: Georgia,serif;
    margin: 8px auto 1px auto;
}
span.bold{
  font-family: 'Benton Gothic Bold';
}
.sticky {
    position: fixed;
    width: 100%;
    left: 0;
    top: 0;
    background-color: #fff;
    z-index: 100;
    border-top: 0;
    -webkit-box-shadow: 0px 3px 5px -2px rgba(138,138,138,0.6);
    -moz-box-shadow: 0px 3px 5px -2px rgba(138,138,138,0.6);
    box-shadow: 0px 3px 5px -2px rgba(138,138,138,0.6);
}

.li-img {
  display: none;
}
.nav-groupy {
    display: none;
  height: 61px;
}

.nav>li>a:hover,
.nav>li>a:focus {
    background-color: #fff;
    cursor: pointer !important;
}
.nav>li>a {
    display: inline;
    cursor: pointer !important;
}
.questions_list li.not-published{
  color: #999;
}
.questions_list li.not-published a, .questions_list li.not-published p, .questions_list li.not-published h3{
  color: #999;
}
li.not-published a{
  pointer-events: none!important;
  cursor: default;
}
.questions_list .nav {
    /*width: 100%;*/
    margin: 0 auto;
    height: 62px;
    float: right;
}
.questions_list_holder {
  height: 62px;
  box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.1);
}
.nav {
    margin-bottom: 5px;
    padding: 0px 0 0px;
}
#toggle-me {
  display: none;
}
.questions_list ul {
    text-align: center;
    margin: 1vh 0;
}
#questions_list.questions_list li.logo {
    width: 0%;
    display: none;
}
#questions_list.questions_list.sticky li.logo {
    width: 7%;
    display: inline;
}
li.active_link{
  border-bottom: 2px solid #bbb;
}
.questions_list li {
    text-align: left;
    display: inline-block;
    /*width: 17%;*/
    font-size: 14px;
    text-transform: uppercase;
    font-family: "Benton Gothic Bold", Arial, helvetica, Arial, sans-serif;
    padding: 0px 15px 6px 15px;
    opacity: .9;
    background-color: white;
    color: #000;
}
#questions_list.questions_list.sticky li span.date {
    display: none;
}
#questions_list.questions_list.sticky .nav {
    margin-top: 0;
    padding-top: 0;
}
.questions_list li a {
    color: #000;
    text-transform: none;
}
p.bold{
  font-family: 'Benton Gothic Bold';
}
h3.chart_header{
  font-family: 'Benton Gothic Bold';
}
article.big-build .container p.chart_text{
  font-family: 'Benton Gothic Regular';
  font-size: 16px;
  margin: 18px auto;
}
p.sans-serif {
    font-family: 'Benton Gothic Regular';
}
h3.title {
  font-size: 22px;
  font-family: 'KisFBDisplay-Roman', Georgia, serif;
  padding-left: 15px;
  /*font-weight: bold;*/
}
h3.part {
    font-size: 12px;
    text-align: left;
    font-family: 'Benton Gothic Regular', serif;
}
.logo {
    float: left;
    padding: 15px 20px 10px;
}
.nav p.subhed {
    font-family: Benton Gothic Bold;
    font-size: 13px;
    line-height: 14px;
    padding: 0;
    margin: 0;
    font-weight: normal;
}
#s-wrapper {
    margin-top: 6px;
    display: inline-block;
}
#separator {
    font-size: 23px;
    border-left: .07em solid #000;
    display: inline;
}
#a-wrapper {
    display: inline-block;
}
.chapter h3 {
    font-size: 17px;
    line-height: 18px;
    display: inline-block;
}
h3.title {
    margin-top: 5px;
    padding-left: 8px;
    font-size: 23px;
    float: right;
}
.questions_list li.short {
    width: auto;
}
.left-topper, .right-topper {
    float: left;
    width: 32%;
    padding: 2% 4% 0;
}
.dropcap {
    float: left;
    /*font-size: 100px;*/
    line-height: .95em;
    margin-top: -5px;
    font-family: 'KisFBDisplay-Roman',Georgia,serif;
    margin-right: .115em;
    color: #000;
    text-transform: uppercase;
}
article.big-build .container h3.section {
    padding-bottom: 15px;
    font-size: 40px;
    font-family: 'KisFBDisplay-Roman';
    text-align: center;
    padding-top: 60px;
    line-height: 1.1;
}
h3.section::after {
    content: "";
    display: block;
    height: 3.5px;
    max-width: 40%;
    margin: auto;
    margin-top: 20px;
}

/*quote styles*/

aside.pull-quote span.quote, aside.pull-quote q{
    font-family: 'KisFBDisplay-Roman';
    font-size: 35px;
    line-height: 40px;
    color: #333;
}

aside.pull-quote {
    margin: 25px auto;
    position: relative;
 }

aside.pull-quote::before {
    font-family: 'KisFBDisplay-Roman';
    content: "\201C";
    /*color: black;*/
    display: block;
    font-size: 120px;
    font-style: normal;
    position: absolute;
    left: -25px;
    top: 60px;
    /*color: #5d7787;*/
}

aside.pull-quote .quote-source {
    margin-bottom: 30px;
    text-align: left;
    font-size: 14px;
}

figure aside.pull-quote.quote {
    font-family: 'KisFBDisplay-Roman';
}
.survey-container{
  border-top: 1px dotted #ccc;
  border-bottom: 1px dotted #ccc;
}
.photoset{
    width: 100%;
    max-width: 1080px;
    margin: 10px auto;
    display: block;
}

figure.medium, div.medium{
    max-width: 650px;
    width: 100%;
    margin: 10px auto;
}
figure.small, div.small{
    max-width: 550px;
    width: 100%;
    margin: 10px auto;
}
.med_large{
    max-width: 1050px;
    width: 100%;
    display: block;
    margin: 10px auto!important;
}
.diptych, .triptych, .fourtych {
    margin: 40px 0;
}
.triptych figure {
    float: left;
    width: 32%;
    margin: 0px 1% 0px 0px;
}
.triptych figure:last-of-type {
    margin-right: 0;
}
figure.graphic-large{
    max-width: 1000px;
    width: 100%;
    margin: 10px auto;
}
/*form CSS*/
.form-box {
  display: none;
  margin-top: 15px;
}

.fr_response_field label {
  font-size: 16px;
  font-family: 'Benton Gothic Regular';
}

.fr_page.size_small, .fr_description {
  font-size: 14px;
  font-family: 'Benton Gothic Regular';
}

form .fr_text{
  font-size: 12px;
  line-height: 15px;
  font-family: 'Benton Gothic Regular';
}

#survey-button {
    display: block;
    margin: 10px auto 40px auto;
    border: 1px solid #9d5648;
    color: #9d5648;
}
#survey-button:hover {
    display: block;
    margin: 10px auto 40px auto;
    border: 1px solid #9d5648;
    background-color: #9d5648;
    color: #fff;
}
label {
    font-size: 16px;
    font-family: 'Benton Gothic Regular';
}
#survey-button{
    display: block;
    margin: 10px auto 40px auto;
    border: 1px solid #9d5648;
    color: #9d5648;
}
.newsletter-container {
    max-width: 650px;
    width: 100%;
    margin: 0 auto 25px auto;
}
.newsletter-container h2 {
    font-family: 'KisFBDisplay-Roman', Georgia, serif;
    margin-top: 16px !important;
    font-size: 24px;
}
.newsletter-container {
    max-width: 650px;
    width: 100%;
    margin: 0 auto 25px auto;
}
.signup-form {
    padding: 12px 5px;
}
.newsletter-container .signup-form .submit-field {
    max-width: 100%;
    height: 36px;
    border-radius: 3px;
    color: #1c1c1c;
    opacity: .9;
}
.newsletter-container .signup-form .submit-button {
    margin-left: -2px;
    font: 13px 'Benton Gothic Bold',Arial,sans-serif;
    padding: 10px 26px 10px;
    width: 16%;
}
div.response {
    /*color: #fff;*/
    font-family: "Benton Gothic Regular", Arial, sans-serif;
    font-size: 12px;
}
.newsletter-container input {
    width: calc(100% - 110px);
}
@media(max-width: 1150px){
/*.questions_list_holder.sticky .LATDDArrowLeft,
.questions_list_holder.sticky .LATDDArrowRight {
     display: block;
 }*/
 .questions_list .nav {
     width: auto;
     white-space: nowrap;
     position: relative;
 }
 .nav p.subhed{
  display: none;
 }
 .questions_list ul {
     text-align: left;
 }
 .questions_list {
     overflow-x: hidden;
     padding-top: 10px;
 }
 .questions_list .nav li {
     width: auto;
     white-space: nowrap;
     margin: 0;
 }
 .questions_list .nav li:last-child {
     margin-right: 13px;
 }
 .questions_list .nav {
     /*width: 90%;*/
     margin: 0 auto;
 }
}
@media(max-width: 1050px) {
  .questions_list .nav {
      /*width: 100%;*/
      margin: 0 auto;
  }

  #questions_list.questions_list.sticky .nav li a {
      color: #000;
 }
  .nav-wrapper {
    width: 50%;
    overflow: hidden;
  }
  ul.nav-group {
    /*float: right;*/
    margin-right: 15px;
    height: 67px;
    width: 519px;
  }
}
@media(max-width: 979px){
  .triptych.chart-triptych img {
    max-width: 240px;
  }
  .nav p.subhed{
  display: block;
 }
    aside.pull-quote span.quote, aside.pull-quote q {
      font-family: 'KisFBDisplay-Roman';
      font-size: 25px;
      line-height: 30px;
      color: #333;
  }
  aside.pull-quote::before {
      display: block;
      font-size: 90px;
      left: -3px;
      top: 50px;
      /* color: #5d7787; */
  }
  div.lat_logo {
      background: url(/projects/la-pol-ca-next-california-economy/static/svg/latimes-01.svg)!important;
      background-repeat: no-repeat!important;
      width: 25px!important;
      margin-bottom: -15px!important;
  }
  h3.title{
    font-size: 20px;
  }
  .sticky {
    overflow: hidden;
    text-align: left;
    position: fixed;
  }
  #toggle-me {
      display: block;
      float: left;
      font-size: 20px;
      margin-top: 4px;
      margin-right: 7px;
  }

  .nav-groupy {
      height: 61px;
      top: 0px;
      position: fixed;
      width: 100%;
      z-index: 9999;
  }
  .questions_list_holder {
      height: auto;
  }
   /*hide the arrows*/
   .questions_list_holder.sticky .LATDDArrowLeft, .questions_list_holder.sticky .LATDDArrowRight {
     display: none;
   }
   .questions_list .nav {
     width: 100%;
     height: auto;
   }
   /*padding for the entire container*/
   .questions_list {
     width: 100%;
     padding-left: 10px;
     background: #fff;
     /*height: 100vh;*/
   }
   .questions_list li {
     display: block;
     padding: 19px 0px 5px 12px;
   }
   .nav p.subhed {
     font-size: 14px;
     line-height: 19px;
   }
   #questions_list.questions_list .nav li.first {
     margin-left: 0;
   }
   #questions_list.questions_list .nav li:first-child {
     margin-left: 0;
   }
}
@media(max-width: 767px){
  .triptych.chart-triptych img {
    max-width: 210px;
}
  .newsletter-container .signup-form .submit-button {
    margin-left: -2px;
    font: 13px 'Benton Gothic Bold',Arial,sans-serif;
    padding: 10px 9px 10px;
    width: 16%;
}
  article.big-build .container h3.section {
    font-size: 32px;
    padding-top: 20px;
  }
  aside.pull-quote {
    margin: -10px auto;
    position: relative;
  }
    /*nav coding for clicky thing*/
 
}
@media (max-width: 600px){
  .newsletter-container .signup-form .submit-button {

    width: 20%;
}
.triptych figure, .fourtych figure {
    float: none;
    width: 100%;
    margin: 15px 0 15px 0;
}
div.lat_logo {
    width: 20px;
}
}
@media(max-width: 500px){
  .triptych.chart-triptych img {
    max-width: 240px;
}
/*  div.lat_logo {
    width: 130px;
  }*/

  h3.title {
    font-size: 21px;
}
}