/**************************************************************************
 * This is a boilerplate for customizing each display of a responsive
 * layout.  These will only work properly using the theme's default media
 * queries.  If you've made changes to the default settings, replace the
 * media queries found in this file with the ones generated inside of
 * sites/default/files/fusion/[theme-name].responsive.grid.css.
 *
 * Steps to activate responsive.css:
 * 1. Add your custom CSS to this file
 * 2. Rename this file to responsive.css
 * 3. Clear cached data at admin/settings/performance
 **************************************************************************/

/* Desktop display. */
@media only screen and (min-width:1200px) {
  /* Uncomment this style for an easy visual confirmation that your
   * css file is being included.  It will change the header background to
   * orange. */

/*  #header-group-wrapper {
    background-color: orange !important;
  }
*/
}

/* iPad: landscape. */
@media (min-width: 980px) and (max-width: 1199px) {

	/*Menus*/
/*	.main-menu ul.menu, .main-menu .block-superfish ul.sf-menu{
		font-size: 115%;
		letter-spacing: 0em;
	}
	.region-main-menu ul li a, .region-main-menu ul li .nolink{
		padding: 0.5em;
	}
	
	/*Content*/
/*	.js iframe {
		width: 400px;
		height: 225px;
	} */
}

/* iPad: portrait. */
@media (min-width: 768px) and (max-width: 979px){
	
	/*Menus*/
/*	.main-menu ul.menu, .main-menu .block-superfish ul.sf-menu{
		font-size: 115%;
		letter-spacing: 0em;
	}
	.region-main-menu ul li a, .region-main-menu ul li .nolink{
		padding: 0.5em;
	}
	
	/*Content*/
/*	.view .date-nav-wrapper .date-prev{
		background: none;
	}
	.view .date-nav-wrapper .date-next{
		background: none;
	}
	.date-heading a{
		font-size: 90%;
	}
	.js iframe {
		width: 400px;
		height: 225px;
	}
}

/* Mobile display. */
@media (max-width: 767px) {
	
	.panels-flexible-region-1-gateways {
		width: 100%;	
	}

	.panels-flexible-region-1-features {
		width: 100%;
	}

	#search-block-form {
    	float: left;
	}

	#Intro ul.menu a:hover {
    	padding-bottom: 0px;
    	padding-top: 0px;
	}
	#Intro ul.menu {
    	float: none;
	}
	#Intro ul.menu li.last {
    	border-bottom: medium none;
	}
	#Intro ul.menu li {
    	display: block;
    	padding-left: 0;
    	padding-right: 0;
    	padding-bottom: 5px;
    	padding-top: 5px;
    	border-bottom: thin solid #efefef;
	}
	#Footer .block {
    	max-width: 100%;
    	text-align: center;
	}
}

@media (max-width: 480px) {
		
	.panels-flexible-region-1-gateways {
		width: 100%;	
	}

	.panels-flexible-region-1-features {
		width: 100%;
	}

	#search-block-form {
    	float: left;
	}

	#Intro ul.menu a:hover {
    	padding-bottom: 0px;
    	padding-top: 0px;
	}
	#Intro ul.menu {
    	float: none;
	}
	#Intro ul.menu li.last {
    	border-bottom: medium none;
	}
	#Intro ul.menu li {
    	display: block;
    	padding-left: 0;
    	padding-right: 0;
    	padding-bottom: 5px;
    	padding-top: 5px;
    	border-bottom: thin solid #efefef;
	}
	#Footer .block {
    	max-width: 100%;
    	text-align: center;
	}

}