.footer-popular .wpp-post-title {
  display: none;
}

.wpp-list li {
  float: left;
  display: inline-block;
  clear: none;
}

.instagram-pics li {
   float: left;
   width: 50%;
   padding-top: 5px;
   padding-right: 5px;
   padding-bottom: 5px;
   padding-left: 5px;
}

/*
  ============================================
  NOTES by Bill
  ============================================

  COLORS

    green
    = rgba(102, 161, 6, .8)
    = 

    pink
    = rgba(234, 33, 69, .8)
    = 

    yellow
    = rgba(252, 176, 25, .8)
    = 

    mint
    = rgba(176, 222, 210, .8)
    = 


 *
 *
 */

/*
  ============================================
  HEADER widgets
  ============================================
 *
 *  INCLUDES: everything above the navigation bar
 */

/*  removes the default header
 *  ,  because the default header can't contain widgets
 *  ,  .before-header is acting as the header
 */
.site-header {
  display: none;
}

/*  acting as the header container
 */
.before-header,
.before-header .entry-title a {
  background: #FFFFFF;
  padding: 0px;
}

/* coloured top bar */
.header-top {
  opacity: 0.9;
  height: auto;
  background-color: #fcb019;
  width: 100% !important;
  max-width: 100% !important;
  text-align: left;
  padding: 10px 0 10px 0;
  margin: 0px 0px 22px 0px !important;
}
.header-top > .widget-wrap {
  max-width: 1100px !important;
  margin: 0 auto !important;
  padding: 0 0 0 10px;
}
.header-top a {
  margin: 0px 10px 0px 0px;
  font-weight: 300;
  font-size: 16px;
  font-family: "Source Sans Pro","Helvetica Neue",sans-serif;
  text-decoration: none;
  color: #FFFFFF;
}

.header-subscribe {
  top: -58px;
  height: 0px;
  position: relative;
  background: none;
  width: 100% !important;
  max-width: 100% !important;
  float: right;
  padding: 0px;
  margin: 0px 7px 0px 0px !important;
  pointer-events: none;
}
.header-subscribe > .widget-wrap {
  max-width: 1100px !important;
  margin: 0 auto !important;
  padding: 0 10px 0 0;
}
.header-subscribe #subbutton {
  background: #FFFFFF;
  color: rgb(124, 124, 124);
  width: 100px;
  position: relative !important;
  right: -307px !important;
  pointer-events: auto;
}
.header-subscribe #subbox {
  background: #FFFFFF;
  color: rgb(124, 124, 124);
  float: right;
  width: 300px;
  position: relative !important;
  right: 104px !important;
  pointer-events: auto;
}
.header-subscribe #subbox::-webkit-input-placeholder { /* WebKit, Blink, Edge */
  color: rgb(124, 124, 124);
}
.header-subscribe #subbox:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
  color: rgb(124, 124, 124);
}
.header-subscribe #subbox::-moz-placeholder { /* Mozilla Firefox 19+ */
  color: rgb(124, 124, 124);
}
.header-subscribe #subbox:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: rgb(124, 124, 124);
}

.header-logo {
  width: 300px;
  position: relative;
  overflow: auto;
}

.header-search {
  opacity: 0.5;
  height: 0px;
  top: -20px;
  position: relative;
  width: 100% !important;
  max-width: 100% !important;
  text-align: left;
  padding: 0;
  margin: 0 !important;
  float: left;
  pointer-events: none;
}
.header-search:hover {
  opacity: 1;
}
.header-search > .widget-wrap {
  max-width: 1100px !important;
  margin: 0 auto !important;
  padding: 0 0 0 10px;
}
.header-search [type="search"] {
  border: 1px solid #fff;
  padding: 10px;
  width: 200px !important;
  pointer-events: auto;
}

.header-social {
  height: 0;
  position: relative;
  width: 100% !important;
  max-width: 100% !important;
  text-align: left;
  top:-18px;
  padding: 0;
  margin: 0 0 22px 0 !important;
  float: right;
  pointer-events: none;
}
.header-social > .widget-wrap {
  max-width: 1100px !important;
  margin: 0 auto !important;
  padding: 0 10px 0 0;
}
.header-social ul {
  margin: 0; 
}
.header-social ul li{
  opacity: 1;
  float: right;
  margin: 0 0 0 10px !important;
  pointer-events: auto;
}
.header-social ul li:hover {
  opacity: 0.5;
}

/*
  ============================================
  NAVIGATION BAR
  ============================================
 *
 *  INCLUDES links to main pages, ex(DIY, Printables, Recipes, Shop)
 */

/* titles */
.menu-item a {
  font-family: "Source Sans Pro","Helvetica Neue",sans-serif;
  font-weight: 300;
  font-size: 20px;
}

/*
  ============================================
  SIDEBAR widgets
  ============================================
 */

/* all */
.sidebar .widget {
  margin: 0px;
} .sidebar .widget img {
  margin: 0px;
}

/* all: body */ 
.sidebar .widget-title + div {
  background-color: #F2F2F2;
  padding: 20px 20px 15px 20px;
  margin: 0px;
}

/* all: titles */
.sidebar .widget-title {
  background-color: rgba(234, 33, 69, .8);
  margin: 0px 10px 10px 10px;
  top: 20px;
  position: relative;
  width: 66%;
  text-align: left;
  padding-left: 10px;
  font-weight: 300;
  font-size: 20px;
  text-transform: uppercase;
  color: white;
  letter-spacing: 5px;
  line-height: 1.7;
}

/* img widgets: bg */
.sidebar .widget_sp_image-image-link img {
  background-color: #F2F2F2;
  padding: 10px;
}

/* welcome: text bg */
.sidebar-welcome .widget_sp_image-description {
  background-color: #F2F2F2;
  padding: 10px 20px 10px 20px;
  margin: -10px 25px 0px 0px;
}

/* celebrate: bg */
.sidebar-celebrate article {
  background-color: #F2F2F2;
  margin: 0px;
  padding: 10px 10px 3px 5px !important;
}
.sidebar-celebrate article.first {
  padding: 10px 5px 3px 10px !important;
}

/* instagram: bg */
.sidebar-instagram .textwidget {
  padding: 0px !important;
}
.sidebar-instagram #sb_instagram {
  padding-bottom: 0px !important;
}

/* ad: div */
.sidebar-ad {
  margin-top: 25px !important;
}

/* titles: green colour */
.sidebar-green .widget-title {
  background-color: rgba(102, 161, 6, .8);
}

/* titles: pink colour */
.sidebar-pink .widget-title {
  background-color: rgba(234, 33, 69, .8);
}

/* titles: yellow colour */
.sidebar-yellow .widget-title {
  background-color: rgba(252, 176, 25, .8);
}
/* titles: mint colour */
.sidebar-mint .widget-title {
  background-color: rgba(176, 222, 210, .8);
}

/*
  ============================================
  HOMEPAGE content
  ============================================
 */

/* see more link on homepage */
.see-more {
  background-color: rgb(176, 222, 210) !important;
  color: #FFFFFF  !important;
  font-family: "Source Sans Pro","Helvetica Neue",sans-serif;
  font-weight: 300;
  font-size: 15px;
  text-decoration: none;
  min-width: 50px;
  margin: 5px 0px 10px 0px;
  padding: 9px 19px;
  letter-spacing: 2px;
}
.see-more:hover {
  background-color: #FFFFFF  !important;
  color: rgb(176, 222, 210) !important;
}

/* add bot-margin to see-more button */
.see-more-container {
  margin-bottom: 20px;
}

/*  slideshow: descriptive text
 *  , same font as sidebar widget titles
 */
.home-slideshow #genesis-responsive-slider h2 a {
  background: none repeat scroll 0% 0% rgba(256, 256, 256, .8);
  font-weight: 300;
  font-size: 24px;
  color: rgb(0, 0, 0);
  padding: 8px 15px 9px 15px;
}

/* featured post (first): read more button */
.home-featured .more-link {
  position: static;
}

/*
  ============================================
  SORTABLE plugin
  ============================================
 */

/* Blog Roll: Titles */
.sortable-row h2 a {
  text-decoration: none;
  color: #444;
}
.sortable-row h2 a:hover {
 color: #9bd0be;
}

/* Blog Roll: Readmore Button */
a.more-link {
  background-color: rgba(176, 222, 210, 1) !important;
  color: #FFFFFF !important;
  font-family: "Source Sans Pro","Helvetica Neue",sans-serif;
  font-weight: 300;
  font-size: 15px;
  border: none !important;
  transition: none !important;
}
a.more-link:hover {
  color: rgba(176, 222, 210, 1) !important;
  background-color: #FFFFFF !important;
  transition: none !important;
}
.sortable-description .more-link {
  background-color: rgba(176, 222, 210, 1) !important;
  color: #FFFFFF !important;
}
.more-link:hover {
  color: rgba(176, 222, 210, 1) !important;
  background-color: #FFFFFF !important;
}

/*  Blog Roll: post description
 *  , not sure why this was important to remove
 */
.sortable-description > p {
  display: none;
}

/* Blog Roll: Pagination */;
.sortable-pagination li {
  background-color: rgba(176, 222, 210, 1) !important;
  color: #FFFFFF !important;
  border: none !important;
  transition: none !important;
}
.sortable-pagination li:hover {
  color: #FFFFFF !important;
  background-color: #777777 !important;
  border: none !important;
}
.sortable-pagination li a {
  text-decoration: none;
}
.sortable-pagination li a:hover {
 color: #FFFFFF !important; 
}
.sortable-pagination,
.sortable-pagination li,
.sortable-pagination li a {
  border-bottom: none !important;
  border-top: none !important;
  border-right: none !important;
  font-family: "Lato","Helvetica Neue",sans-serif;
  font-weight: 200;
}

/* Dropdown Menu: remove unwanted filters
*
* "post_format" is not used
* "avhec_catgroup" is part of the "AVH Extended Categories plugin", it doesn't work for sorting posts within this plugin
* "course" for recipes could be useful in the future
* "cuisine" for recipes could be useful in the future
*
*/
.sortable-drop-post_format,
.sortable-drop-avhec_catgroup,
.sortable-drop-course,
.sortable-drop-cuisine {
  display: none; 
}

/*  Dropdown Menu: reduce width to fit onto a single line
 *  , this doesn't do anything because a php file over rules it
 *  , I manually changed 210 to 194, in the sortable:categories plugin php file 
.sortable-dropdown-toggle {
  min-width: 194px !important;
}
 */

/*  Dropdown Menu Items:
 *  , margin is manually changed from 5px to 2px in the sortable:categories plugin php file
.ul.sortable-dropdown-ul > li {
  margin: 2px !important;
}
 */

/*  Dropdown Menu Items:
 *  , remove bullet points
 *  , increase L&R padding
*/
.sortable-dropdown-ul > li {
  list-style-type: none !important;
  padding: 3px 7px !important;
}

/* Dropdown Menu Items: sort by date, remove txt underline */
.sortable-dropdown-ul > li > a {
  text-decoration: none !important;
}

/*  Dropdown Menu: bg more opaque, increase L&R padding */
ul.sortable-dropdown-ul {
  background: rgba(299,299,299,0.95);
  padding: 0px 1px !important;
}

/*
  ============================================
  SITE FOOTER
  ============================================
 */

/* remove theme's copyright footer */
.site-footer p {
  display: none;
}

/*
  ============================================
  POST FOOTER
  ============================================
 */

/*  makes after post widget full width instead of half
 *  , this is not a custom css class
 */
.after-entry .widget {
  width: 100%;
}

/*
  ============================================
  ============================================
  MOBILE LAYOUT
  ============================================
  ============================================
 */

/* First theme controlled layout adjustment */
@media only screen and (max-width: 1139px) {
  /* align pre-navigation-bar elements with navigation bar */
  .before-header > section > .widget-wrap {
    max-width: 958px !important;
    padding: 0;
  }
}

/* Second theme controlled layout adjustment
*this is when the sidebar moves to the bottom of the page */
@media only screen and (max-width: 1023px) {
  /* align pre-navigation-bar elements with navigation bar */
  .before-header > section > .widget-wrap {
    max-width: 904px !important;
    margin: 0 !important;
  }
  .header-top > .widget-wrap,
  .header-search > .widget-wrap {
    padding: 0 0 0 50px !important;
  }
  .header-subscribe > .widget-wrap,
  .header-social > .widget-wrap {
    padding: 0 50px 0 0 !important;
    float: right !important;
  } 
  /* resize/move sidebar elements into 3 coloumns */
  .sidebar .widget {
    margin: 0px 0px 0px 20px;
    width: 30%;
    clear: both;
    display: inline-flex;
  }
  .sidebar-welcome {
    width: 100% !important;
  }
  .sidebar .widget-title + div {
    padding: 15px 15px 10px 15px;
  }    
  .sidebar .widget-title {
    min-width: 160px;
  }
  .sidebar-welcome .widget-title {
    max-width: 160px;
  }
  .sidebar-welcome + div,
  .sidebar-instagram + div,
  .sidebar-downloads + div,
  .sidebar-makeit + div,
  .sidebar-videos + div,
  .sidebar-hometour + div,
  .sidebar-partners + div,
  .sidebar-crediting + div {
    width: 100%;
  }
  /* remove widgets too tall to fit as a grid, this is a poor solution */
  .sidebar-welcome,
  .sidebar-instagram,
  .sidebar-makeit,
  .sidebar-hometour {
    display: none !important;
  }
  /* force footer to remain 3 columns & with a shorter height */
  .footer-widgets > .wrap {
    display: inline-flex;
    max-height: 275px;
  }
}

/* Third theme controlled layout adjustment
*this is when the navigation bar becomes a drop-down menu*/
@media only screen and (max-width: 940px) {
   /* align pre-navigation-bar elements with navigation bar */
  .before-header > section + .widget-wrap {
    max-width: 830px !important;
  }
  .header-top .textwidget {
    text-align: center;
  }
  /* make header bg colour lighter */
  .header-top {
    opacity: 0.6;
  }
  /* remove subscribe widget from header*/
  .header-subscribe {
    display: none;
  }
   /* moves the search and social media widgets into the navigation bar */
  .header-search {
    opacity: 0.4;
    position: absolute;
    top: 204px;
    z-index: 2;
  }
  .header-social {
    opacity: 0.4;
    position: absolute;
    top: 206px;
    z-index: 2;
  }
  .header-logo {
    margin: 0 auto 20px auto !important;
  }
  .menu-toggle {
    z-index: 1;
  }
  .header-social > .widget-wrap {
    padding: 0 5% 0 0 !important;
    float: right !important;
  }
  .header-search > .widget-wrap {
    padding: 0 0 0 5% !important;
  }
}

@media only screen and (max-width: 767px) {
  /* remove subscribe widget from footer (to save space) by removing the 3rd column widget area */ 
  .footer-widgets-3 {
    display: none;
  }  
}

@media only screen and (max-width: 660px) {
  .sidebar .widget {
    width: 45%;
  }
  .header-search,
  .header-social {
    display: none;
  }
  
  .sidebar-instagram,
  .sidebar-downloads,
  .sidebar-makeit,
  .sidebar-videos,
  .sidebar-hometour,
  .sidebar-partners,
  .sidebar-crediting {
    display: none !important;
  }
}

@media only screen and (max-width: 464px) {
  .sidebar .widget {
    width: 100%;
    margin: 0;
  }
  .sidebar .widget div {
    width: 100%;
    margin: 0;
  }
  .sidebar-instagram,
  .sidebar-downloads,
  .sidebar-makeit,
  .sidebar-videos,
  .sidebar-hometour,
  .sidebar-partners,
  .sidebar-crediting {
    display: none !important;
  }
  .header-top {
    display: none;
  }
}