/**
 * Custom media queries not set in theme settings
 *
 * 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, regardless of screen size.
 *
 * @SEE http://zomigi.com/blog/essential-considerations-for-crafting-quality-media-queries
 *
 * NOTE: this file loads by default, to disable got to your theme settings and
 * look under the "CSS" settings tab.
 *
 * - There is an SCSS (SASS) version of this file in the /sass/ directory in your
 *   sub-theme, if you set "compass watch" this file will be overwritten!
 */

/*
    ----CSS THEMING RULES----

	container-template-section -> cts
	template-section-> ts
	container-page-section-> cps
	page-section -> ps
	mini-panel-section -> ms


	container-template-section = container for template sections
	template-section = sections used in template structure
	container-page-section = container for page sections
	page-section -> sections used in pages
	mini-panel-section = section within mini panels

	---------------------------------
	#default-site-cts
	#node-cps

 ID's & Classes
 	#header-ts					.ts
 	#page-content-ts			.ts
 	#footer-ts					.ts




*/

.ts .pane-inner{ max-width:960px; width:100%; margin:0 auto; padding:0 10px;}

#search #tasks,#mobile-search-modal{display: none;}
















@media only screen and (min-width: 1181px){

	#sub-header	.center-wrapper{display: none !important;}

  .dt, .tp, .ml, .mp{display: none;}
.dt{display: block;}

}





/*Desktops/laptops and up*/
@media only screen and (min-width: 769px) and (max-width: 1180px) {
#nav-pnl{float:left;}


#sub-header	.center-wrapper,#mobile-search-modal{display: none !important;}

.dt, .tp, .ml, .mp{display: none;}
.tl{display: block;}
}

/* Tablet sizes and up*/
@media only screen and (min-width: 481px) and (max-width: 768px) {


#sub-header	.center-wrapper{display: none !important;}


.dt, .tp, .ml, .mp{display: none;}
.tp{display: block;}

}






/* Smartphone sizes and down */
@media only screen and (min-width: 321px) and (max-width: 480px) {


.social-panels{display: none !important;}


.dt, .tp, .mp{display: none;}
.ml{display: block;}




}

@media only screen and (max-width: 320px) {

.social-panels{display: none !important;}


.dt, .tp, .mp{display: none;}
.ml{display: block;}

}