/* Made with Bones: http://themble.com/bones :) */
/******************************************************************
Site Name:
Author:

Stylesheet: Main Stylesheet

Here's where the magic happens. Here, you'll see we are calling in
the separate media queries. The base mobile goes outside any query
and is called at the beginning, after that we call the rest
of the styles inside media queries.

Helpful articles on Sass file organization:
http://thesassway.com/advanced/modular-css-naming-conventions

******************************************************************/
/*********************
IMPORTING PARTIALS
These files are needed at the beginning so that we establish all
our mixins, functions, and variables that we'll be using across
the whole project.
*********************/


div.bc-small-post h2.bc-entry-title {
  float: left;
  display: block;
  position: relative;
}

div.bc-small-post {
  padding: 5px;
  display: inline-block;
  margin: 5px 5px 0 5px;
  height: 95px;
  overflow: hidden;
  background-color: #dedede;
  width: 220px;
  border-style: solid;
  border-width: 2px;
  border-color: #aaaaaa;
  border-bottom-color: #909090;
  border-right-color: #909090;
  padding-bottom: 5px;
}


div.bc-post-image {
  border-style: solid;
  border-color: black;
  border-width: 2px;
  padding: 0px;
  display: block;
  float: left;
  height: 80px;
  width: 80px;
}

div.bc-post-image img {
  width:100%;
  height:100%;
}

h2.bc-entry-title {
  float: right;
  display: block;
  position: relative;
  overflow: hidden;
  width: 100px;
  padding-left: 5px;
  margin-top: -2px;
  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 11px;
  line-height: 14px;
  font-weight: 700;
  color: #424242;
}

div.bc-entry-summary {
  display:none;
}






/*********************
MEDIA QUERIES!!!
Examples:
  .header {
    min-width: 768px;
    max-width: 999px;
  }

  .d5-of-7 {
    width: 400px;
  }

*********************/

/*********************
SMALL PHONES
*********************/
@media only screen and (min-width: 481px) {
 
 
}

/*********************
TABLET & SMALLER LAPTOPS
*********************/
@media only screen and (min-width: 768px) {
 

}


/*********************
DESKTOP
*********************/
@media only screen and (min-width: 1030px) {
 

}


/*********************
LARGE VIEWING SIZE
This is for the larger monitors and possibly full screen viewers.
*********************/
@media only screen and (min-width: 1240px) {


}