/* ====== BASIC TEXT STYLING ====== */

.centertext {
  text-align: center;
}

.lefttext {
  text-align: left;
}

.lineheight1 {
  line-height: 1 !important;
}

.textright {
  text-align: right;
}

.tinytext {
  font-size: .8em;
}

.smallertext {
  font-size:90%;
}

.bigtext {
  font-size: 125%;
}

.biggertext {
  font-size: 150%;
}

.doubletext {
  font-size:200%;
}

.tightlines {
  line-height: 100%;
}

.textbold {
  font-weight: bold;
}

.textitalic {
  font-style: italic;
}

.textunderline {
  text-decoration: underline;
}

a.nounderline {
  text-decoration: none;
  border-bottom:0;
}

.textred, a.textred {
  color: #bd0038;
}


.displaytable {
  display:table !important;
}

.indexheader {
  margin: 15px 0 0 0;
}



a img {
  text-decoration: none;
  border-bottom:0;
}


.noline a, a.noline {
  text-decoration: none;
  border-bottom:0;
}


.paddingbottom12 {
  padding-bottom: 1.2em;
}

.paddingbottom05 {
  padding-bottom: 0.5em;
}




/*** Ckeditor Accordion Custom Size ***/


.tighteraccordion > .ckeditor-accordion-container > dl {
border: none;
margin: 0;
}

.tighteraccordion > .ckeditor-accordion-container dt {
font-size: inherit;
margin: 0;
}

.tighteraccordion > .ckeditor-accordion-container > dl dt > a {
padding: .5em .5em .5em 3em;
border-bottom: none;
border-radius: .125em;
text-decoration: none;
}

.tighteraccordion > .ckeditor-accordion-container > dl dd {
margin-bottom: 1em; /* Margin at bottom of content */
}

.tighteraccordion > .ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle {
  left: 0px;
}


/*** Ckeditor Accordion Custom Color -- Gray ***/

.accordiongray {
  border: #cacaca solid 2px;
}

.accordiongray > .ckeditor-accordion-container > dl dt > a {
color: #000; /* Default title color */
background-color: #e0e0e0; /* Default title background color */
text-decoration: none;
}

.accordiongray > .ckeditor-accordion-container > dl dt.active > a,
.accordiongray > .ckeditor-accordion-container > dl dt > a:hover {
color: #000; /* Hover title color */
background-color: #cacaca; /* Default title background color */
text-decoration: none;
}

.accordiongray > .ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle:before,
.accordiongray > .ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle:after {
background-color: #000; /* Color Closed */
}

.accordiongray > .ckeditor-accordion-container > dl dt.active > a > .ckeditor-accordion-toggle:before,
.accordiongray > .ckeditor-accordion-container > dl dt.active > a > .ckeditor-accordion-toggle:after,
.accordiongray > .ckeditor-accordion-container > dl dt > a:hover > .ckeditor-accordion-toggle:before,
.accordiongray > .ckeditor-accordion-container > dl dt > a:hover > .ckeditor-accordion-toggle:after {
background-color: #000; /* Color Open */
}









/* ====== HIGHLIGHTED BUTTONS ====== */

.buttonhighlight {
  border:3px solid #b57721;
  border-right-color: #8c5b17;
  border-bottom-color: #744708;
  border-left-color: #8c5b17;
  font-weight: 1000;
  color: #4f2903;
  background-image: -webkit-linear-gradient(top, #fbefe0, #e2c59c);
  background-image: linear-gradient(to bottom, #fbefe0, #e2c59c);
}

.buttonhighlight:hover, .buttonhighlight:active, .buttonhighlight:focus {
  text-decoration: none;
  color: #3c1e04;
  background: #ddc49f;
}


/* ====== BACKUP OF NEW ORANGE BUTTONS ====== */

/*  
.button {
  border-color: #b57721;
  border-right-color: #8c5b17;
  border-bottom-color: #744708;
  border-left-color: #8c5b17;
  color: #4f2903;
  background-image: -webkit-linear-gradient(top, #fbefe0, #e2c59c);
  background-image: linear-gradient(to bottom, #fbefe0, #e2c59c);
}

.button:hover, .button:active, .button:focus {
  text-decoration: none;
  color: #3c1e04;
  background: #ddc49f;
}

.buttonhighlight {
  border:3px solid;
  border-color: #b57721;
  border-right-color: #8c5b17;
  border-bottom-color: #744708;
  border-left-color: #8c5b17;
  font-weight: 1000;
}
*/


/* ====== FORMATS THE SITE-WIDE URGENT ANNOUNCEMENT BLOCK ====== */
#block-urgentannouncements div.content {
  background:#feff94;
  border: 1px solid #ff0000;
  border-radius: 7px;
  padding: 16px;
}
#block-urgentannouncements p {
  color: red;
  font-size:.9em;
  line-height:100%;
  margin:0;
}


/* ====== COLORED BOX STYLING ====== */

.greenbox {
  background: #e1ecd2;
  border-radius: 5px;
  box-shadow: 0 1px 6px -1px #242424;
  box-sizing: border-box; 
  font-size: .9em;
  line-height: 100%;
}

.tanbox {
  background: #f6f1e9 !important;
  border: solid 2px #cfc3b4;
  border-radius: 15px;
}


.orangebox {
  background: #fdf8ed !important;
  border: solid 2px #f4dbaa;
  border-radius: 15px;
}

.padding-20-20-0-20 {
  padding: 20px 20px 0 20px;
}


.padding-0-20-10-20 {
  padding: 0 20px 10px 20px;
}

.stickybox {
  padding: 0 20px 10px 20px;
  margin-bottom: 25px;
  background: #f6f1e9 !important;
  border: solid 2px #cfc3b4;
  border-radius: 15px;
}










/* ====== 1-2 FLEXBOX POSITIONING ====== */

/* For tablets portrait and smaller */
@media only screen and (max-width: 700px) {
  .one-two-col {
    float: left;
    width: 100%;
    text-align: left;
    padding: 5px;
    margin: 10px auto;
  }
}

/* For tablets landscape and larger phones */
@media only screen and (min-width: 701px) {
  .one-two-col {
    float: left;
    width: 48%;
    text-align: left;
    padding: 5px;
    margin: 10px 1% 10px 1%;
  }
}




/* ====== WHITE BACKGROUND ====== */

.whitecontainer {
   display: table;
   padding: 10px;
   background:#fff;
   clear: both;
   width: 96%;
   margin-left: auto;
   margin-right: auto;
   margin-top: 8px;
   margin-bottom: 8px;
}

.whitebackground {
   background:#fff !important;
   border: 1px solid #CCC !important;
   border-radius: 5px !important;
}




/* ====== STYLES THE PAGE INDEX AREA FOR QUICK LINKS ====== */
.pageindex{
  background: #e1ecd2;
  float: left;
  border-radius: 5px;
  box-shadow: 0 1px 6px -1px #242424;
  box-sizing: border-box;
  text-align: left;
  padding: 5px;
  margin: 10px 5px;
}

/* ======= MEDIA QUERY -- FOR PHONE AT PORTRAIT ======= */ 
@media screen and (max-width: 505px) {
  .pageindex {
    width: 50%;
  }
}

/* ======= MEDIA QUERY -- FOR PHONE AT LANDSCAPE AND TABLET AT PORTRAIT ======= */ 
@media screen and (min-width: 505px) and (max-width: 700px) {
  .pageindex {
    width: 43%;
  }
}

/* ======= MEDIA QUERY -- FOR TABLETS AT LANDSCAPE ======= */ 
@media screen and (min-width: 701px) and (max-width: 1024px){
  .pageindex {
    width: 33%;
  }
}

/* ======= MEDIA QUERY -- FOR DESKTOPS AND TVS ======= */ 
@media screen and (min-width: 1025px) {
  .pageindex {
    width: 25%;
  }
}


















/* ====== MAKES A LINE FILL REST OF HORIZONTAL SPACE AFTER TEXT OF A HEADER ====== */

h2.headerline {
    position: relative;
}

h2.headerline span {
    background:#f9f9f6;
    padding-right: 10px;
    position: relative;
    z-index: 2; 
}

h2.headerline:after {
    content:"";
    position: absolute;
    bottom: 0;
    left: 10px;
    right: 10px;
    height: 0.5em;
    border-top: 1px solid black;
    z-index: 1; 
}



/* ====== PUTS A BLUR OVER INACTIVE FLEXSLIDER NAVIGATION ====== */

#carousel .slides img {
    opacity: 0.6;
}

#carousel .flex-active-slide img {
    opacity: 1;
}


/* ====== FORMATS THE CLOSE BLOCK BUTTONS ====== */

#block-urgentannouncements .closeblock {
  font-size: x-large;
  font-weight: bolder;
  margin-right: 10px;
  margin-top: 5px;
  border: solid 2px #a52e2e;
  border-radius: 5px;
  padding: 5px;
  line-height: .95;
  color: #a52e2e;
}





/* ======= RECIPE PICTURE POPUP DIALOG BOX ======= */ 
.recipe-pic-popup {
  display: block;
  top: 7% !important;
  left: 7% !important;
  width: 86% !important;
  height: 86% !important;
  margin-left: auto !important;
  margin-right:auto !important;
  background:#000 !important;
  border: 0 !important;
}

.recipe-pic-popup div {
  max-height: 100% !important;
  background:#000 !important;
  color: #fff !important;
  border: 0 !important;
}

.recipe-pic-popup a {
  color: #fff !important;
}









/* ====== KEEPS THE NAV MENU UNDER PAGE OVERLAYS ====== */

.block-superfish {
  z-index: 10;
}


/* ====== FORMATS THE SITE FOOTER AREA ====== */


.site-footer a {
  color:#fff;
}
.site-footer p {
  color:#fcfcfc;
}




/* ====== FORMATS THE HOSTED BY BALANCED IMPRESSIONS BLOCK ====== */

#block-balancedimpressions {
  display: table;
  margin-top:70px;
  margin-right:auto;
  margin-left:auto;
  text-align: center;
  line-height: 90%;
}

#block-balancedimpressions img {
  display: block;
  margin-right:auto;
  margin-left:auto;
  margin-bottom:0;
}

#block-balancedimpressions p {
  margin:0;
  color:#fcfcfc !important;
}

#block-balancedimpressions img a {
  text-decoration: none;
  color:#fff !important;
}

#block-balancedimpressions a {
  color:#fff !important;
}









/* ====== HEADER ====== */

@media only screen {
  #header {
    background-image: url("/files/sitebuilding/headerimage.png") !important;
    background-position: center top;
    background-repeat: repeat no-repeat;
  }
  .region-main-menu {
    position: absolute;
    top: 103px;
  }
  .region-header {
    min-height: 149px;
  }
}


@media only print {
  #header {
    display: none;
  }
  .region-main-menu {
    display: none;
  }
  .region-header {
    display: none;
  }
  .region-breadcrumb {
    display: none;
  }
  .noprint {
    display: none;
  }
}








/* ====== FORMATTING FROM ORIGINAL HARDCODED CSS --- EVENTUALLY DELETE ====== */

.recipelisticonimg {
    float:right;
    margin: 0px 0px 0px 0px;
}
.recipelistcontainer {
    overflow: auto;
    background:#fcd186;
    padding: 10px;
    border: 2px solid #5d351b;
    border-radius: 8px;
}

@media only screen and (max-width: 850px) {
    /* For tablets: */
    [class*="recipelistcontainer"] {
        width: 95%;
        clear: both;
        margin: 15px;
    }
}

@media only screen and (min-width: 851px) {
    /* For desktops: */
    [class*="recipelistcontainer"] {
        width: 45%;
        float: left;
        clear: right;
        margin: 10px;
    }
}


.imagecaptionwrapperouter {
   display: table;
   background:#fcd186;
   padding: 10px;
   border: 2px solid #5d351b;
   border-radius: 4px;
}
.imagecaptionwrapperinner {
   display: table;
}
.imagecaptionwrapper img {
   display: block;
}
.imagecaption {
    display: table-caption;
    caption-side: bottom;
    text-align:left;
    line-height: 98%;
    background-color: inherit;
}
.imagefloatright {
   float:right;
   margin: 15px 15px 0px 15px;
}
.imagefloatleft {
   float:left;
   margin: 15px 15px 15px 0px;
}
.galleryclear {
    clear: both;
}
.smallerfont {
    font-size:.80em;
}