div.styles1148 {
  -ms-flex-align: center;
      align-items: center;
  color: #fff;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  margin: 0 auto;
  max-width: 15rem; }
  @media (max-width: 46.24em) {
    div.styles1148 {
      padding-bottom: 1.5rem; } }
  @media (min-width: 46.25em) {
    div.styles1148 {
      padding-left: 2.25rem;
      margin-left: -2vw; } }
  @media (min-width: 61.25em) {
    div.styles1148 {
      margin-right: -1.5rem;
      margin-left: 0; } }
  div.styles1148 .editor {
    width: 100%; }
  div.styles1148 h2 {
    margin-left: -1.9995rem;
    color: #a08e63;
    font-family: "Akzidenz Grotesk Condensed";
    font-weight: 700;
    height: 4.5rem;
    text-transform: uppercase; }
    @media (max-width: 46.24em) {
      div.styles1148 h2 {
        margin-bottom: 1.5rem; } }
    @media (min-width: 46.25em) {
      div.styles1148 h2 {
        margin-top: 3rem;
        -ms-flex-item-align: start;
            align-self: flex-start; } }
    div.styles1148 h2::before {
      margin: 0 0.375rem 0 -0.375rem;
      font-size: 5.375rem;
      line-height: 4.5rem;
      color: #786636;
      content: '#';
      font-weight: 400;
      vertical-align: middle; }
    .home div.styles1148 h2::before {
      color: #fff; }
    div.styles1148 h2 + * {
      margin-top: -0.1875rem; }
      @media (max-width: 46.24em) {
        div.styles1148 h2 + * {
          margin-top: -1.5rem; } }
  div.styles1148 p {
    margin-top: 0;
    text-align: center; }
    div.styles1148 p:first-child {
      margin-top: 0; }
  div.styles1148 ul {
    list-style: none;
    padding: 0;
    text-align: center;}
  div.styles1148 li {
    display: inline-block;
    margin: 0.75rem; }
    div.styles1148 li a {
      overflow: hidden;
      padding: 0;
      text-indent: 101%;
      white-space: nowrap;
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      display: block;
      height: 2.7rem;
      width: 2.7rem; }
      div.styles1148 li a[href*="facebook.com"] {
        background-image: url("/site/dist/img/icon-social-facebook.png"); }
      div.styles1148 li a[href*="twitter.com"] {
        background-image: url("/site/dist/img/icon-social-twitter.png"); }
      div.styles1148 li a[href*="instagram.com"] {
        background-image: url("/site/dist/img/icon-social-instagram.png"); }
      div.styles1148 li a[href*="youtube.com"] {
        background-image: url("/images/Icon_Youtube.png"); }
  div.styles1148 a {
    color: inherit !important; }
.widget-info-accordion {
    color: #424242;
    font: 14px/20px "aptifer-sans",sans-serif;
}
.widget-info-accordion .title-accordion {
    background: #f0f0f0 none repeat scroll 0 0;
    border: 1px solid #ddd;
    border-radius: 5px;
    color: #2c4263;
    cursor: pointer;
    font: 18px/24px "aptifer-sans",sans-serif;
    margin: 0 0 12px;
    outline: medium none;
    overflow: hidden;
    padding: 12px 30px 15px 26px;
    position: relative;
}
.widget-info-accordion .ui-state-active {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: #fff none repeat scroll 0 0;
    border-color: #ccc;
    border-image: none;
    border-radius: 5px 5px 0 0;
    border-style: solid;
    border-width: 1px 1px 0;
    margin: 0;
    padding: 11px 29px 15px 25px;
}
.widget-info-accordion .ui-accordion-header-icon {
    background: rgba(0, 0, 0, 0) url("/images/arrow_06.png") no-repeat scroll 0 0;
    height: 9px;
    position: absolute;
    right: 15px;
    top: 22px;
    width: 13px;
}
.widget-info-accordion .ui-state-active .ui-accordion-header-icon {
    background-position: 0 -191px;
}
.widget-info-accordion h6 {
    color: #2c4263;
    font: 18px/20px "aptifer-sans",sans-serif;
    margin: 0;
    padding: 13px 26px 19px;
}
.widget-info-accordion .accordion-area {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: #ccc;
    border-image: none;
    border-radius: 0 0 5px 5px;
    border-style: solid;
    border-width: 0 1px 1px;
    margin: 0 0 13px;
    position: relative;
}
.widget-info-accordion .block {
    border-top: 1px solid #ccc;
    overflow: hidden;
    padding: 22px 26px 24px;
}
.widget-info-accordion .block a {
    font-family: "aptifer-sans-bold",sans-serif;
    font-weight: bold;
    text-decoration: underline;
}
.widget-info-accordion .accordion-area .img {
    float: left;
    margin: 0 25px 0 0;
}
.widget-info-accordion .text {
    overflow: hidden;
}
.widget-info-accordion .text .sub-head {
    color: #2c4263;
    display: block;
    font: 16px/18px "mendoza-medium",serif;
    margin: 0 0 2px;
    text-transform: uppercase;
}
.widget-info-accordion .text p {
    margin: 0;
}
div.styles1017 img {
display: block;
margin: 0 auto;
width: auto;
}
@media (max-width: 34.375em) {
  div.styles1017 img {
    margin: 1em auto;
    width: 20%;
  }
}
/* Code required to style your search bar as requested */
 div.styles1147 {
     padding: .5rem 0 .5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
@media (min-width: 46.25em) {
     div.styles1147 {
         height: auto;
    }
}
 div.styles1147::before {
     background-color: #2c1d36;
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}
div.styles1147 h2 {
      text-align: center;
}
div.styles1007 .item-list {
    font-size: 1.5rem;
    line-height: 2.25rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: center;
        justify-content: center;
    margin: 0;
    text-transform: uppercase; }

  div.styles1007 li {
    margin: 0.75rem 0 0;
    -ms-flex-align: center;
        align-items: center;
    display: -ms-flexbox;
    display: flex;
    width: 100%; }
    @media (min-width: 32.5em) and (max-width: 46.24em) {
      div.styles1007 li {
        padding: 0 1.5rem; } }
    @media (min-width: 32.5em) {
      div.styles1007 li {
        padding: 0 0.75rem;
        /*width: 50%;*/ } }
    @media (min-width: 61.25em) {
      div.styles1007 li {
        padding: 0 1.5rem; } }

  div.styles1007 a {
    font-size: 1.5rem;
    line-height: 2.25rem;
    padding: 0.375rem 1.125rem;
    background-color: #786636;
    border: 0;
    color: #fff !important;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed";
    text-align: center;
    text-transform: uppercase;
    transition: background-color .125s ease-in-out, color .125s ease-in-out;
    text-decoration: none;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-positive: 1;
        flex-grow: 1;
    height: 100%;
    -ms-flex-pack: center;
        justify-content: center; }
    div.styles1007 a:hover,
    div.styles1007 a:active,
    div.styles1007 a:focus {
      background-color: #42235e;
      opacity: 1; }
   div.styles1007 a:visited {
      color: #ffffff;
   }
div.styles1090 {
margin-right: 0px;
overflow: auto;
display: block;
margin: 10px -3px 35px -3px;
background: #DCDCDC;
padding: 0 5px;
    font-family: Akzidenz Grotesk;
    font-weight: 400;
    font-size: 1.1em;
}

div.styles1090 .boxed__standout {
border-top: 0;
}

div.styles1090: h2 hover {
color: #b69d76;
}

div.styles1090 h2 {
font-size: 1.6em;
margin-bottom: 10px;
margin-left: 10px;
margin-right: 10px;
letter-spacing: -1px;
line-height: 1.1em;
color: #43215f;
}

div.styles1090 h2 a {
   color: #fffffff !important;
   underline: none;
}

div.styles1090 h2 a:visited {
   color: #fff;
}

div.styles1090 .calloutalign {
   text-align: center;
}

div.styles1090 .onlinebox {
    background-color: #202954;
   padding-top: -50px;
   padding-left: -25px;
   width: 305px;
}
/* Code required to style your search bar as requested */
 div.styles1018 {
     padding: .5rem 0 .5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
@media (min-width: 46.25em) {
     div.styles1018 {
         height: 13em;
    }
}
 div.styles1018::before {
     background-color: #d8d0bf;
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 99.5rem;
     z-index: -1;
}
div.styles1018 h2 {
      text-align: center;
}
div.styles1018 a {
    font-size: 1.5rem;
    line-height: 2.25rem;
    padding: 0.375rem 1.125rem;
    background-color: #786636;
    border: 0;
    color: #fff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed";
    text-align: center;
    text-transform: uppercase;
    transition: background-color .125s ease-in-out, color .125s ease-in-out;
    text-decoration: none;
    color: #fff;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    height: 100%;
    -ms-flex-pack: center;
        justify-content: center; }
    div.styles1018 a:hover,
    div.styles1018 a:active,
    div.styles1018 a:focus {
      background-color: #42235e;
      opacity: 1; }
   div.styles1018 a:visited {
      color: #ffffff;
   }

/* below can probably be removed later, be sure to check buttons after removal */
div.styles1018 .site-content .editor a {
 color: #ffffff;
}
div.styles1018 .site-content .editor a:visited {
 color: #ffffff;
}
/* Code required to style your search bar as requested */
 div.styles1021 {
     padding: .5rem 0 .5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
@media (min-width: 46.25em) {
     div.styles1021 {
         height: auto;
    }
}
 div.styles1021::before {
     background-color: #d8d0bf;
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}
div.styles1021 h2 {
      text-align: center;
}
div.styles1021 a {
    font-size: 1.5rem;
    line-height: 2.25rem;
    padding: 0.375rem 1.125rem;
    background-color: #786636;
    border: 0;
    color: #fff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed";
    text-align: center;
    text-transform: uppercase;
    transition: background-color .125s ease-in-out, color .125s ease-in-out;
    text-decoration: none;
    color: #fff;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    height: 100%;
    -ms-flex-pack: center;
        justify-content: center; }
    div.styles1021 a:hover,
    div.styles1021 a:active,
    div.styles1021 a:focus {
      background-color: #42235e;
      opacity: 1; }
   div.styles1021 a:visited {
      color: #ffffff;
   }

/* below can probably be removed later, be sure to check buttons after removal */
div.styles1021 .site-content .editor a {
 color: #ffffff;
}
div.styles1021 .site-content .editor a:visited {
 color: #ffffff;
}
div.styles1019 h2 {
      text-align: center;
}
div.styles1019 a {
    font-size: 1.5rem;
    line-height: 2.25rem;
    padding: 0.375rem 1.125rem;
    background-color: #786636;
    border: 0;
    color: #fff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed";
    text-align: center;
    text-transform: uppercase;
    transition: background-color .125s ease-in-out, color .125s ease-in-out;
    text-decoration: none;
    color: #fff;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    height: 100%;
    -ms-flex-pack: center;
        justify-content: center; }
    div.styles1019 a:hover,
    div.styles1019 a:active,
    div.styles1019 a:focus {
      background-color: #42235e;
      opacity: 1; }
   div.styles1019 a:visited {
      color: #ffffff;
   }

/* below can probably be removed later, be sure to check buttons after removal */
div.styles1019 .site-content .editor a {
 color: #ffffff;
}
div.styles1019 .site-content .editor a:visited {
 color: #ffffff !important;
}
div.styles1019 .editor a {
 color: #ffffff;
}
/* Code required to style your search bar as requested */
 div.styles1020 {
     padding: .5rem 0 .5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
@media (min-width: 46.25em) {
     div.styles1020 {
         height: 15em;
    }
}
 div.styles1020::before {
     background-color: #42235e;
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}
div.styles1020 h2 {
    text-align: center;
    color: #ffffff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 3rem;
    line-height: 3.25rem;
}
div.styles1020 a {
    font-size: 3rem;
    line-height: 2.25rem;
    padding: 2rem 2rem;
    background-color: #fff;
    border: 0;
    color: #fff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed";
    text-align: center;
    text-transform: uppercase;
    transition: background-color .125s ease-in-out, color .125s ease-in-out;
    text-decoration: none;
    color: #42235e;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    height: 100%;
    -ms-flex-pack: center;
        justify-content: center; }
    div.styles1020 a:hover,
    div.styles1020 a:active,
    div.styles1020 a:focus {
      background-color: #fff;
      opacity: 1; }
   div.styles1020 a:visited {
      color: #42235e;
   }

/* below can probably be removed later, be sure to check buttons after removal */
div.styles1020 .site-content .editor a {
 color: #42235e;
}
div.styles1020 .site-content .editor a:visited {
 color: #ffffff;
}
div.styles1074 {
background:#e9e9e9;
padding: 0;
    font-family: Akzidenz Grotesk;
    font-weight: 400;
    font-size: 1.1em;
   margin-left: -50px;
   min-height: 300px;
   margin-right: 10px;
   margin-top: 15px;
}

div.styles1074: h2 hover {
color: #b69d76;
}

div.styles1074 h2 {
font-size: 28px;
margin-bottom: 3px;
margin-right: 3px;
letter-spacing: -1px;
line-height: 1.1em;
color: #ffffff;
font-weight: 400;
background: rgb(0, 0, 0); /* fallback color */
background: rgba(0, 0, 0, 0.7);
padding: 8px;
}

div.styles1074 h2 a {
   color: #fffffff !important;
   underline: none;
}

div.styles1074 h2 a:visited {
   color: #fff;
}

div.styles1074 .calloutalign {
   text-align: center;
}

div.styles1074 .certsbox {
  position: relative;
  text-align: center;
  color: #43251f;
    font-size: 14px;
    text-align: center;
    font-color: #000000;
}

div.styles1074 .certsboxhead {
     position: absolute;
     bottom: 3px;
     right: 8px;
}
div.styles1099::before {
background-color: #ffffff;
    background-position: center center;
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    bottom: 0;
    content: '';
    left: 50%;
    margin-left: -50vw;
    position: absolute;
    top: 0;
    width: 100vw;
    z-index: -1;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1084 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1084 {
     padding: .75rem 0 .5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1084 {
         min-height: 27em;
    }
}
 div.styles1084::before {
     background-color: #43215e;
     background:
       /* top, transparent #43215e, faked with gradient */ 
       linear-gradient(
         rgba(67, 33, 94, 0.85),
         rgba(67, 33, 94, 0.85)
       ),
       /* bottom, image */
       url("https://www.butlercc.edu/images/Students_Cheering.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1084 h2 {
    color: #fff;
    font-color: #fff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 10 0 10;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1084 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1084 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1084 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1084 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1084 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1084 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1086 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1086 {
     padding: .75rem 0 .5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1086 {
         min-height: 27em;
    }
}
 div.styles1086::before {
     background-color: #a29062;
     background:
       /* bottom, image */
       url("https://www.butlercc.edu/images/gold_triangles.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1086 h2 {
    color: #fff;
    font-color: #fff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1086 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1086 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1086 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1086 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1086 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1086 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1087 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1087 {
     padding: .75rem 0 .5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: right;
     max-width: 63rem;
     position: relative;
     text-align: right;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1087 {
         min-height: 27em;
    }
}
 div.styles1087::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(163, 145, 97, 0.85),
         rgba(163, 145, 97, 0.85)
       ),
       /* bottom, image */
       url("https://www.butlercc.edu/images/butler_in_the_community.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1087 h2 {
    color: #fff;
    font-color: #fff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 10 0 10;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1087 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1087 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1087 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1087 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1087 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1087 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1085 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1085 {
     padding: .75rem 0 .5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1085 {
         min-height: 27em;
    }
}
 div.styles1085::before {
     background-color: #43215e;
     background:
       /* top, transparent #43215e, faked with gradient */ 
       linear-gradient(
         rgba(67, 33, 94, 0.85),
         rgba(67, 33, 94, 0.85)
       ),
       /* bottom, image */
       url("https://www.butlercc.edu/images/purple_triangles.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1085 h2 {
    color: #fff;
    font-color: #fff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1085 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1085 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1085 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1085 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1085 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1085 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1083 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1083 {
     padding: .75rem 0 .5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1083 {
         min-height: 27em;
    }
}
 div.styles1083::before {
     background-color: #a08e63;
     background-color: #a08e63;
     background:
      /* bottom, image */
     url("https://www.butlercc.edu/images/crowd.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}
 div.styles1083 h2 {
    color: #a08e63;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.75rem;
}
 div.styles1083 .awesomplete {
     display: block;
     margin: 0;
}
 div.styles1083 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1083 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1083 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1083 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1083 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
div.styles1083 .item-list {
    font-size: 1.5rem;
    line-height: 2.25rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: center;
        justify-content: center;
    margin: 0;
    text-transform: uppercase; }

  div.styles1083 li {
    margin: 0;
    -ms-flex-align: center;
        align-items: center;
    display: -ms-flexbox;
    display: flex;
    width: 100%; }
    @media (min-width: 32.5em) and (max-width: 46.24em) {
      div.styles1083 li {
        padding: 0 .05rem; } }
    @media (min-width: 32.5em) {
      div.styles1083 li {
        padding: 0 0.05rem;}

    @media (min-width: 61.25em) {
      div.styles1083 li {
        padding: 0 1.5rem; } }

  div.styles1083 a {
    font-size: 1.5rem;
    color: #ffffff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed"; }
   }
div.styles1049 .item-list {
    font-size: 1rem;
    line-height: 1.5rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: center;
        justify-content: center;
    margin: 0;
    text-transform: uppercase; }

  div.styles1049 li {
    margin: 0.75rem 0 0;
    -ms-flex-align: center;
        align-items: center;
    display: -ms-flexbox;
    display: flex;
    width: 100%; }
    @media (min-width: 32.5em) and (max-width: 46.24em) {
      div.styles1049 li {
        padding: 0 1.5rem; } }
    @media (min-width: 32.5em) {
      div.styles1049 li {
        padding: 0 0.75rem;
        /*width: 50%;*/ } }
    @media (min-width: 61.25em) {
      div.styles1049 li {
        padding: 0 1.5rem; } }

  div.styles1049 a {
    font-size: 1rem;
    line-height: 1.5rem;
    padding: 0.275rem 1.025rem;
    background-color: #786636;
    border: 0;
    color: #fff !important;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed";
    text-align: center;
    text-transform: uppercase;
    transition: background-color .125s ease-in-out, color .125s ease-in-out;
    text-decoration: none;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-positive: 1;
        flex-grow: 1;
    height: 100%;
    -ms-flex-pack: center;
        justify-content: center; }
    div.styles1049 a:hover,
    div.styles1049 a:active,
    div.styles1049 a:focus {
      background-color: #42235e;
      opacity: 1; }
   div.styles1049 a:visited {
      color: #ffffff;
   }
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1109 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1109 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: block;
     margin-left: auto;
     margin-right: auto;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1109 {
         min-height: 10em;
    }
}
 div.styles1109::before {
     background: url("https://www.butlercc.edu/images/Hero_Image_Culinary.jpg");
     background-position: center center;
     background-size: cover;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}
 div.styles1109 h2 {
    color: #a08e63;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: translate(9vw);
    margin: 0;
    font-size: 6vw;
    line-height: 3.25rem;
}
 div.styles1109 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1109 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1109 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1109 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1109 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1109 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
div.styles1109 .item-list {
    font-size: 1.5rem;
    line-height: 2.25rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: center;
        justify-content: center;
    margin: 0;
    text-transform: uppercase; }

  div.styles1109 li {
    margin: 0.75rem 0 0;
    -ms-flex-align: center;
        align-items: center;
    display: -ms-flexbox;
    display: flex;
    width: 100%; }
    @media (min-width: 32.5em) and (max-width: 46.24em) {
      div.styles1109 li {
        padding: 0 1.5rem; } }
    @media (min-width: 32.5em) {
      div.styles1109 li {
        padding: 0 0.75rem;
        /*width: 50%;*/ } }
    @media (min-width: 61.25em) {
      div.styles1109 li {
        padding: 0 1.5rem; } }

  div.styles1109 a {
    font-size: 1.5rem;
    line-height: 2.25rem;
    padding: 0.375rem 1.125rem;
    background-color: #786636;
    border: 0;
    color: #fff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed";
    text-align: center;
    text-transform: uppercase;
    transition: background-color .125s ease-in-out, color .125s ease-in-out;
    text-decoration: none;
    color: #fff;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-positive: 1;
        flex-grow: 1;
    height: 100%;
    -ms-flex-pack: center;
        justify-content: center; }
    div.styles1109 a:hover,
    div.styles1109 a:active,
    div.styles1109 a:focus {
      background-color: #42235e;
      opacity: 1; }
   div.styles1109 a:visited {
      color: #ffffff;
   }
div.styles1080 {
margin-right: 0px;
overflow: auto;
display: block;
margin: 8px -3px;
background: #e9e9e9;
padding: 0 5px;
    font-family: Akzidenz Grotesk;
    font-weight: 400;
    font-size: 1.1em;
}

div.styles1080 .boxed__standout {
border-top: 0;
}

div.styles1080: h2 hover {
color: #b69d76;
}

div.styles1080 h2 {
font-size: 1.6em;
margin-bottom: 10px;
margin-left: 10px;
margin-right: 10px;
letter-spacing: -1px;
line-height: 1.1em;
color: #ffffff;
}

div.styles1080 h2 a {
   color: #fffffff !important;
   underline: none;
}

div.styles1080 h2 a:visited {
   color: #fff;
}

div.styles1080 .calloutalign {
   text-align: center;
}

div.styles1080 .onlinebox {
    background-color: #43215f;
   padding-top: -50px;
   padding-left: 5px;
}

div.styles1080 .onlineboxcopy {
    height: 50px;
    margin-bottom: 20px;
}
div.styles1081 {
overflow: hidden;
display: block;
padding: 1.0em;
background: #e9e9e9;
height: 160px;
text-align: center;
margin: 1.5em 0em 0em 0em 
}

div.styles1081 .boxed__standout {
border-top: 0;
}

div.styles1081: h2 hover {
color: #b69d76;
}

div.styles1081 h2 {
font-size: 1.6em;
margin-bottom: 20px;
margin-left: 10px;
margin-right: 10px;
letter-spacing: -1px;
line-height: 1.1em;
color: #ffffff;
}

div.styles1081 h2 a {
   color: #fffffff !important;
   underline: none;
}

div.styles1081 h2 a:visited {
   color: #fff;
}

div.styles1081 .calloutalign {
   text-align: center;
}

div.styles1081 ul {
    color: #ffffff;
    font-size: 1.2em;
    line-height: 1em;
}

div.styles1081 .button {
    font-size: 2.5rem;
    line-height: 2.25rem;
    padding: 0.375rem 1.125rem;
    background-color: #43215f;
    border: 0px solid #ffffff;
    color: #fff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed";
    text-align: center;
    text-transform: uppercase;
}
div.styles1108 {
background:#e9e9e9;
padding: 0;
font-family: Akzidenz Grotesk;
font-weight: 400;
font-size: 1.1em;
min-height: 300px;
}

.widget-width {
padding: 0 !important;
}

.editor img {
margin: 0 !important;
}

div.styles1108: h2 hover {
color: #b69d76;
}



div.styles1108 h2 {
font-size: 28px;
letter-spacing: -1px;
line-height: 1.1em;
color: #ffffff;
font-weight: 400;
background: rgb(0, 0, 0); /* fallback color */
background: rgba(0, 0, 0, 0.7);
padding: 8px;
}

div.styles1108 h2 a {
color: #fffffff !important;
underline: none;
}



div.styles1108 h2 a:visited {
color: #fff;
}



div.styles1108 .calloutalign {
text-align: center;
}



div.styles1108 .certsbox {
position: relative;
text-align: center;
color: #43251f;
font-size: 14px;
text-align: center;
font-color: #000000;
}



div.styles1108 .certsboxhead {
position: absolute;
bottom: 0px;
right: 0px;
left: 0px;
margin: 0 auto;
}
div.styles1079 {
overflow: hidden;
display: block;
padding: 1.5em;
background: #91713e;
    font-family: Akzidenz Grotesk;
    font-weight: 400;
    font-size: 1.1em;
    font-color: #ffffff;
 height: 160px;
  margin: 10px -20px 20px 10px;
}

div.styles1079 .boxed__standout {
border-top: 0;
}

div.styles1079: h2 hover {
color: #b69d76;
}

div.styles1079 h2 {
font-size: 1.6em;
margin-bottom: 20px;
margin-left: 10px;
margin-right: 10px;
letter-spacing: -1px;
line-height: 1.1em;
color: #ffffff;
}

div.styles1079 h2 a {
   color: #fffffff !important;
   underline: none;
}

div.styles1079 h2 a:visited {
   color: #fff;
}

div.styles1079 .calloutalign {
   text-align: center;
}

div.styles1079 ul {
    color: #ffffff;
    font-size: 1.2em;
    line-height: 1em;
}

div.styles1079 .button {
    font-size: 2.5rem;
    line-height: 2.25rem;
    padding: 0.375rem 1.125rem;
    background-color: #91713e;
    border: 5px solid #ffffff;
    color: #fff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed";
    text-align: center;
    text-transform: uppercase;
}
div.styles1082 {
margin-right: 0px;
overflow: auto;
display: block;
margin: 10px -3px 35px -3px;
background: #e9e9e9;
padding: 0 5px;
    font-family: Akzidenz Grotesk;
    font-weight: 400;
    font-size: 1.1em;
}

div.styles1082 .boxed__standout {
border-top: 0;
}

div.styles1082: h2 hover {
color: #b69d76;
}

div.styles1082 h2 {
font-size: 1.6em;
margin-bottom: 10px;
margin-left: 10px;
margin-right: 10px;
letter-spacing: -1px;
line-height: 1.1em;
color: #ffffff;
}

div.styles1082 h2 a {
   color: #fffffff !important;
   underline: none;
}

div.styles1082 h2 a:visited {
   color: #fff;
}

div.styles1082 .calloutalign {
   text-align: center;
}

div.styles1082 .onlinebox {
    background-color: #43215f;
   padding-top: -50px;
   padding-left: 5px;
}

div.styles1082 .onlineboxcopy {
    height: 195px;
}
div.styles1078 {
overflow: auto;
text-overflow: ellipsis;
display: block;
font-family: Akzidenz Grotesk;
font-weight: 400;
font-size: 1.1em;
margin: 1em 0.5em;
}

div.styles1078 .boxed__standout {
border-top: 0;
}

div.styles1078: h2 hover {
color: #b69d76;
}

div.styles1078 h2 {
font-size: 1.6em;
margin-bottom: 10px;
margin-left: 10px;
margin-right: 10px;
letter-spacing: -1px;
line-height: 1.1em;
color: #ffffff;
}

div.styles1078 h2 a {
   color: #fffffff !important;
   underline: none;
}

div.styles1078 h2 a:visited {
   color: #fff;
}

div.styles1078 .calloutalign {
   text-align: center;
}

div.styles1078 .rightbox {
  /* For desktop */
  border-radius: 15px 15px 15px 15px;
  background: #d8d0bf;
  padding: 06%;
  width: 100%;
  min-height: 28vh;
}

div.styles1078 .leftbox {
  /* For desktop */
  border-radius: 15px 15px 15px 15px;
  background: #43215F;
color: #ffffff;
  width: 100%;
  min-height: 28vh;
padding: 1em;
}

div.styles1078 .testimonialimage {
    float: none;
    width: 60%;

    position: relative;
}
div.styles1022 hr {
  border: 4px solid #42235e; /*#42235e;*/
  left: 50%;
  margin-left: -50vw;
  position: absolute;
  width: 100vw;
  box-sizing: border-box;
}
div.styles1008 {
margin-right: 5.98694%;
overflow: auto;
display: block;
margin: 10px 0;
background: #e5e0d3;

text-shadow: 0px 1px 1px #ffffff;
padding: 1em;
}

div.styles1008 .boxed__standout {
border-top: 0;
}

div.styles1008:hover {
color: #000000;
}
div.styles1008 img {
width: 100%;
color: #000000;
text-shadow: 0px 1px 1px #42235e;
}

div.styles1008 h3 {
font-size: 1.6em;
margin-bottom: 10px;
letter-spacing: -1px;
line-height: 1.2em;
color: #42235e;
}

div.styles1008 h3 a {
color: #42235e;
}
div.styles1002 {
margin-right: 5.98694%;
overflow: auto;
display: block;
margin: 10px -10px;
background: #513f59;
color: #fff;
text-shadow: 0px 1px 1px #3d2545;
border-top: 10px solid #3d2545;
padding: 0.5em;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    font-size: 1.1em;
    text-transform: uppercase;
}

div.styles1002 .boxed__standout {
border-top: 0;
}

div.styles1002:hover {
color: #b69d76;
}
div.styles1002 img {
width: 100%;
color: #fff;
text-shadow: 0px 1px 1px #3d2545;
height: 130px;
}

div.styles1002 h3 {
font-size: 1.6em;
margin-bottom: 10px;
letter-spacing: -1px;
line-height: 1.1em;
color: #fff;
}

div.styles1002 h3 a {
   color: #fff;
}

div.styles1002 h3 a:visited {
   color: #fff;
}
div.styles1002 a:visited {
    color: #fff;
}
div.styles1002 a {
    color: #fff;
    text-decoration: none;
}
div.styles1002 .callout {
    color: #fff;
}
div.styles1002 .callout a:visited {
    color: #fff;
}
div.styles1002 .calloutalign {
   text-align: center;
}
div.styles1061 {
margin-right: 5.98694%;
overflow: auto;
display: block;
margin: 10px -10px;
background: #513f59;
color: #fff;
text-shadow: 0px 1px 1px #3d2545;
border-top: 10px solid #3d2545;
padding: 0.5em;
min-height: 665px;
}

div.styles1061 .boxed__standout {
border-top: 0;
}

div.styles1061:hover {
color: #b69d76;
}
div.styles1061 img {
width: 100%;
color: #fff;
text-shadow: 0px 1px 1px #3d2545;
}
div.styles1061 p {
font-size: .9em;
margin-bottom: 5px;
line-height: 1.4em;
color: #fff;
padding: 10px;
}
div.styles1061 ul {
font-size: .9em;
margin-bottom: 5px;
color: #fff;
}

div.styles1061 h2 {
margin-bottom: 5px;
letter-spacing: -1px;
line-height: 1.1em;
color: #fff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    font-size: 1.6em;
    text-transform: uppercase;
}

div.styles1061 h3 {
font-size: 1 em;
margin-bottom: 10px;
letter-spacing: -1px;
line-height: 1.1em;
color: #fff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    font-size: .8em;
    text-transform: uppercase;
}

div.styles1061 h3 a {
   color: #fff;
}

div.styles1061 h3 a:visited {
   color: #fff;
}
div.styles1061 a:visited {
    color: #fff;
}
div.styles1061 a {
    color: #fff;
    text-decoration: none;
}
div.styles1061 .callout {
    color: #fff;
}
div.styles1061 .callout a:visited {
    color: #fff;
}
div.styles1061 .calloutalign {
   text-align: center;
}
<style type="text/css">
  .ebsco-single-search *,.ebsco-single-search *::before,.ebsco-single-search *::after{box-sizing:border-box;font:inherit;margin:0;}
  .ebsco-single-search input,.ebsco-single-search button,.ebsco-single-search select{margin:0}
.flexbox-container { height: 80px; display: flex; justify-content: space-around; align-items:center; background-color:#30293c; border: 12px solid #9a90a9;}
.flexbox-item {width: 250px; margin: 0 auto; border: 3px solid #333; background-color: #693496; align-items: center; justify-content: center;}
.item1 {min-height: 100px; }
.item2 {min-height: 100px; }
.item3 {min-height: 100px; position: relative; }
  .eb-search-container{ flex-flow:row wrap; justify-content: space-around; margin: 0px; height:200px; line-height:1.5; background-color: #30293c; border: 12px solid #9a90a9;}
  .eb-search-container>*{ position: relative; top: -120px; padding:12px}
  .eb-search-container__title{ position: relative; top: -60px; font-weight:400;font-size:1.5em;color:white;letter-spacing:-.05em;text-align:left}
  .eb-search__box>*{flex:1 100%;line-height:normal;}
  .eb-search__box{border-radius:.25em;display:flex;flex-wrap:wrap;font-size:1.25em}
  .eb-search__input-bquery{background:#fff;border:1px solid #A29061;border-bottom-color:transparent;border-radius:.25em .25em 0 0;padding:.75em}
  .eb-search__input-bquery:focus{color:#333}
  .eb-search__submit-button{-webkit-appearance:button;background:#A29061;border:1px solid #A29061;border-radius:0 0 .25em .25em;box-shadow:0 2px 4px 0 rgba(0,0,0,.20);color:43215F;cursor:pointer;overflow:visible;padding:.5em 1.25em;text-align:center;white-space:nowrap}
  .eb-search__submit-text{display:inline-flex;overflow:hidden}
  .eb-filter-container{padding-bottom:0}
  .eb-search__label{align-items:center;display:inline-flex;white-space:nowrap;width:100%}
  .eb-search__input{height:1.1em}
  .eb-search__span{padding:0 .5em}
  .eb-adv-search{padding-right:1em;text-align:right;white-space:nowrap}
  a.eb-adv-search__link{text-decoration-skip-ink:auto}
  .eb-sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}
  @media only screen and (min-width: 768px) {
    .eb-search-container{padding:.75em}
    .eb-search__box{flex-wrap:nowrap;height:2.8em;box-shadow:0 2px 4px 0 rgba(0,0,0,.20)}
    .eb-search__input-bquery{border-bottom-color:#A29061;border-radius:.25em 0 0 .25em;border-right-color:transparent;width:100%}
    .eb-search__submit-button{border-radius:0 .25em .25em 0;box-shadow:none;flex:0 0 auto}
    .eb-filter-container{flex:1;padding-left:1em;padding-bottom:.75em}
    .eb-search__label{width:auto}
  }
</style>
div.styles1056 .ebsco-single-search *,.ebsco-single-search *::before,.ebsco-single-search *::after{box-sizing:border-box;font:inherit;margin:0}
div.styles1056 .ebsco-single-search input,.ebsco-single-search button,.ebsco-single-search select{margin:0}
div.styles1056 .eb-search-container{display:flex;flex-flow:row wrap;line-height:1.5}
div.styles1056 .eb-search-container>*{flex:1 100%;padding:12px}
div.styles1056 .eb-search-container__title{font-weight:400;font-size:1.5em;letter-spacing:-.05em;text-align:center}
div.styles1056 .eb-search__box>*{flex:1 100%;line-height:normal}
div.styles1056 .eb-search__box{border-radius:.25em;display:flex;flex-wrap:wrap;font-size:1.25em}
div.styles1056 .eb-search__input-bquery{background:#fff;border:1px solid A29061;border-bottom-color:transparent;border-radius:.25em .25em 0 0;padding:.75em}
div.styles1056 .eb-search__input-bquery:focus{color:#333}
div.styles1056 .eb-search__submit-button{-webkit-appearance:button;background:A29061;border:1px solid A29061;border-radius:0 0 .25em .25em;box-shadow:0 2px 4px 0 rgba(0,0,0,.20);color:43215F;cursor:pointer;overflow:visible;padding:.5em 1.25em;text-align:center;white-space:nowrap}
div.styles1056 .eb-search__submit-text{display:inline-flex;overflow:hidden}
div.styles1056 .eb-filter-container{padding-bottom:0}
div.styles1056 .eb-search__label{align-items:center;display:inline-flex;white-space:nowrap;width:100%}
div.styles1056 .eb-search__input{height:1.1em}
div.styles1056 .eb-search__span{padding:0 .5em}
div.styles1056 .eb-adv-search{padding-right:1em;text-align:right;white-space:nowrap}
  a.eb-adv-search__link{text-decoration-skip-ink:auto}
div.styles1056 .eb-sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}
  @media only screen and (min-width: 768px) {
div.styles1056  .eb-search-container{padding:.75em}
div.styles1056  .eb-search__box{flex-wrap:nowrap;height:2.8em;box-shadow:0 2px 4px 0 rgba(0,0,0,.20)}
div.styles1056  .eb-search__input-bquery{border-bottom-color:A29061;border-radius:.25em 0 0 .25em;border-right-color:transparent;width:100%}
div.styles1056  .eb-search__submit-button{border-radius:0 .25em .25em 0;box-shadow:none;flex:0 0 auto}
 div.styles1056  .eb-filter-container{flex:1;padding-left:1em;padding-bottom:.75em}
div.styles1056  .eb-search__label{width:auto}
  }
div.styles1003 #library_chat {width: 90%; height: 400px;}
/*
* Create a widget style with this code
* Apply this to the 3 content widgets that contain the list of course links
* Bonus: This `widget style` will also give you a class that you can use
* to target with JS rather than looking for `'widget-row')['1']`
* it'll be something like: style1035;
*/
div.styles1006 ul {
  list-style: none;
  padding-left: 0;
}

div.styles1006 ul ul {
    margin-bottom: 0.375rem;
    margin-left: 0.75rem;
}
div.styles1042 {
overflow: auto;
display: block;
margin: 0.5em;
background: #e9e9e9;
padding: 0px;
    font-family: Akzidenz Grotesk;
    font-weight: 400;
    font-size: 1.1em;
}

div.styles1042 .boxed__standout {
border-top: 0;
}

div.styles1042: h2 hover {
color: #b69d76;
}

div.styles1042 h2 {
    font-size: 1.4em;
    color: #ffffff;
    padding: 0em;
    margin: 0.25em 0em;
}

div.styles1042 h2 a,  div.styles1042 .onlinebox h2 a,
div.styles1042 h2 a:visited,  div.styles1042 .onlinebox h2 a:visited {
   color: #ffffff !important;
   text-decoration: none;
}



div.styles1042 .calloutalign {
   text-align: center;
}

div.styles1042 .onlinebox {
    background-color: #43215f;
   /*padding-top: -50px;*/
   /*padding-left: 5px;*/
text-align: center;
}

div.styles1042 .onlineboxcopy {
    height: 16em;
    padding: 0em 1.5em;
}
div.styles1051 {
overflow: auto;
text-overflow: ellipsis;
display: block;
font-family: Akzidenz Grotesk;
font-weight: 400;
font-size: 1.1em;
margin: 1.0em 0.35em;
}

div.styles1051 .boxed__standout {
border-top: 0;
}

div.styles1051: h2 hover {
color: #b69d76;
}

div.styles1051 h2 {
font-size: 1.6em;
margin-bottom: 10px;
margin-left: 10px;
margin-right: 10px;
letter-spacing: -1px;
line-height: 1.1em;
color: #ffffff;
}

div.styles1051 h2 a {
   color: #fffffff !important;
   underline: none;
}

div.styles1051 h2 a:visited {
   color: #fff;
}

div.styles1051 .calloutalign {
   text-align: center;
}

div.styles1051 .topbox {
  /* For desktop */
  border-radius: 15px 15px 0px 0px;
  background: #d8d0bf;
  padding: 11%;
  width: 100%;
  min-height: 30em;
}

div.styles1051 .bottombox {
  /* For desktop */
  border-radius: 0px 0px 15px 15px;
  background: #43215F;
  padding: 20px;
  width: 100%;
  min-height: 24vh;
}

div.styles1051 .testimonialimage {

    width: 60%;
    margin-top: -50%;
margin-left: 20%;
margin-right: 20%;
    padding-top: 15%; // arbitrary
    position: relative;
}
div.styles1043 {
overflow: hidden;
display: block;
padding: 1.5em;
background: #91713e;
    font-family: Akzidenz Grotesk;
    font-weight: 400;
    font-size: 1.1em;
    font-color: #ffffff;
height: 160px;
margin-right: -50px;
}

div.styles1043 .boxed__standout {
border-top: 0;
}

div.styles1043: h2 hover {
color: #b69d76;
}

div.styles1043 h2 {
font-size: 1.6em;
margin-bottom: 20px;
margin-left: 10px;
margin-right: 10px;
letter-spacing: -1px;
line-height: 1.1em;
color: #ffffff;
}

div.styles1043 h2 a {
   color: #fffffff !important;
   underline: none;
}

div.styles1043 h2 a:visited {
   color: #fff;
}

div.styles1043 .calloutalign {
   text-align: center;
}

div.styles1043 ul {
    color: #ffffff;
    font-size: 1.2em;
    line-height: 1em;
}

div.styles1043 .button {
    font-size: 2.5rem;
    line-height: 2.25rem;
    padding: 0.375rem 1.125rem;
    background-color: #91713e;
    border: 5px solid #ffffff;
    color: #fff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed";
    text-align: center;
    text-transform: uppercase;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1005 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1005 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1005 {
         min-height: 27em;
    }
}
 div.styles1005::before {
     background-color: #a08e63;
     background-image: url("https://www.butlercc.edu/images/social_bg_butler.jpg");
     background-position: center center;
     background-size: cover;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}
 div.styles1005 h3 {
     margin: 0;
     font-size: 2rem;
     line-height: 2.25rem;
}
 div.styles1005 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1005 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1005 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1005 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1005 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1005 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
div.styles1121
{
padding: 0 1.5rem;
}
div.styles1004 img {
    border: 5px solid #513f59;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    display: inline;
    max-width: auto;
}
div.styles1096 {
margin-right: 0px;
overflow: auto;
display: block;
margin: 8px -3px;
background: #e9e9e9;
padding: 0 5px;
    font-family: Akzidenz Grotesk;
    font-weight: 400;
    font-size: 1.1em;
}

div.styles1096 .boxed__standout {
border-top: 0;
}

div.styles1096: h2 hover {
color: #b69d76;
}

div.styles1096 h2 {
font-size: 1.6em;
margin-bottom: 10px;
margin-left: 10px;
margin-right: 10px;
letter-spacing: -1px;
line-height: 1.1em;
color: #ffffff;
}

div.styles1096 h2 a {
   color: #fffffff !important;
   underline: none;
}

div.styles1096 h2 a:visited {
   color: #fff;
}

div.styles1096 .calloutalign {
   text-align: center;
}

div.styles1096 .onlinebox {
    background-color: #43215f;
   padding-top: -50px;
   padding-left: 5px;
}

div.styles1096 .onlineboxcopy {
    height: 230px;
}
div.styles1095 {
overflow: auto;
text-overflow: ellipsis;
display: block;
font-family: Akzidenz Grotesk;
font-weight: 400;
font-size: 1.1em;
margin-bottom: 20px;
}

div.styles1095 .boxed__standout {
border-top: 0;
}

div.styles1095: h2 hover {
color: #b69d76;
}

div.styles1095 h2 {
font-size: 1.6em;
margin-bottom: 10px;
margin-left: 10px;
margin-right: 10px;
letter-spacing: -1px;
line-height: 1.1em;
color: #ffffff;
}

div.styles1095 h2 a {
   color: #fffffff !important;
   underline: none;
}

div.styles1095 h2 a:visited {
   color: #fff;
}

div.styles1095 .calloutalign {
   text-align: center;
}

div.styles1095 .topbox {
  /* For desktop */
  border-radius: 15px 15px 0px 0px;
  background: #d8d0bf;
  padding: 11%;
  width: 100%;
  min-height: 455px;
}

div.styles1095 .bottombox {
  /* For desktop */
  border-radius: 0px 0px 15px 15px;
  background: #43215F;
  padding: 20px;
  width: 100%;
  min-height: 24vh;
}

div.styles1095 .testimonialimage {
    float: left;
    width: 60%;
    margin-top: -50%;
margin-left: 20%;
margin-right: 20%;
    padding-top: 15%; // arbitrary
    position: relative;
}
div.styles1076 {
margin-right: 5.98694%;
overflow: auto;
display: block;
margin: 10px -10px;
background: #513f59;
color: #fff;
text-shadow: 0px 1px 1px #3d2545;
border-top: 10px solid #3d2545;
padding: 0.5em;
min-height: 350px;
}

div.styles1076 .boxed__standout {
border-top: 0;
}

div.styles1076:hover {
color: #b69d76;
}
div.styles1076 img {
width: 100%;
color: #fff;
text-shadow: 0px 1px 1px #3d2545;
}
div.styles1076 p {
font-size: .9em;
margin-bottom: 5px;
line-height: 1.4em;
color: #fff;
padding: 10px;
}
div.styles1076 ul {
font-size: .9em;
margin-bottom: 5px;
color: #fff;
}

div.styles1076 h2 {
margin-bottom: 5px;
letter-spacing: -1px;
line-height: 1.1em;
color: #fff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    font-size: 1.4em;
    text-transform: uppercase;
}

div.styles1076 h3 {
font-size: 1 em;
margin-bottom: 10px;
letter-spacing: -1px;
line-height: 1.1em;
color: #fff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    font-size: .8em;
    text-transform: uppercase;
}

div.styles1076 h3 a {
   color: #fff;
}

div.styles1076 h3 a:visited {
   color: #fff;
}
div.styles1076 a:visited {
    color: #fff;
}
div.styles1076 a {
    color: #fff;
    text-decoration: none;
}
div.styles1076 .callout {
    color: #fff;
}
div.styles1076 .callout a:visited {
    color: #fff;
}
div.styles1076 .calloutalign {
   text-align: center;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1071 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1071 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1071 {
         min-height: 10em;
    }
}
 div.styles1071::before {
     background-color: #42235e;
     background-position: center center;
     background-size: cover;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}
 div.styles1071 h2 {
    color: #a08e63;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 2.25rem;
}
 div.styles1071 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1071 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1071 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1071 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1071 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1071 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
div.styles1071 .item-list {
    font-size: 1.5rem;
    line-height: 2.25rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: center;
        justify-content: center;
    margin: 0;
    text-transform: uppercase; }

  div.styles1071 li {
    margin: 0.75rem 0 0;
    -ms-flex-align: center;
        align-items: center;
    display: -ms-flexbox;
    display: flex;
    width: 100%; }
    @media (min-width: 32.5em) and (max-width: 46.24em) {
      div.styles1071 li {
        padding: 0 1.5rem; } }
    @media (min-width: 32.5em) {
      div.styles1071 li {
        padding: 0 0.75rem;
        /*width: 50%;*/ } }
    @media (min-width: 61.25em) {
      div.styles1071 li {
        padding: 0 1.5rem; } }

  div.styles1071 a {
    font-size: 1.5rem;
    color: #ffffff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed"; }
   }
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1072 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1072 {
     padding: .25rem 0 .15rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1072 {
         min-height: 10em;
    }
}
 div.styles1072::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(163, 145, 97, 0.85),
         rgba(163, 145, 97, 0.85)
       ),
       /* bottom, image */
       /* bottom, image */
       url("https://www.butlercc.edu/images/andover_5000_building_background.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}
 div.styles1072 h2 {
    color: #a08e63;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 2.25rem;
}
 div.styles1072 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1072 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1072 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1072 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1072 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1072 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
div.styles1072 .item-list {
    font-size: 1.5rem;
    line-height: 2.25rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: center;
        justify-content: center;
    margin: 0;
    text-transform: uppercase; }

  div.styles1072 li {
    margin: 0.75rem 0 0;
    -ms-flex-align: center;
        align-items: center;
    display: -ms-flexbox;
    display: flex;
    width: 100%; }
    @media (min-width: 32.5em) and (max-width: 46.24em) {
      div.styles1072 li {
        padding: 0 1.5rem; } }
    @media (min-width: 32.5em) {
      div.styles1072 li {
        padding: 0 0.75rem;
        /*width: 50%;*/ } }
    @media (min-width: 61.25em) {
      div.styles1072 li {
        padding: 0 1.5rem; } }

  div.styles1072 a {
    font-size: 1.5rem;
    color: #ffffff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed"; }
   }
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1041 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1041 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 
 div.styles1041::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(67, 33, 95, 0.75),
         rgba(67, 33, 95, 0.75)
       ),
      /* bottom, image */
     url("https://www.butlercc.edu/images/Butler_Online_Student_Background.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1041 h2 {
    color: #ffffff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1041 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1041 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1041 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1041 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1041 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1041 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1089 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1089 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 
 div.styles1089::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(67, 33, 95, 0.75),
         rgba(67, 33, 95, 0.75)
       ),
      /* bottom, image */
     url("https://www.butlercc.edu/images/careerservicesbackground.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1089 h2 {
    color: #ffffff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1089 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1089 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1089 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1089 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1089 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1089 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1031 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1031 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 
 div.styles1031::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(255, 255, 255, 0.65),
         rgba(255, 255, 255, 0.65)
       ),
      /* bottom, image */
     url("https://www.butlercc.edu/images/coronavirus.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1031 h2 {
    color: #42235e;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1031 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1031 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1031 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1031 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1031 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1031 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1048 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1048 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1048 {
         min-height: 10em;
    }
}
 div.styles1048::before {
     background-color: #42235e;
     background-position: center center;
     background-size: cover;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}
 div.styles1048 h2 {
    color: #a08e63;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 2.25rem;
}
 div.styles1048 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1048 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1048 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1048 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1048 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1048 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
div.styles1048 .item-list {
    font-size: 1.5rem;
    line-height: 2.25rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: center;
        justify-content: center;
    margin: 0;
    text-transform: uppercase; }

  div.styles1048 li {
    margin: 0.75rem 0 0;
    -ms-flex-align: center;
        align-items: center;
    display: -ms-flexbox;
    display: flex;
    width: 100%; }
    @media (min-width: 32.5em) and (max-width: 46.24em) {
      div.styles1048 li {
        padding: 0 1.5rem; } }
    @media (min-width: 32.5em) {
      div.styles1048 li {
        padding: 0 0.75rem;
        /*width: 50%;*/ } }
    @media (min-width: 61.25em) {
      div.styles1048 li {
        padding: 0 1.5rem; } }

  div.styles1048 a {
    font-size: 1.5rem;
    color: #ffffff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed"; }
   }
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1077 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1077 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 
 div.styles1077::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(67, 33, 95, 0.75),
         rgba(67, 33, 95, 0.75)
       ),
      /* bottom, image */
     url("https://www.butlercc.edu/images/early_college_academy_sign.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1077 h2 {
    color: #ffffff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1077 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1077 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1077 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1077 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1077 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1077 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1094 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1094 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 
 div.styles1094::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(67, 33, 95, 0.75),
         rgba(67, 33, 95, 0.75)
       ),
      /* bottom, image */
     url("https://www.butlercc.edu/images/hispanic_heritage_month_background.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1094 h2 {
    color: #ffffff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1094 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1094 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1094 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1094 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1094 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1094 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1057 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1057 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1057 {
         min-height: 10em;
    }
}
 div.styles1057::before {
     background-color: #42235e;
     background-position: center center;
     background-size: cover;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}
 div.styles1057 h2 {
    color: #a08e63;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 2.25rem;
}
 div.styles1057 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1057 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1057 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1057 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1057 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1057 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
div.styles1057 .item-list {
    font-size: 1.5rem;
    line-height: 2.25rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: center;
        justify-content: center;
    margin: 0;
    text-transform: uppercase; }

  div.styles1057 li {
    margin: 0.75rem 0 0;
    -ms-flex-align: center;
        align-items: center;
    display: -ms-flexbox;
    display: flex;
    width: 100%; }
    @media (min-width: 32.5em) and (max-width: 46.24em) {
      div.styles1057 li {
        padding: 0 1.5rem; } }
    @media (min-width: 32.5em) {
      div.styles1057 li {
        padding: 0 0.75rem;
        /*width: 50%;*/ } }
    @media (min-width: 61.25em) {
      div.styles1057 li {
        padding: 0 1.5rem; } }

  div.styles1057 a {
    font-size: 1.5rem;
    color: #ffffff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed"; }
   }
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1058 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1058 {
     top-padding: 1.5rem;
     bottom-padding: 0;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: end;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 
 div.styles1058::before {
     background-color: #a08e63;
     background:
      /* bottom, image */
     url("https://www.butlercc.edu/images/laid_off_background.jpg");
     background-position: center center;
     background-size: cover;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1058 h2 {
    color: #ffffff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 5rem;
    line-height: 4.25rem;
}
 div.styles1058 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1058 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1058 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1058 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1058 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1058 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1059 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1059 {
     padding: 0;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 
 div.styles1059::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(67, 33, 95, 0.75),
         rgba(67, 33, 95, 0.75)
       ),
      /* bottom, image */
     url("https://www.butlercc.edu/images/Butler_Online_Student_Background.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1059 h2 {
    color: #ffffff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1059 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1059 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1059 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1059 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1059 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1059 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1044 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1044 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 
 div.styles1044::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(67, 33, 95, 0.75),
         rgba(67, 33, 95, 0.75)
       ),
      /* bottom, image */
     url("https://www.butlercc.edu/images/oer_background_image.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1044 h2 {
    color: #ffffff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1044 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1044 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1044 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1044 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1044 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1044 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1075 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1075 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 
 div.styles1075::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(67, 33, 95, 0.75),
         rgba(67, 33, 95, 0.75)
       ),
      /* bottom, image */
     url("https://www.butlercc.edu/images/tutoring_header_version_3.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1075 h2 {
    color: #ffffff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 5rem;
    line-height: 8rem;
}
 div.styles1075 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1075 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1075 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1075 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1075 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1075 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1033 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1033 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 
 div.styles1033::before {
     background:
       /* top, transparent #000000, faked with gradient */ 
       linear-gradient(
         rgba(255, 255, 255, 0.10),
         rgba(255, 255, 255, 0.10)
       ),
      /* bottom, image */
     url("https://www.butlercc.edu/images/matrix_background.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1033 h2 {
    color: #00ff41;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
   -webkit-text-stroke: 1px black;
   text-shadow:
       3px 3px 0 #000,
     -1px -1px 0 #000,  
      1px -1px 0 #000,
      -1px 1px 0 #000,
       1px 1px 0 #000;
}
 div.styles1033 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1033 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1033 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1033 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1033 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1033 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1063 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1063 {
     top-padding: 1.5rem;
     bottom-padding: 0;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: end;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 
 div.styles1063::before {
     background-color: #a08e63;
     background:
      /* bottom, image */
     url("https://www.butlercc.edu/images/background_texture_metal_plate.jpg");
     background-position: center center;
     background-repeat: repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1063 h2 {
    color: #ffffff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 5rem;
    line-height: 4.25rem;
}
 div.styles1063 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1063 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1063 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1063 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1063 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1063 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1023 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1023 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 
 div.styles1023::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(255, 255, 255, 0.85),
         rgba(255, 255, 255, 0.85)
       ),
      /* bottom, image */
     url("https://www.butlercc.edu/images/5000_Building_Rendering_Plan.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1023 h2 {
    color: #42235e;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1023 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1023 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1023 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1023 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1023 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1023 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1065 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1065 {
     padding: .75rem 0 .5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1065 {
         min-height: 27em;
    }
}
 div.styles1065::before {
     background-color: #43215e;
     background:
       /* top, transparent #43215e, faked with gradient */ 
       linear-gradient(
         rgba(67, 33, 94, 0.85),
         rgba(67, 33, 94, 0.85)
       ),
       /* bottom, image */
       url("https://www.butlercc.edu/images/12.12.19_Advising_0008.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1065 h2 {
    color: #fff;
    font-color: #fff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1065 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1065 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1065 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1065 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1065 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1065 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1068 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1068 {
     padding: .75rem 0 .5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1068 {
         min-height: 27em;
    }
}
 div.styles1068::before {
     background-color: #43215e;
     background:
       /* top, transparent #43215e, faked with gradient */ 
       linear-gradient(
         rgba(67, 33, 94, 0.85),
         rgba(67, 33, 94, 0.85)
       ),
       /* bottom, image */
       url("https://www.butlercc.edu/images/12.12.19_Advising_0008.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1068 h2 {
    color: #fff;
    font-color: #fff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 300;
    margin: 0;
    font-size: 3rem;
    line-height: 2.5rem;
}
 div.styles1068 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1068 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1068 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1068 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1068 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1068 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1070 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1070 {
     padding: .75rem 0 .5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1070 {
         min-height: 27em;
    }
}
 div.styles1070::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(163, 145, 97, 0.85),
         rgba(163, 145, 97, 0.85)
       ),
       /* bottom, image */
       url("https://www.butlercc.edu/images/Butler_Map.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1070 h2 {
    color: #42235e;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1070 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1070 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1070 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1070 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1070 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1070 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1062 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1062 {
     padding: .75rem 0 .5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1062 {
         min-height: 27em;
    }
}
 div.styles1062::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(163, 145, 97, 0.85),
         rgba(163, 145, 97, 0.85)
       ),
       /* bottom, image */
       url("https://www.butlercc.edu/images/career_services_background.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1062 h2 {
    color: #42235e;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1062 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1062 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1062 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1062 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1062 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1062 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1067 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1067 {
     padding: .75rem 0 .5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1067 {
         min-height: 27em;
    }
}
 div.styles1067::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(163, 145, 97, 0.85),
         rgba(163, 145, 97, 0.85)
       ),
       /* bottom, image */
       url("https://www.butlercc.edu/images/career_services_background.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1067 h2 {
    color: #42235e;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 300;
    margin: 0;
    font-size: 3rem;
    line-height: 2.5rem;
}
 div.styles1067 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1067 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1067 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1067 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1067 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1067 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1098 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1098 {
     padding: 6.0rem 0.0rem 6.0rem 0.0rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 
 div.styles1098::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(67, 33, 95, 0.75),
         rgba(67, 33, 95, 0.75)
       ),
      /* bottom, image */
     url("https://www.butlercc.edu/images/creative_cloud_hero_1920x800.jpg");
     background-position: top center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1098 h2 {
    color: #ffffff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1098 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1098 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1098 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1098 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1098 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1098 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1060 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1060 {
     padding: .75rem 0 .5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1060 {
         min-height: 27em;
    }
}
 div.styles1060::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(163, 145, 97, 0.85),
         rgba(163, 145, 97, 0.85)
       ),
       /* bottom, image */
       url("https://www.butlercc.edu/images/Laid_Off___Welding_girls_background.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1060 h2 {
    color: #42235e;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1060 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1060 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1060 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1060 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1060 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1060 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1034 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1034 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1034 {
         min-height: 10em;
    }
}
 div.styles1034::before {
     background-color: #003b00;
     background-position: center center;
     background-size: cover;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}
 div.styles1034 h2 {
    color: #a08e63;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 2.25rem;
}
 div.styles1034 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1034 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1034 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1034 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1034 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1034 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
div.styles1034 .item-list {
    font-size: 1.5rem;
    line-height: 2.25rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: center;
        justify-content: center;
    margin: 0;
    text-transform: uppercase; }

  div.styles1034 li {
    margin: 0.75rem 0 0;
    -ms-flex-align: center;
        align-items: center;
    display: -ms-flexbox;
    display: flex;
    width: 100%; }
    @media (min-width: 32.5em) and (max-width: 46.24em) {
      div.styles1034 li {
        padding: 0 1.5rem; } }
    @media (min-width: 32.5em) {
      div.styles1034 li {
        padding: 0 0.75rem;
        /*width: 50%;*/ } }
    @media (min-width: 61.25em) {
      div.styles1034 li {
        padding: 0 1.5rem; } }

  div.styles1034 a {
    font-size: 1.5rem;
    line-height: 2.25rem;
    padding: 0.375rem 1.125rem;
    background-color: #008f11;
    border: 0;
    color: #fff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed";
    text-align: center;
    text-transform: uppercase;
    transition: background-color .125s ease-in-out, color .125s ease-in-out;
    text-decoration: none;
    color: #fff;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-positive: 1;
        flex-grow: 1;
    height: 100%;
    -ms-flex-pack: center;
        justify-content: center; }
    div.styles1034 a:hover,
    div.styles1034 a:active,
    div.styles1034 a:focus {
      background-color: #003b00;
      opacity: 1; }
   div.styles1034 a:visited {
      color: #ffffff;
   }
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1035 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1035 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1035 {
         min-height: 27em;
    }
}
 div.styles1035::before {
     background-color: #003b00;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(0, 59, 0, 0.45),
         rgba(0, 59, 0, 0.45)
       ),
       /* bottom, image */
       url("https://www.eldoks.com/ImageRepository/Path?filePath=%2Fdocuments%5CIntranet%5C58%2Fwelcome+center_201411251509191823.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1035 h2 {
    color: #42235e;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1035 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1035 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1035 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1035 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1035 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1035 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}

  div.styles1035 a {
    font-size: 1.5rem;
    line-height: 2.25rem;
    padding: 0.375rem 1.125rem;
    background-color: #008f11;
    align: center;
    width: 300px;
    border: 0;
    color: #ffffff !important;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed";
    text-align: center;
    text-transform: uppercase;
    transition: background-color .125s ease-in-out, color .125s ease-in-out;
    text-decoration: none;
    color: #fffffff;
    display: -ms-flexbox;
    display: inline-block;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-positive: 1;
        flex-grow: 1;
    height: 100%;
    -ms-flex-pack: center;
        justify-content: center; }
    div.styles1035 a:hover,
    div.styles1035 a:active,
    div.styles1035 a:focus {
      background-color: #003b00;
      opacity: 1; }
   div.styles1035 a:visited {
      color: #ffffff;
   }
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1013 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1013 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1013 {
         min-height: 27em;
    }
}
 div.styles1013::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(163, 145, 97, 0.85),
         rgba(163, 145, 97, 0.85)
       ),
       /* bottom, image */
       url("https://www.butlercc.edu/images/140311_BCCC_0884_3173348967_O.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1013 h2 {
    color: #42235e;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1013 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1013 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1013 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1013 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1013 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1013 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1014 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1014 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1014 {
         min-height: 10em;
    }
}
 div.styles1014::before {
     background-color: #42235e;
     background-position: center center;
     background-size: cover;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}
 div.styles1014 h2 {
    color: #a08e63;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1014 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1014 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1014 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1014 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1014 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1014 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
div.styles1014 .item-list {
    font-size: 1.5rem;
    line-height: 2.25rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: center;
        justify-content: center;
    margin: 0;
    text-transform: uppercase; }

  div.styles1014 li {
    margin: 0.75rem 0 0;
    -ms-flex-align: center;
        align-items: center;
    display: -ms-flexbox;
    display: flex;
    width: 100%; }
    @media (min-width: 32.5em) and (max-width: 46.24em) {
      div.styles1014 li {
        padding: 0 1.5rem; } }
    @media (min-width: 32.5em) {
      div.styles1014 li {
        padding: 0 0.75rem;
        /*width: 50%;*/ } }
    @media (min-width: 61.25em) {
      div.styles1014 li {
        padding: 0 1.5rem; } }

  div.styles1014 a {
    font-size: 1.5rem;
    line-height: 2.25rem;
    padding: 0.375rem 1.125rem;
    background-color: #786636;
    border: 0;
    color: #fff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed";
    text-align: center;
    text-transform: uppercase;
    transition: background-color .125s ease-in-out, color .125s ease-in-out;
    text-decoration: none;
    color: #fff;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-positive: 1;
        flex-grow: 1;
    height: 100%;
    -ms-flex-pack: center;
        justify-content: center; }
    div.styles1014 a:hover,
    div.styles1014 a:active,
    div.styles1014 a:focus {
      background-color: #42235e;
      opacity: 1; }
   div.styles1014 a:visited {
      color: #ffffff;
   }
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1015 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1015 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1015 {
         min-height: 15em;
    }
}
 div.styles1015::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(255, 255, 255, 0.85),
         rgba(255, 255, 255, 0.85)
       ),
       /* bottom, image */
       url("https://www.butlercc.edu/images/140311_BCCC_0884_3173348967_O.jpg");
     background-position: center center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}


 div.styles1015 h2 {
    color: #42235e;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
@media (max-width: 40em) {
div.styles1015 h2 {
    line-height: 3.2rem;
}
}

 div.styles1015 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1015 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1015 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1015 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1015 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1015 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1016 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1016 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1016 {
         min-height: 10em;
    }
}
 div.styles1016::before {
     background-color: #fff;
     background-position: center center;
     background-size: cover;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}
 div.styles1016 h2 {
    color: #42235e;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 2.4rem;
    line-height: 2.25rem;
}
 div.styles1016 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1016 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1016 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1016 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1016 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1016 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
div.styles1016 .item-list {
    font-size: 1.5rem;
    line-height: 2.25rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: center;
        justify-content: center;
    margin: 0;
    text-transform: uppercase; }

  div.styles1016 li {
    margin: 0.75rem 0 0;
    -ms-flex-align: center;
        align-items: center;
    display: -ms-flexbox;
    display: flex;
    width: 100%; }
    @media (min-width: 32.5em) and (max-width: 46.24em) {
      div.styles1016 li {
        padding: 0 1.5rem; } }
    @media (min-width: 32.5em) {
      div.styles1016 li {
        padding: 0 0.75rem;
        /*width: 50%;*/ } }
    @media (min-width: 61.25em) {
      div.styles1016 li {
        padding: 0 1.5rem; } }

  div.styles1016 a {
    font-size: 1.5rem;
    line-height: 2.25rem;
    padding: 0.375rem 1.125rem;
    background-color: #786636;
    border: 0;
    color: #fff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed";
    text-align: center;
    text-transform: uppercase;
    transition: background-color .125s ease-in-out, color .125s ease-in-out;
    text-decoration: none;
    color: #fff;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-positive: 1;
        flex-grow: 1;
    height: 100%;
    -ms-flex-pack: center;
        justify-content: center; }
    div.styles1016 a:hover,
    div.styles1016 a:active,
    div.styles1016 a:focus {
      background-color: #42235e;
      opacity: 1; }
   div.styles1016 a:visited {
      color: #ffffff;
   }
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1113 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1113 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1113 {
         min-height: 25em;
    }
}


 div.styles1113::before {

     background-color: #a08e63;
     background:
       
       url("https://www.butlercc.edu/images/direct_enroll_student_hero_purple.jpg");
     background-position: inherit;
     background-size: contain;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     box-sizing: unset;
     z-index: -1;
}

 div.styles1113 h2 {
    color: #ffffff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
@media (max-width: 40em) {
div.styles1113 h2 {
    line-height: 3.2rem;
}
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1047 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1047 {
     padding: 3.75rem 0 4.5rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1047 {
         min-height: 27em;
    }
}


 div.styles1047 h2 {
    color: #42235e;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 3.25rem;
}
 div.styles1047 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1047 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1047 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1047 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1047 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1047 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1088 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1088 {
     padding: .25rem 0 .15rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1088 {
         min-height: 10em;
    }
}
 div.styles1088::before {
     background-color: #ffffff;
     width: 100vw;
     z-index: -1;
}
 div.styles1088 h2 {
    color: #a08e63;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 2.25rem;
}
 div.styles1088 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1088 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1088 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1088 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1088 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1088 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
div.styles1088 .item-list {
    font-size: 1.5rem;
    line-height: 2.25rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: center;
        justify-content: center;
    margin: 0;
    text-transform: uppercase; }

  div.styles1088 li {
    margin: 0.75rem 0 0;
    -ms-flex-align: center;
        align-items: center;
    display: -ms-flexbox;
    display: flex;
    width: 100%; }
    @media (min-width: 32.5em) and (max-width: 46.24em) {
      div.styles1088 li {
        padding: 0 1.5rem; } }
    @media (min-width: 32.5em) {
      div.styles1088 li {
        padding: 0 0.75rem;
        /*width: 50%;*/ } }
    @media (min-width: 61.25em) {
      div.styles1088 li {
        padding: 0 1.5rem; } }

  div.styles1088 a {
    font-size: 1.5rem;
    color: #ffffff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed"; }
   }
/* Create a widget style with this code and apply it to your custom search */
/* This code will hide the H1 & Breadcrumb when your `widget--bcc-page-search-navigation` is the first widget on the page */
 .js .hidden-header .page-heading, .js .hidden-header .nav--breadcrumb {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
     margin: -1px;
     overflow: hidden;
     padding: 0;
     position: absolute;
     width: 1px;
}
 .js .hidden-header .site-main {
     padding-top: 0;
}
 .js .hidden-header .site-content__inner {
     margin-top: 0;
}

/* You may wish to-do something different here, but it will stop you guys having to deal with browsers without js. Perhaps after go live, we could revisit this. */
 .no-js div.styles1064 {
     display: none;
}

/* Code required to style your search bar as requested */
 div.styles1064 {
     padding: .25rem 0 .15rem;
     background: transparent;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: column;
     flex-direction: column;
     -ms-flex-pack: center;
     justify-content: center;
     max-width: 63rem;
     position: relative;
     text-align: left;
     width: 100%;
}
 @media (min-width: 46.25em) {
     div.styles1064 {
         min-height: 10em;
    }
}
 div.styles1064::before {
     background-color: #a08e63;
     background:
       /* top, transparent #a08e63, faked with gradient */ 
       linear-gradient(
         rgba(163, 145, 97, 0.85),
         rgba(163, 145, 97, 0.85)
       ),
       /* bottom, image */
       /* bottom, image */
       url("https://www.butlercc.edu/images/education_1580143_1280.jpg");
     background-position: bottom center;
     background-size: cover;
     background-attachment: fixed;
     background-repeat: no-repeat;
     bottom: 0;
     content: '';
     left: 50%;
     margin-left: -50vw;
     position: absolute;
     top: 0;
     width: 100vw;
     z-index: -1;
}
 div.styles1064 h2 {
    color: #a08e63;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0;
    font-size: 4rem;
    line-height: 2.25rem;
}
 div.styles1064 .awesomplete {
     display: block;
     margin: .5em 0 0;
}
 div.styles1064 .awesomplete > input {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 1.875rem 1.65rem;
     background: #fff;
     border: 0;
     color: #464646;
     display: block;
     width: 100%;
}
 div.styles1064 .awesomplete > ul {
     padding: .3em 0;
     width: 100%;
}
 div.styles1064 .awesomplete > ul > li {
     font-size: 1.25rem;
     line-height: 1.6875rem;
     margin: 0;
     padding: 0.15rem 1.65rem;
}
 div.styles1064 .awesomplete > ul > li:hover {
     background: #7e3d8f;
     color: #fff;
}
 div.styles1064 .awesomplete li:hover mark {
     background: #56006b;
     color: #fff;
}
div.styles1064 .item-list {
    font-size: 1.5rem;
    line-height: 2.25rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: center;
        justify-content: center;
    margin: 0;
    text-transform: uppercase; }

  div.styles1064 li {
    margin: 0.75rem 0 0;
    -ms-flex-align: center;
        align-items: center;
    display: -ms-flexbox;
    display: flex;
    width: 100%; }
    @media (min-width: 32.5em) and (max-width: 46.24em) {
      div.styles1064 li {
        padding: 0 1.5rem; } }
    @media (min-width: 32.5em) {
      div.styles1064 li {
        padding: 0 0.75rem;
        /*width: 50%;*/ } }
    @media (min-width: 61.25em) {
      div.styles1064 li {
        padding: 0 1.5rem; } }

  div.styles1064 a {
    font-size: 1.5rem;
    color: #ffffff;
    cursor: pointer;
    font-family: "Akzidenz Grotesk Condensed"; }
   }
div.styles1066 {
margin-right: 5.98694%;
overflow: auto;
display: block;
margin: 10px -10px;
background: #513f59;
color: #fff;
text-shadow: 0px 1px 1px #3d2545;
border-top: 10px solid #3d2545;
padding: 0.5em;
min-height: 600px;
}

div.styles1066 .boxed__standout {
border-top: 0;
}

div.styles1066:hover {
color: #b69d76;
}
div.styles1066 img {
width: 100%;
color: #fff;
text-shadow: 0px 1px 1px #3d2545;
}
div.styles1066 p {
font-size: .9em;
margin-bottom: 5px;
line-height: 1.4em;
color: #fff;
padding: 10px;
}
div.styles1066 ul {
font-size: .9em;
margin-bottom: 5px;
color: #fff;
}

div.styles1066 h2 {
margin-bottom: 5px;
letter-spacing: -1px;
line-height: 1.1em;
color: #fff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    font-size: 1.6em;
    text-transform: uppercase;
}

div.styles1066 h3 {
font-size: 1 em;
margin-bottom: 10px;
letter-spacing: -1px;
line-height: 1.1em;
color: #fff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    font-size: .8em;
    text-transform: uppercase;
}

div.styles1066 h3 a {
   color: #fff;
}

div.styles1066 h3 a:visited {
   color: #fff;
}
div.styles1066 a:visited {
    color: #fff;
}
div.styles1066 a {
    color: #fff;
    text-decoration: none;
}
div.styles1066 .callout {
    color: #fff;
}
div.styles1066 .callout a:visited {
    color: #fff;
}
div.styles1066 .calloutalign {
   text-align: center;
}
div.styles1073 {
margin-right: 5.98694%;
overflow: auto;
display: block;
margin: 10px -10px;
background: #513f59;
color: #fff;
text-shadow: 0px 1px 1px #3d2545;
border-top: 10px solid #3d2545;
padding: 0.5em;
min-height: 585px;
}

div.styles1073 .boxed__standout {
border-top: 0;
}

div.styles1073:hover {
color: #b69d76;
}
div.styles1073 img {
width: 100%;
color: #fff;
text-shadow: 0px 1px 1px #3d2545;
}
div.styles1073 p {
font-size: .9em;
margin-bottom: 5px;
line-height: 1.4em;
color: #fff;
padding: 10px;
}
div.styles1073 ul {
font-size: .9em;
margin-bottom: 5px;
color: #fff;
}

div.styles1073 h2 {
margin-bottom: 5px;
letter-spacing: -1px;
line-height: 1.1em;
color: #fff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    font-size: 1.6em;
    text-transform: uppercase;
}

div.styles1073 h3 {
font-size: 1 em;
margin-bottom: 10px;
letter-spacing: -1px;
line-height: 1.1em;
color: #fff;
    font-family: Akzidenz Grotesk Condensed;
    font-weight: 600;
    font-size: .8em;
    text-transform: uppercase;
}

div.styles1073 h3 a {
   color: #fff;
}

div.styles1073 h3 a:visited {
   color: #fff;
}
div.styles1073 a:visited {
    color: #fff;
}
div.styles1073 a {
    color: #fff;
    text-decoration: none;
}
div.styles1073 .callout {
    color: #fff;
}
div.styles1073 .callout a:visited {
    color: #fff;
}
div.styles1073 .calloutalign {
   text-align: center;
}