/*
 * responsive.custom.css is for custom media queries that are not set via the
 * theme settings, such as cascading media queries.
 *
 * By default all the other responsive stylesheets used in Adaptivetheme use a
 * "stacking method", however cascading media queries use a waterfall method so
 * you can leverage the cascade and inheritance for all browsers that support
 * media queries.
 *
 * @SEE http://zomigi.com/blog/essential-considerations-for-crafting-quality-media-queries/#mq-overlap-stack
 *
 * NOTE: this file loads by default, to disable go to your theme settings and
 * look under the "CSS" settings tab.
 */

/*
 * The following are to float the second sidebar blocks only on tablet portrait
 * See the Adaptive Theme Float Blocks extension
 */
@media only screen and (max-width: 480px) {
  /* 
   * Float Region Blocks - custom media query CSS example:
   * 
   * Float regions blocks is an Extension you can enable in the appearance
   * settings for your theme. This feature allows you to automatically float
   * blocks in regions, you can switch it on and off depending on your
   * requirements. For design purposes you many want to remove the floats for
   * devices where the entire theme is just one column - for example small
   * mobile phones. The following CSS is inside the custom media query:
   *
   *   @media only screen and (max-width: 480px){}
   *
   * This will target devices with a maximum width of 480px - most small phones.
   * In these smaller screen sizes we can remove the float and widths so all
   * blocks stack instead of displaying horizonally. The selector used is an
   * "attribute selector" which will match on any float block class. Use your
   * inspector or Firebug to get the classes from the page output if you need
   * more granular control over block alignment and stacking.
   */
  .region[class*="float-blocks"] .block {
    float: none;
    width: 100%;
	}
}

@media only screen and (min-width: 769px) {
.region[class*="float-blocks"] .block {
    float: none;
    width: 100%;
  }
}

/* 
 * The following media queries are for formatting the Homepage Slideslow
 */
@media only screen and (max-width:580px) {
	#block-views-homepage-slideshow-block {
		display: none !important;
	}

	.view-grad-alumni-profiles td {
		padding: 3px 5px;
	}
	
	.view-grad-alumni-profiles img {
		transform: scale(0.7);
	}

	.view-grad-alumni-profiles .views-field {
		font-size: 0.8em;
	}

	.view-grad-alumni-profiles .views-field-title {
		font-size: 1.0em;
	}
}

@media only screen and (min-width:581px) and (max-width:680px) {
	#block-views-homepage-slideshow-block {
	  background: none;
	  width: 560px;
	  height: 275px;
	  margin: 0 auto;
	}

	#block-views-homepage-slideshow-block .views-field-field-slide-text {
		top: 198px;
		left: 0;
		padding: 10px;
		margin: 0;
		width: 540px;
		height: 40px;
		line-height: 20px;
		opacity: 0.8;
	}

	#block-views-homepage-slideshow-block img {
	  width: 560px;
	  height: 200px;
	  max-width: 560px;
	}

	#views_slideshow_controls_text_previous_homepage_slideshow-block,
	#views_slideshow_controls_text_next_homepage_slideshow-block {
	  top: 125px;
	  width: 36px;
	  height: 0px;
	  padding-top: 125px;
	}
}

@media only screen and (min-width:681px) and (max-width:860px) {
	#block-views-homepage-slideshow-block {
	  background: none;
	  width: 660px;
	  height: 310px;
	  margin: 0 auto;
	}

	#block-views-homepage-slideshow-block img {
	  width: 660px;
	  height: 233px;
	  max-width: 660px;
	}
	
	#block-views-homepage-slideshow-block .views-field-field-slide-text {
		top: 233px;
		left: 0;
		padding: 10px;
		margin: 0;
		width: 640px;
		height: 40px;
		line-height: 20px;
		opacity: 0.8;
	}

	#views_slideshow_controls_text_previous_homepage_slideshow-block,
	#views_slideshow_controls_text_next_homepage_slideshow-block {
	  top: 125px;
	  width: 36px;
	  height: 0px;
	  padding-top: 125px;
	}
}