.imageloader li {
  list-style: none;
  margin: 0 5px 5px 0;
  background-color: grey;
  background-position: center center;
  background-repeat: no-repeat;
}

.imageloader li img {
  -webkit-transition: opacity 0.4s;
     -moz-transition: opacity 0.4s;
      -ms-transition: opacity 0.4s;
          transition: opacity 0.4s;
}

.imageloader li.is-loading {
  background: url('loading.gif') no-repeat 50% 75%;
}

/*
.imageloader li.is-loading img
{
  opacity: 0;
}
*/


/*==================================================
=            Bootstrap 3 Media Queries             =
==================================================*/

/*==========  Mobile First Method  ==========*/

/* Custom, iPhone Retina */ 
@media only screen and (min-width : 320px) {
	.top-slideshow {font-size: 26px;}
}

/* Extra Small Devices, Phones */ 
@media only screen and (min-width : 480px) {
	.top-slideshow {font-size: 30px;}
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
	.top-slideshow {font-size: 38px;}
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
	.top-slideshow {font-size: 48px;}
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {

}


/*==========  Non-Mobile First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {

}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {

}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {

}

/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px) {

}

/* Custom, iPhone Retina */ 
@media only screen and (max-width : 320px) {
    
}




/* **** Making the Navbar responsive **** */
/*
#navbar > div.navbar-header > button {
	background-color: blue;
}

#navbar > div.navbar-header > button > span {
	background-color: white;
}
/* this one definitely needs to be removed later */
#menu-main-nav li {
	padding: 30px;
}
*/